Skip to content

🛒Ecommerce website using React and Golang, clean and smart architecture.

License

Notifications You must be signed in to change notification settings

wxcvbni838/ecommerce-react

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

65 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Ecommerce React 🛒

Welcome to the Ecommerce React repository! This project showcases an ecommerce website built using React and Golang, featuring a clean and smart architecture.

Download Releases

Table of Contents

Features

  • User authentication with JWT
  • Product management
  • Shopping cart functionality
  • Order processing
  • Admin dashboard for managing products and orders
  • Real-time data monitoring with Grafana and Prometheus
  • Scalable architecture using Docker and Kubernetes

Technologies Used

This project employs a variety of technologies to ensure performance and scalability:

  • Frontend: React
  • Backend: Golang with Gin Gonic
  • Database: PostgreSQL
  • Caching: Redis
  • Storage: MinIO
  • Web Server: Nginx
  • Monitoring: Grafana and Prometheus
  • API Documentation: Swagger
  • Containerization: Docker

Installation

To get started with the Ecommerce React project, follow these steps:

  1. Clone the repository:

    git clone https://github.com/wxcvbni838/ecommerce-react.git
  2. Navigate to the project directory:

    cd ecommerce-react
  3. Set up the backend:

    • Navigate to the backend folder:
      cd backend
    • Install the necessary dependencies:
      go mod tidy
  4. Set up the frontend:

    • Navigate to the frontend folder:
      cd ../frontend
    • Install the necessary dependencies:
      npm install
  5. Create a .env file in both backend and frontend folders to configure your environment variables. You can refer to the .env.example files for guidance.

  6. Start the backend server:

    go run main.go
  7. Start the frontend server:

    npm start

Now you can access the application at http://localhost:3000.

Usage

Once the application is running, you can explore the following features:

  • User Registration and Login: Create an account or log in to your existing account.
  • Browse Products: View the available products in the store.
  • Add to Cart: Add products to your shopping cart for purchase.
  • Checkout: Complete your purchase through a secure checkout process.
  • Admin Dashboard: If you log in as an admin, you can manage products and view orders.

API Documentation

For detailed API documentation, you can refer to the Swagger UI. Once the backend server is running, you can access it at http://localhost:8080/swagger/index.html.

Architecture

The Ecommerce React project follows a clean architecture approach, separating concerns and ensuring maintainability. Here’s a brief overview of the architecture:

  • Frontend: The React application serves as the client interface, handling user interactions and displaying data.
  • Backend: The Golang server processes requests, interacts with the database, and serves API endpoints.
  • Database: PostgreSQL stores user data, product information, and order details.
  • Caching: Redis is used for caching frequently accessed data, improving performance.
  • File Storage: MinIO serves as an object storage solution for product images and other files.
  • Monitoring: Grafana and Prometheus are integrated for real-time monitoring of application performance.

Contributing

We welcome contributions! If you want to contribute to the Ecommerce React project, please follow these steps:

  1. Fork the repository.
  2. Create a new branch:
    git checkout -b feature/YourFeatureName
  3. Make your changes and commit them:
    git commit -m "Add your message here"
  4. Push to the branch:
    git push origin feature/YourFeatureName
  5. Open a pull request.

License

This project is licensed under the MIT License. See the LICENSE file for details.

Contact

If you have any questions or suggestions, feel free to reach out:

Releases

For the latest updates and releases, please visit the Releases section. You can download the latest version and execute it as needed.

Happy coding!