This is a solution to the Product feedback app challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
This is a Full Stack Application, you can view the backend code here -> Backend
Users should be able to:
- View the optimal layout for the app depending on their device's screen size
- See hover states for all interactive elements on the page
- Create, read, update, and delete product feedback requests
- Receive form validations when trying to create/edit feedback requests
- Sort suggestions by most/least upvotes and most/least comments
- Filter suggestions by category
- Add comments and replies to a product feedback request
- Upvote product feedback requests
- Solution URL: Github
- Live Site URL: Product Feedback App
- React - JS library
- Styled Components - For styles
- React Responsive - For responsive design
- React Router - For page routing
- React Query - For data fetching, caching & state management
- Axios - For Api calls
- Mongo DB & Mongoose
- Node js & Express
- Jest for Backend integration Tests
- JWT for authentication
This was my first full-stack application as a front end developer. I have to say the full-stack world is fascinating. This project definitely took me out of my comfort zone. I learnt how to work with data and databases. I also learn how to create Api's that connected my database to my front end application. It was quite fun.
I plan to add a drag and drop functionality on the roadmap page, I have made a branch for that feature, it's quite a challenge but I think I would be able to implement it.