Before entering the second phase of my course, the last few months of my life have been solely focused on the basics of JavaScript, html, and css. It was such a pleasant surprise to step into React and see that things really do get more simple. The biggest thing that clicked with me in React was the separation of components. My brain tends to works in a very puzzle driven manner, so separating each 'component' into its own puzzle piece really brought things together for me. Components really allowed me to see my creation from afar and see each piece being brought together to bring something final. Client side routing also allowed me to separate these components into separate parts of my website to really allow for some user interaction and proper sectioning.
For our Phase-2 project, I created a snowboard store from an admin perspective. This website gave the user, or admin, the ability to run his online store with a persisting inventory to which he could add to and search from. On the sites header, the user could navigate from the home page, to the form to add a snowboard to his inventory, as well as an 'about us' page to give the online-shoppers some contact information.
Below is a tree showing the breakdown of how all of the components are brought together. I really thought having this visual and seeing the site come together was the best part about learning React. Vanilla Javascript was very eye opening simply learning how to code, but I feel this phase finally brought me to seeing what coding could really build. Going back to the tree, you can see the routes are contained in the header since that's where you'll have the ability to navigate through the 'home', 'add snowboard', and 'about us' tabs. My snowboard page contains a search bar as well as all of the snowboard cards (store listing) which has the snowboard image, price, style, etc. In a separate component, you can see the 'addForm' which will take us to the 'add a snowboard' tab and give the user the ability to display his new products as they come in.
Still making some final tweaks to my website, but I look forward to updating this post with a gif of our fully functioning and very first personal project. Thanks for tuning in to the While at Flatiron School Chronicles. I will indeed add my GitHub link to this project for anyone who wants to check out my creation.
phase-2-project
Pao's Snowboard Shack
Usability
The website will be presented from an admin point of view. The user will be able to run their website with the following capabilities:
-
Seaminglessly navigate through the website's home, about us, and add snowboard page.
-
Add new products as they come in which will persist inside of the database.
-
Search for products via model, size, terrain, and brand.
Top comments (0)