Eco Plants is an e-commerce web application that offers a wide variety of plants for sale. The project is built using React, a popular JavaScript framework for building user interfaces. The development of this project required advanced knowledge of React and JavaScript, as well as proficiency in various other techniques such as React Redux, API integration, and database usage.
In addition to React, foundational web technologies such as HTML, CSS, and Bootstrap were utilized to create the appropriate page structure and visual design. The project had a time constraint of 160 hours, and although some adjustments and changes were made throughout the development process, the primary objectives of the project were successfully accomplished.
The key features of the project include:
- Viewing products on the website
- Adding products to the shopping cart
- Entering shipping details and making payments
- The implementation of Redux to manage the state of the shopping cart and the integration of Stripe for secure and reliable payment processing were particularly challenging aspects of the project.
To run the Eco Plants locally, follow these steps:
- Clone the repository:
git clone https://github.com/Wiktoria2308/Eco-Plants.git
- Install the dependencies:
npm install
- Create .env file and update the environment variables with your Firebase and Stripe credentials.
VITE_FIREBASE_API_KEY=
VITE_FIREBASE_AUTH_DOMAIN=
VITE_FIREBASE_PROJECT_ID=
VITE_FIREBASE_STORAGE_BUCKET=
VITE_FIREBASE_MESSAGING_SENDER_ID=
VITE_FIREBASE_APP_ID=
VITE_STRIPE_API_KEY=
VITE_STRIPE_SECRET_KEY=
Start the development server by running the following command:
npm run dev
The application will be accessible at http://localhost:3000 in your web browser.
React React Redux React Router DOM Firebase Stripe HTML CSS Bootstrap JavaScript Axios Sass UUID For a complete list of dependencies and dev dependencies, please refer to the package.json file.
Eco Plants project demonstrates the successful creation of an e-commerce platform for selling plants. Through the utilization of React and various complementary technologies, the project achieved its primary goals of providing an intuitive and functional user interface for browsing and purchasing plants.