Tech World

An open source project in the Software Design course 20_3 (2022-2023) at HCMUS.

Our Next.js-based e-commerce project is a cutting-edge online platform that offers a wide range of high-quality tech devices for tech enthusiasts and gadget lovers. With a sleek and modern user interface, the website provides a seamless shopping experience to customers, allowing them to explore and purchase the latest smartphones, tablets, laptops, gaming consoles, smart home devices, and more.

Collaborators

• [20120454] Lê Công Đắt @Dat-TG
• [20120470] Nguyễn Văn Hào @haonguyen22
• [20120489] Võ Phi Hùng @phihungtf

Getting Started

Prerequisites

• Node.js (latest version)
• MongoDB
• Cloudinary

First, install dependencies:

npm install
# or
yarn install
# or
pnpm install

Then, copy .env.example to .env and fill in the environment variables:

NODE_ENV="development"

DATABASE_URL=""

NEXTAUTH_URL="http://localhost:3000"
NEXTAUTH_SECRET=""

CLOUDINARY_CLOUD_NAME=""
CLOUDINARY_API_KEY=""
CLOUDINARY_API_SECRET=""
CLOUDINARY_UPLOAD_PRESET=""

Next, sync the database schema by running the following command:

npx prisma db push
# or
yarn prisma db push
# or
pnpx prisma db push

Finally, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev

Open http://localhost:3000 with your browser to see the result.

Deployed version

Check out our deployed version at https://tech-world-hcmus.vercel.app/

Features

Done

General Users

• Register an accout
• Sign in
• Authenticate users
• View products by category
• Search for a product by keyword
• Filter products list
• View product details
• Add products to the shopping cart
• View the shopping cart
• Cancel an order
• Return an the order
• Place/Purchase an order
• Update quantity of each product/Delete an product in the shopping cart
• Order history: view all, filter by status
• Notifications: notify about delivering, delivered orders
• Update account information: Name, Phone number, Email, Avatar, Addresses
• Review delivered products
• Update an review
• View trending products
• View all categories

Administrators

• View dashboard: statistics about the whole system
• Manage products (view all products, add, delete, update, search, filter)
• Statistics about top 10 trending categories, top 10 trending products
• Manage advertisements, promotions (view all, add, delete, update)
• Manage users (view all users, delete, update Role, search)
• Manage categories (view all categories, add, update, delete, search)
• Manage brands (view all brands, add, update, delete, search)
• Manage orders (view all orders, update status, delete, search, filter)
• Manage reviews (view all reviews, update, delete, search, filter)

To-do

• Compare products: Compare the features, prices, and specifications of different products.
• Share products: Share product information with others through various communication channels.
• Apply promo codes: Apply promotional codes or discount coupons during the checkout process.
• View recommendations: Receive personalized product recommendations based on your browsing and purchase history.
• Set preferences: Customize your preferences for notifications, language, currency, and other settings.
• View and redeem loyalty points: Check your accumulated loyalty points and redeem them for rewards or discounts.
• Participate in surveys or polls: Engage in surveys or polls to provide feedback or opinions on products or services.
• Recycle bin: Restore deleted items, such as products, images, ...

License

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