https://github.com/anwarhakim31/losblancos
🛍 Los Blancos E-Commerce with payment gateway ,shipping cost and CMS (Content Management System). Next.js Scss MongoDB [finish] [deploy]
https://github.com/anwarhakim31/losblancos
cms e-commerce nextjs14 payment-integration realtime sass shipping
Last synced: 4 months ago
JSON representation
🛍 Los Blancos E-Commerce with payment gateway ,shipping cost and CMS (Content Management System). Next.js Scss MongoDB [finish] [deploy]
- Host: GitHub
- URL: https://github.com/anwarhakim31/losblancos
- Owner: anwarhakim31
- Created: 2024-09-12T17:11:13.000Z (9 months ago)
- Default Branch: main
- Last Pushed: 2025-01-10T13:36:24.000Z (5 months ago)
- Last Synced: 2025-01-10T14:40:31.566Z (5 months ago)
- Topics: cms, e-commerce, nextjs14, payment-integration, realtime, sass, shipping
- Language: TypeScript
- Homepage: https://los-blancos.vercel.app
- Size: 23.6 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
LosBlancos
E-commerce
## About
LosBlancos is a cutting-edge e-commerce platform designed to offer a seamless shopping experience while empowering store administrators with a robust Content Management System (CMS). The platform integrates a secure payment gateway for smooth transactions and includes real-time shipping cost calculation, ensuring customers can easily view the total price before completing their purchase.
LosBlancos enhances user interaction with a dynamic real-time dashboard, giving administrators instant insights into crucial activities such as stock availability and new customer orders. The platform's notification system promptly alerts administrators when a product is out of stock or when a new order is placed, ensuring efficient management and timely responses.
Additionally, LosBlancos integrates Raja Ongkir, a popular shipping cost service, allowing customers to calculate accurate shipping fees based on their location. This ensures transparent pricing and provides a smooth checkout experience for both customers and administrators.
## Screenshots
| | |
| :-------------------------------------------------------------------------------------------------------------------------: | :-------------------------------------------------------------------------------------------------------------------------: |
|  |  |
|  |  |
|  |  |
|  |  |
## The dependencies that this project uses:
_Frontend_
-scss: for stayling
-React Hook Form: For Form validation
-axios-interceptors: For making HTTP requests
-rechart js: For making chart
-Redux Toolkit : For State management feature
-next-auth : For authentication
-Sonner : For toast notification
-socket.io : For real-time data transmission.
-lucide: icon
-jest: unit testing
_Backend_
-mongoose: For interacting with MongoDB
-bcryptjs: For hashing passwords
-jsonwebtoken: For authentication
-next-auth:For authencatication
-cloudinary: for upload image
-midtrans: for payment gateway
-nodemailer: for send email
-express: For creating the server-socket
-socket-io: For real-time data transmission.
## Third Party
- Midtranns = https://midtrans.com
- Rajaongkir = https://rajaongkir.com
- Google = https://console.cloud.google.com
## Prerequisites
Before you begin, ensure you have the following installed on your machine:
- Node.js: [Download and install Node.js](https://nodejs.org/)
- npm: Node.js package manager (comes with Node.js installation)
## Getting Started
1. Clone the repository:
```bash
git clone https://github.com/anwarhakim31/LosBlancos.git
```
2. Navigate to root project directory and install depedencies:
```bash
cd LosBlancos
npm install
```
3. Navigate to socket-server directory and install depedencies
```bash
cd socket-server
npm install
```
## Setup Environment
1. Create a .env file in the root next.js of your project.
NEXT_PUBLIC_PROCESS = development
DATABASE_URL =
NEXTAUTH_SECRET =
NEXTAUTH_URL=http://localhost:3000
NEXT_PUBLIC_BASE_URL = /api
GOOGLE_OAUTH_CLIENT_ID =
GOOGLE_OAUTH_CLIENT_SECRET =
NEXT_PUBLIC_CLOUD_PRESET =
NEXT_PUBLIC_CLOUD_NAME =
NEXT_PUBLIC_CLOUD_APIKEY =
NEXT_PUBLIC_CLOUD_SECRETKEY =
//binderbyte untuk mengambil provinsi, kota
BINDERBYTE_KEY =
RAJAONGKIR_KEY =
MIDTRANS_SECRET_SERVER_KEY =
MIDTRANS_BASE_URL = https://api.sandbox.midtrans.com/v2
NEXT_PUBLIC_SOCKET_URL = http://localhost:4000
NEXT_PUBLIC_DOMAIN = http://localhost:3000
EMAIL_ADMIN =
PASSWORD_APLIKASI_EMAIL =
2. Create a .env file in the server-socket of your project.
ORIGIN = http://localhost:3000
MONGODB_URL =
## Development
1. To start the root , run:
```bash
npm run dev
```
2. To start the socket-server run :
```bash
npm run dev
```
## Deployment
Deploy the `dist` directory to your hosting platform of choice.