https://github.com/satnaing/haru-fashion

An e-commerce web application developed with Next.JS (React) + Tailwind CSS for front-end/UI, Context API for state management and Custom REST API for Backend.
https://github.com/satnaing/haru-fashion

context-api firebase fullstack-development nextjs pwa react tailwind tailwindcss typescript

Last synced: 30 days ago
JSON representation

An e-commerce web application developed with Next.JS (React) + Tailwind CSS for front-end/UI, Context API for state management and Custom REST API for Backend.

• Host: GitHub
• URL: https://github.com/satnaing/haru-fashion
• Owner: satnaing
• Created: 2021-04-26T15:20:01.000Z (about 4 years ago)
• Default Branch: main
• Last Pushed: 2023-08-16T23:15:58.000Z (over 1 year ago)
• Last Synced: 2025-04-06T05:15:05.290Z (about 1 month ago)
• Topics: context-api, firebase, fullstack-development, nextjs, pwa, react, tailwind, tailwindcss, typescript
• Language: TypeScript
• Homepage: https://haru-fashion.vercel.app/
• Size: 5.6 MB
• Stars: 124
• Watchers: 3
• Forks: 65
• Open Issues: 6
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Haru-Fashion E-commerce Web Application

![Haru-Fashion Responsive Design (2)](https://user-images.githubusercontent.com/53733092/139094836-3c75c8fa-4f7a-43a7-b8c8-7cf45af53b71.png)

![ts](https://badgen.net/badge/Built%20With/TypeScript/blue) ![vercel](https://img.shields.io/github/deployments/satnaing/e-commerce/production?label=vercel&logo=vercel&logoColor=white) [![Prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

An e-commerce web application developed with Next.JS and TypeScript. Tailwind CSS is used for styling and React's Context API is used for state management. Custom REST API is used as a backend ([Haru API](https://github.com/satnaing/haru-api)).

## Demo











## Lighthouse Score







## Features

- Progressive Web App (PWA) 🔥

- Full-text Search 🔎

- Responsive Design 📱💻

- Wishlist 🤍

- Add To Cart 🛒

- Different Category Page 🧑🏻👩🏻🎒

- Authentication (Register/Login/Logout) 🛡️

- Pagination ⬅️➡️

- Animation ✨

- i18n (English & Burmese) 🌐

- Keyboard Accessible ⌨️

## Tech Stack

**Frontend** - NextJS, React, TypeScript  

**Styling** - Tailwind CSS  

**Design & Prototype** - Figma  

**State Management** - ContextAPI  

**Backend** - [Haru API](https://github.com/satnaing/haru-api) (Previous Version - Firebase)  

**Containerization:** Docker  

**Deployment** Vercel

## Running Locally

Clone the project

```bash

git clone https://github.com/satnaing/e-commerce.git

```

Go to the project directory

```bash

cd e-commerce

```

Remove remote origin

```bash

git remote remove origin

```

Install dependencies

```bash

npm install

```

Start the server

```bash

npm run dev

```

## Inspiration and Credits

Even though I wrote every single line of code for this web app, images and some design are inspired and used from the following websites.

- [Goya WordPress Premium Theme](https://goya.everthemes.com/demo-fashion/)

- [Lusion WordPress Premium Theme](https://hn.arrowpress.net/lusion/home-minimalist/?currency=USD)

## Author

- [@satnaing](https://github.com/satnaing)