Electro

screenshot of Electro
react
mantine

E-commerce Project with Java Spring and React TypeScript

Overview

Electro is an innovative company expanding its reach into the electronic products market with the launch of a dedicated e-commerce website. The project aims to create a comprehensive online platform that caters to the needs of customers while ensuring effective internal operations. With various features to engage users, from browsing products to managing backend operations, this initiative promises to establish a strong online presence for the company.

This e-commerce solution is designed with versatile user roles, creating a seamless experience for both customers and administrators. By allowing users to interact with the system in multiple ways, Electro's website is set to enhance customer engagement and streamline business processes.

Features

  • User Roles: The system accommodates three main actors: customers (both anonymous and registered), administrators, and employees, ensuring tailored interactions for each group.
  • E-Commerce Functionality: Customers can easily add products to their cart, register for accounts, and update their personal profiles, facilitating a smooth shopping experience.
  • Comprehensive Admin Dashboard: The admin interface is designed for total control over operations, allowing for the management of customers, employees, products, and order logistics.
  • Delivery and Payment Integration: Collaboration with services like Giao Hàng Nhanh and PayPal ensures efficient order fulfillment and secure payment processing.
  • Promotional Management: Administrators can set up and manage promotional campaigns to attract and retain customers, enhancing sales opportunities.
  • Robust Class Structure: The system is constructed with 57 core classes organized into 13 groups, supporting clear development and maintenance strategies.
  • Database Management: A well-structured database with 60 tables supports efficient data handling and retrieval across the platform.

Electro’s e-commerce initiative appears to be a well-structured attempt to enhance the customer shopping experience while simplifying internal processes for the company.

react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

mantine
Mantine UI

A fully featured React components library. 100+ components, 50+ hooks.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.

zod
Zod

Zod is a TypeScript-first schema declaration and validation library. It allows you to define schemas that can validate data at runtime while providing excellent TypeScript inference, making it perfect for API validation, form validation, and type-safe data handling.

Zustand

Zustand is a lightweight state management library for React that provides a simple and intuitive API for managing state in your application. It allows developers to easily create and manage global state, and provides a powerful set of tools for optimizing performance and improving developer productivity. Zustand is designed to be easy to use and easy to learn, making it a popular choice for developers of all skill levels.