jordanlaclair / candleaf-mern

Candleaf

Live Demo

🟢Live Demo🟢 Heroku removed their free tier and deleted my account/data lol

General

My first "big" project I've made using MERN stack that has user authentication / login functionality. Candleaf is a prototype store that delivers eco-sustainable, carefully handmade candles. This first started as a practice project so that I can learn MongoDB but quickly escalated. This is by no means the perfect MERN project as this was purely a for-fun project where I got to use so many new technologies for the first time and there still may exist bugs, however this is my proudest project yet as I've learned so much from it throughout the journey. I transferred from JavaScript to Typescript in the middle of the project as I realized it would help immensely to avoid type errors and my inspiration was from Figma for the designing aspect of the project.

Technologies

• React ⚛️
• MongoDB 🍃
• Mongoose 🍃
• Express 🚄
• NodeJS
• Typescript (type checking)
• Netlify (hosting + free SSL)
• Heroku (backend)
• Styled Components 💅
• React Router DOM (routes, rerouting, authentication)
• Auth-0 (authentication)
• Redux (state management)
• Redux Persist (persisted state to local storage)
• React-country-region-selector (for user country/region form selection)
• React-Lottie
• Rellax JS
• Material UI

Conclusion

By the end of the project I realized that GraphQL probably would've been a way better option instead of a RESTful API since I was retrieving a lot of unnecessary data in the backend that was ultimately unused. With GraphQL this would negate this unnecessary requested data by only retrieving the data that is needed. This is something that I will keep in mind for the future and I'm excited to learn.