E-commerce Web App

We run a business of selling clothes. We want to create a merchandising web app that take our business online to expand the market.

Getting Started

The app consists of 2 parts: a website and an api server. The website is a simple e-commerce site that list clothings that we add. ​The api server handles request made by the seller​ such as adding or removing listings. ES6 to be used​ in the code.

Table of Contents

• Prerequisites
• Installation
• Contributing
• Documentation
• Versioning
• Support

Prerequisites

• You need to setup Mongodb in local machine

Installation

All the code required to get started

Clone

• Clone this repo to your local machine using https://github.com/nhuttm/InternshipProject.git

Setup

• Open terminal and go to project: cd ~DIRECTORY/website
• Install the dependencies in the local node_modules folder.

cd client
npm install

cd server
npm install

Contributing

Step 1

Run server and client

• In client:

npm start

• In server:

npm start dev

Step 2

Create dummy data in db

• Open browser:

localhost:2000/createData

Step 3

Documentation

• React.js documentation
• Node.js docs
• ES6 Cheatsheet
• React-Redux
• Axios

Versioning

Support

Contact with me at one of the following places!

• Email: huanhiendanh@gmail.com

Internship Project Work flow (27/5/2019 - 27/6/2019)

Week 1 (27/5/2019 - 2/6/2019)

27/5/2019:

• Understand something about ES6: Arrow function, let and const, modules, map, set, class, template strings.
• Some main concept about React js: Rendering elemnets, Components and Props, State and lifecycle

28/5/2019:

• Main concept of React JS, Lifecycle hook, State, Handle event, Structure of React app

29/5/2019:

• Learn git workflow and training with git.

30/5/2019:

• Learn Redux library: workflow, action, reducer, store, basic syntax to connect.
• Train React and Redux.

31/5/2019:

• Learn mongodb structure.
• Node server api. request data from local database mongodb
• Call node server api from react, call api with redux

(1/6/2019-2/6/2019):

• Review all knowledge in Week 1

Week 2 (3/6 - 9/6)

3/6/2019:

• Structure design project.
• Make homepage, load product from server api

4/6/2019:

• Load category, products from db.
• Understand about how to create relation in mongodb

5/6/2019:

• Pagination products, re-render only products list when paging

6/6/2019:

• Understand about some keyword in css: important, named of class of every tag.
• Create navigation bar, template for product detail

7/6/2019:

• Create footer.
• Load detail of product from db.

(8/6/2019-9/6/2019):

• Review all knowledge in Week 2.
• Learn JWT for authenticate

Week 3 (10/6/2019-16/6/2019)

10/6/2019:

• Modify UI.
• Make register account.

11/6/2019:

• Add login by passport-local, send JWT from sever to client and saved in local storage.
• Receive JWT from client by passport-jwt through Bearer authenticate header.
• Understand more about reducer of redux with initial state.

12/6/2019:

• Learn about Route with high order component.
• Make routing depend on role of user.

13/6/2019:

• Make cart page.
• Store product into redux and local storage and load in cart page.

14/6/2019:

• Learn about MD file, update README.md for project

(15/6/2019-16/6/2019):

• Review all knowledge in Week 3.

Week 4 (17/6/2019-23/6/2019)

(17/6/2019-16/6/2019):

• Make load product for admin, remove product.
• UI for add product page

(18/6/2019-16/6/2019):

• Learn about multer for upload image.
• Add product into db.