Final Article!
After a few weeks of blood, sweat, and tears we have finally finished building our mircofrontend!
Final Look
Link to mircofrontend: https://project2-micro-frontend.vercel.app/
Q&A:
Q. How many elements did you end up going with? Why did you break it up that way?
A. The three main elements of this mircofrontend are:
- Badge-Card: Carves out the layout and content of a single badge. Sort of a template for our badges.
- Badge-List: This is where the main portion of the search and render aspect is located. This creates the top box used for search and bottom box used to display the badges.
- Search-Widget: This creates the search symbol and input field that holds the value of the user search.
All of these work together to create, search, fetch, and display our badges from the backend API.
Q. What was the hardest aspect of this?
A. Some hard aspects were
- Learning how to get the search input from the user, to then fetch the data from the backend to render it on the frontend. It took a lot of trial and error to figure out the search functionality.
- Aligning the contents of the divs in the badge card to line up as we wanted them to.
- Trying to figure out how to not have all the badges from the backend displayed on the frontend.
Q.What part of this project was easier than you expected?
A.One part of the mircofrontend that was easier than expected was getting the badges from the API backend to render on the frontend. We believed that that was going to be the hardest part of the project, but it was easier than expected.
Top comments (0)