Urban Grace is a one-page e-commerce website created as a personal challenge, built from scratch without using frameworks or libraries. Future enhancements may include incorporating frameworks or libraries as needed.
- HTML5
- CSS3
- Vanilla JavaScript
- Fake Store API
- Cypress for end-to-end tests
✅ Established a project board on GitHub, viewable here.
✅ Created different issues for different functionalities/bugs, which can be seen here.
✅ Created separate branches and pull requests for each feature and fix. Check them out here.
✅ Implemented a CI/CD pipeline for E2E Cypress tests via GitHub Actions, accessible here.
✅ Deployed on Netlify, live version available here.
- Adds/deletes products from the cart.
- Filters the products by categories.
- Responsive design using CSS grid and flexbox.
- Shopping cart functionality as a responsive modal.
localStorage
integration for cart persistency.
- Allow users to click anywhere outside the cart to close it.
- Generates alerts for successful actions, failures, and other events.
- Addition of a
product details
page - Create a
checkout
page
1. Clone the repo:
git clone https://github.com/rdpfeifle/ecomm-store-js
2. Navigate to the project directory and open it in your preferred IDE.
cd ecomm-store-js ; code .
3. Install dependencies for the project:
npm install
4. Start the app by running the following command. This will launch a local server:
npm start
Then, access the app in your browser at http://127.0.0.1:8080
.
This project is licensed under the MIT License.