WEB-Project-Shopee-Phake

Shoppe Phake

I. Introduction

Team members

• Đặng Nguyễn Nam Anh - ITITIU19076
• Nguyễn Hữu Luân - ITITIU19027
• Vũ Minh Tú Anh - ITITIU15093

Topic:

An e-commerce web application inspired from Shopee - a popular e-commerce site in VN.

Motivation:

A project for our team to learn and practice on web application, specifically HTML, CSS, JavaScript, NodeJS - Express, database. Why e-commerce site? Because it's fun!

II. Main Contents

1. Technology stack selection

• Front-end: HTML, CSS, JavaScript.
  • HTML, CSS: To build the website user interface.
  • JavaScript: To build some simple animation on the website and check the validation of some forms.
• Back-end: NodeJS - Express framework, EJS, MySQL, along with some supportive libraries.
  • NodeJS - Express framework: A framework to write JavaScript at back-end side.
  • EJS: A JavaScript template to generate HTML pages with plain JavaScript.
  • MySQL: database for this project.

2. Diagrams

Use case diagram

• Summary goal use case.

  

• Use cases for seller.

  

• Use cases for buyer.

  

Sequence diagram

• Load homepage.

• Order a product throught 'Buy Now' function.

• Seller add new product.

Database - MySql

3. Functions & Features (completed)

An e-commerce site will have the seller user account and buyer/customer user account, each go along with its functions and features.

In this project, we designed one account will act as both a customer and a seller.

a. User - Customer:

• Create new account, Login, Logout.
• Browse the website for products, see the detail of a product.
• Buy a product through 'Buy Now' feature.
• Checking the purchase list/history.
• Have all the functions & features to be able to operate as a seller account.

b. User - Seller:

• Have all the same functions of customer.
• View/Edit/Delete/Add New the products to the web application.
• Checking the order list/history from customers

4. Functions & Features (incompleted ones)

Features that are incomplete or that to be developed further after the course:

• Buy product through 'Cart' function. (50% done)
• Search/Filter products properly.
• Functions to handle the processes after the customer has ordered the products.
• Review/Comment/Rate functions for products.
• Proper authentication application to handle the user accounts.
• More function on interacting with user account: forget password, edit info, upload avatar, etc...

5. Challenges in the project.

• Not enough time to work on more technology/stack

III. Result and Conclusion

Overall, we completed making a web application that can work as an e-commerce site, though it just has very simple functions and features. All we want to do and already achieved is that be able to work and understand how to made a web application with some technology/stack that we interest while learning WAD course at the university.

For the future work, it is surely that we will continue to work on and improve the project as we learn further.

Database Structure Diagram:

Click for demo