See GitHub Repository
See Live Preview

This full-stack project is the largest project in the web development curriculum. The goal was to use the popular MERN stack (MongoDB, Express, React and Node.js) to build our first full-stack project. We learned about software architecture patterns, how to define our own endpoints in our REST API, request/response anatomy and etiquette, where and how to apply middleware and restrictions for security, and gained an understanding of the many things to be considered when choosing an approach and a tech stack for a project.

I learned a lot about user experience in the process of building this project, and realised that while there is rarely one single "best" way to solve a problem, best practices tend to exist for a reason. I learned a lot more from the mistakes I made than from what I managed to get right the first time.

I chose cocktail recipes as the theme for my project, letting users upload recipes for their favourite cocktails. User and cocktail data is stored in MongoDB, and images are stored in Cloudinary. Authentication is handled by Passport with JWT bearer token strategy. The project has full CRUD (create, read, update, delete) functionality: my users can edit and delete their recipes, as well as their profiles, and favourite and comment on the recipes of other users.