Omega Fresh

• Maintained by: Heegu Park

Functionality Overview

1. A client receive the data and display the data in HTML format
   • view the products
   • view the detail of a product
   • add the product to the cart
   • view the products in the cart
   • add more products to the cart or remove the product from the cart
   • place an order via submitting order form
   • view the order summary
2. A server can process the data
   • to view all products
   • to view single product with detail
   • to view a specific items of products by a page
   • to add a product to the cart
   • to view the product(s) in the cart
   • to remove the product from the cart
   • to receive the order and place the order
3. Heavily used React to create all HTML elements(virtual DOM) to dynamically display all data using DOM upon the data from PostgreSQL database via API server created by using Node.js
4. Used Express and Express session module to retrieve the cart information that the user already put items in the cart
5. Used pg module to connect PostgreSQL database
6. Used AWS EC2 for web and API server and AWS RDS for PostgreSQL database
7. Support most of mobile devices(iPad - Landsacpe/Portrait, iPhone X - Landsacpe/Portrait, iPhone 6s/7s/8s - Landsacpe/Portrait, iPhone 6/7/8 - Landsacpe/Portrait, and so on)

Planned Features

1. User can view products.
2. User can view the detail of a product.
3. User can add the product to the cart.
4. User can view the products in the cart.
5. User can place an order in the cart.

Lessons Learned

1. Various ways of accessing local storages using React function and dynamically display data using React virtual DOM functions
2. Experienced to deal with various functions of React virtual DOM
3. Experienced to effectively use React and Bootstrap for displaying data
4. React and JavaScript Object Oriented Programming for better functionalities and to increase the re-usage of codes
5. Experienced to create API server using node.js to process the data with communicating with database and pass the data to client
6. Experienced to create PostgreSQL database to store and retrieve data upon the request of a client via API server
7. Experienced to store and handle session data using Express session
8. Experienced to deploy the web and API server into AWS EC2 and create PostgreSQL database into AWS RDS

Live Site

• You can see and test the live version here: fresh.heegu.net

Screen shot

[Desktop - Chrome browser]

[iPhone 6/7/8 - Portrait]

[iPhone 6/7/8 - Landscape]