Skip to content

nadiamariduena/react-mern-21-frontend

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

60 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation



NOVE e-boutique




I started this project out of curiosity, I wanted to see the advantages & disadvantages in building an e-commerce app using React, Commercejs and stripe and an app build with (Mongodb, Express, React and Nodejs | MERN).




THE MOTIVATION


  • The main motivator for this project was my curiosity as well as my desire to expand my knowledge. Due to the disastrous effect the pandemic had on the small businesses I used to visit, I decided I wanted to find a way to create websites and e-commerce stores that any business owner could use to represent their wares online, be it small or big.

  • Although it isn't fully functional yet, as there is a final error I have to correct to publish it on the web, this is the result of my work.

  • Aside from that I wasn't entirely satisfied with the design so I customized it as you can see from the preview shown above.




CREDITS:

Big thanks to Safak , for sharing this Great tutorial on how to set up an E-commerce store using: Node.js | E-Commerce | MongoDB | Stripe & JWT.





INDEX

I tried to comment all the steps I considered to be commented (just in case).


  1. default-home-and-navbar
  2. announcement-slider
  3. categories-and-products
  4. newsletter-and-footer
  5. product-and-ProductList-page
  6. register-and-login-page
  7. cart-checkout-page
  8. responsive



PLAYING AROUND


  • I Created a parallel repository to work on the routes, to have a better preview of the project and also to test the new things i ve been learning lately.

  • This repository contains the original set up (without the routing), that will be used to continue with the part of the tutorial (the backend)




Customizing the original Design

I changed all the original images and design palette for the ones you see on the image below.
I also tested different things that you don't have in the video tutorial, you can find them in my Notes




📓 NOTES:

  • Common errors, interesting findings, refreshing knowledge, to do list (bugs to solve) ...etc




CREDITS

The Part 1 / video tutorial: The Frontend




CREDITS IMAGES



Fashion Photography:
  • Oladimeji Oduns
  • Raphael Lovaski
  • Soroush Golpoor

Product Photography:
  • Trinh Minh

Images found at: unsplash