The modern e-commerce application is developed using React, Redux, and React Hooks, integrated with Firebase and the Stripe API. The project is set up with Vite and styled using SCSS.
It is based on the ZeroToMastery React Course.
Table of Contents
-
Clone the repository:
git clone https://github.com/RanitManik/crwn-clothing-v2.git cd crwn-clothing-v2
-
Install dependencies:
npm install
-
Set up environment variables:
Create a
.env.local
file in the root directory of your project and add your Firebase configuration values. Use the.env.example
file as a template. -
Run the development server:
npm run dev
To configure Firebase for this project:
- Go to the Firebase Console.
- Create a new project or use an existing one.
- Navigate to the project settings and locate your Firebase configuration.
- Copy the configuration details and replace the placeholders in your
.env.local
file.
In the project directory, you can run the following scripts:
Runs the app in development mode. Open http://localhost:5173 to view it in the browser.
Builds the app for production to the dist
folder. It correctly bundles React in production mode and optimizes the
build for the best performance.
Lints the codebase using ESLint. This ensures your code adheres to specified linting rules and conventions. It
checks .js
and .jsx
files, reports any unused disable directives, and sets the maximum number of warnings to 0.
Previews the production build locally. Useful for testing the production build before deploying.
Formats the codebase using Prettier. It targets all .js
and .jsx
files within the src
directory to ensure
consistent code formatting.
Here is an overview of the project's structure:
crwn-clothing/
├── public/
├── src/
│ ├── assets/
│ ├── components/
│ ├── routes/
│ ├── App.jsx
│ ├── main.jsx
│ ├── index.scss
│ └── utils/firebase/
│ └── firebase.utils.js
├── .env.example
├── .env.local (not included in version control)
├── .gitignore
├── .prettierrc
├── index.html
├── .eslintrc.cjs
├── vite.config.js
├── package.json
└── README.md
Contributions are welcome! Please follow these steps:
-
Fork the repository:
Click the "Fork" button at the top right of the repository page.
-
Create a new branch:
git checkout -b feature-branch
-
Make your changes:
Implement your feature or fix the bug.
-
Commit your changes:
git commit -m 'Add some feature'
-
Push to the branch:
git push origin feature-branch
-
Open a pull request:
Go to the original repository on GitHub and click the "New Pull Request" button.
This project is licensed under the MIT License. See the LICENSE file for more information.
This project, CRWN Clothing, is a testament to the collaborative effort and educational resources provided by the developer community and online learning platforms. I would like to express our gratitude to the following:
-
Zero To Mastery Academy: A special thanks to the Zero To Mastery Academy, Andrei Neagoie and Yihua Zhang for their comprehensive React Course. The course's practical and hands-on approach provided the foundation and inspiration for this project.
-
Open Source Libraries and Tools: This project leverages numerous open-source libraries and tools, including React, Redux, Firebase, and Stripe API. I am grateful to the developers and maintainers of these libraries for their continuous effort in creating and maintaining high-quality tools that make building modern web applications possible.
-
The Developer Community: A heartfelt thank you to the developer community for the constant support, feedback, and contributions. Your discussions, tutorials, and shared knowledge have been invaluable in the development process.
-
Contributors: To all those who have contributed to this project through code, documentation, or any other form of support, your efforts are greatly appreciated. Your contributions have helped improve the quality and functionality of the project.
-
Friends and Family: Lastly, a big thank you to our friends and family for their unwavering support and encouragement throughout the development of this project.
I hope that this project not only serves as a valuable resource for others but also encourages further learning and development within the community.
Thank you for exploring the crwn-clothing-v2! Happy coding! 🚀