Building ecommerce website with React Js + Next Js + TypeScript + Node Js + Express + MongoDB + Material-UI + Tailwind-CSS ⚡️ Made with developer experience first ESLint + Prettier + VSCode setup with complete user authentication (a mobile-friendly).

• Author
• Demo
• Technologies
• Optimizations
• Contributing
• Status
• Features
• Inspiration
• Related Projects
• Support
• Feedback
• Run Locally
• Screenshots

Client:

• React Js
• Next Js
• TypeScript
• Redux
• Tailwind CSS
• Material-UI
• Material-UI
• Vercel Hosting

Server:

• Node.js
• Express
• MongoDB
• JSON Web Token (JWT)
• bcryptjs
• Heroku Hosting

• Next' Js Image component
• Next' Js file-system based router
• Next' Js Server-side rendering
• Memoization (useMemo, Memo)
• Function components
• React hooks
• React useEffect cleanup
• TypeScript

• Complete user authentication
• Users can sign in
• Users can sign out
• Users can verify email
• Users can Change Password
• View all products
• View products detail
• Filter products by category
• Search for products
• Add products to their basket
• Checkout total payment
• Checkout order page
• Products pagination
• Stripe Checkout/Payments (TODO)

• Complete Admin Authorization
• Add products
• Update products
• Delete products
• Limit Products
• Add Users
• Update Users
• Delete Users
• Update User Role

Contributions are always welcome!

For support, email [email protected].

If you have any feedback, please reach out to me at [email protected]

Twitter https://twitter.com/ArbaaSaddam/

Linkedin. https://www.linkedin.com/in/saddamarbaa/

Github https://github.com/saddamarbaa

Instagram https://www.instagram.com/saddam.dev/

Facebook https://www.facebook.com/saddam.arbaa

Clone the project

https://github.com/saddamarbaa/Ecommerce-website-next.js-typeScript

Go to the project directory

  cd Ecommerce-website-next.js-typeScript

Install dependencies

yarn install
# or
npm install

Start the server

npm run dev
# or
yarn dev

ESLint + Prettier + Lint-Staged Check

yarn lint
# check-types errors
yarn check-types
# check code format
yarn check-format
# check lint errors
yarn check-lint
# format code and fix prettier erros
yarn format
# test all ESLint + Prettier + types erros
yarn test-all
# or if You're using npm you can use npm instead of yarn for all the above ESLint + Prettier + Lint-Staged Check steps

Project is: in progress I'm working on it in my free time

Build By Saddam Arbaa Project inspired by [Amazon] https://www.amazon.com