jhm-ciberman/ecommerce-react-app

Coderhouse - Ecommerce project

Note

➡️ CHECK THE LIVE DEMO HERE: https://laretto-react-app.web.app/

A simple ecommerce project for the Coderhouse ReactJS course. The project uses:

• 🚀 ReactJS for the frontend
• 🎨 TailwindCSS for styling
• 🔥 Firebase Firestore for the NoSQL database
• 🌐 Firebase Hosting for deployment
• 🧹 ESLint for code style and formatting
• 🤖 GitHub Actions for Continuous Deployment

Installation

git clone git@github.com:jhm-ciberman/ecommerce-react-app.git
npm install

Running the app

npm run dev

Code style and formatting

This project ESLint for code style and formatting. To run the linter, use the following command:

npm run lint

You can also install the ESLint extension for VSCode.

Although the coderhouse course is in Spanish, this project is written in English. If you have any complaint about this, feel free to click here.

Building for production

npm run build

The production build will be in the dist folder.

Populating the database

To populate the database with products, first copy your service-account-key.json file to the admin folder. Then run the following commands:

cd admin && npm install && node import-products.js

The script will create a products collection in your database and populate it with the products from the fake store API. (https://fakestoreapi.com/products)

Warning

DO NOT upload this script to a production server. It is only meant to be run > once in a local environment to populate the database with products.

Warning

DO NOT run this script twice. It will duplicate the products in the database.

Notes

This project uses tailwind so it's recomended that you instruct in your .vscode/settings.json to use tailwind for autocompletion:

{
    "files.associations": {
        "*.css": "tailwindcss",
        "*.jsx": "javascriptreact",
    },
    "editor.quickSuggestions": {
        "strings": "on"
    },
}

License

MIT