E-Commerce Web Application Development Prototype for an Online Store

Slide Note
Embed
Share

Develop an e-commerce web application allowing users to browse and purchase products, create accounts, and manage a shopping cart. Implement admin functionalities for adding, updating, and deleting items. The project involves front-end development using HTML & CSS, back-end development with Java Server Pages and Hibernate, MySQL database integration, and server deployment on Tomcat. Required resources include JDK 13, Eclipse IDE, Tomcat server, MySQL database, JDBC, and Hibernate.


Uploaded on Sep 12, 2024 | 0 Views


Download Presentation

Please find below an Image/Link to download the presentation.

The content on the website is provided AS IS for your information and personal use only. It may not be sold, licensed, or shared on other websites without obtaining consent from the author. Download presentation by click this link. If you encounter any issues during the download, it is possible that the publisher has removed the file from their server.

E N D

Presentation Transcript


  1. Advanced Java Project Prototype Objectives: Develop an e-commerce web app where a user is able to view various products(shoes, clothes etc.) The user should be able sign up for an account so that they can add, remove and order selected items from a cart Develop an admin side of the store where they can create, update and delete desired items Input Validation for when the user is signing up for an account A clean and easy to understand navigation for the user so that the user doesn t have a hard time navigating through the website Creating a database that can store all the relevant products that the admin wants to display on their store front

  2. Requirements: Front end: the frame work that will be used for the front end would be HTML & CSS Back end: Java server pages and hibernate for back and forth communication with the server and the front end Server: Tomcat application server will be used to execute servlets and render pages using JSP Database: One databases created in MySQL that will hold 3 tables with valuable information regarding clients(1), products(2) and categories(3) listed on a website Resources required: Java development kit 13, eclipse ide for java ee developers(web applications) or apache netbeans, Tomcat server, MySQL database, JDBC for communication between the database and JSP, Hibernate for mapping objects to relational database

  3. Admin LOGO Home Shoes Clothes Login Sign up Our featured items Name: Price: Name: Price: Name: Price: Add to cart Add to cart Add to cart Name: Price: Name: Price: Name: Price: Add to cart Add to cart Add to cart Footer

  4. Admin LOGO Home Shoes Clothes Login Sign up Shoes Name: Price: Name: Price: Name: Price: Add to cart Add to cart Add to cart Name: Price: Name: Price: Name: Price: Add to cart Add to cart Add to cart Footer

  5. Admin LOGO Home Shoes Clothes Login Sign up Clothes Name: Price: Name: Price: Name: Price: Add to cart Add to cart Add to cart Name: Price: Name: Price: Name: Price: Add to cart Add to cart Add to cart Footer

  6. Admin LOGO Home Shoes Clothes Login Sign up Please login to shop our products Username Password Login Don t have an account? Sign up here Footer

  7. Admin LOGO Home Shoes Clothes Login Sign up Let s sign you up Name Email Username Password Confirm Password Address Sign up Already have an account? Login here Footer

  8. Admin LOGO Home Shoes Clothes Login Sign up Please login to get admin access Username Password Login Footer

  9. Sign out LOGO Home Shoes Clothes Login Sign up Welcome! Admin Product list ITEM ID NAME PHOTO PRICE CATEGORY ACTIONS 1 Shoe 1 UPLOAD $$$ Shoes EDIT/ DELETE 2 T-shirt UPLOAD $$$ Clothes EDIT/ DELETE 3 Collared Shirt UPLOAD $$$ Clothes EDIT/ DELETE 4 Sneaker UPLOAD $$$ Shoes EDIT/ DELETE Add new product Footer

  10. Sign out LOGO Home Shoes Clothes Login Sign up Welcome! Admin Add a product Name Price Category Choose file Add Footer

  11. Admin LOGO Home Shoes Clothes Cart Logout(Username) Your cart IMAGE NAME PRICE REMOVE ITEM Image of the product Nike Sneaker $120 Checkout Continue shopping Footer

  12. Database ID NAME PHOTO PRICE CATEGORY 001 Nike Runner UPLOAD 120 shoes 002 Adidas Jersey UPLOAD 80 Clothes The table shown above is for products where each product is defined under a unique id Each unique id is the primary key which will be used in identification of objects There will be an image upload button under PHOTO column where the admin can upload the photo of their product that will be listed on their web app 5 variables in total: INT id, VARHCHAR name, TEXT photo, INT price, VARCHAR category ID NAME EMAIL USERNAME PASSWORD ADDRESS 1 Minhaj abc@example.c om Min 12345 1 street west, MARS The table shown above is for user information where each user s information is stored so they can sign in and order Each unique id is the primary key which will be used in identifying a user 5 variables in total: INT id, VARHCHAR name, VARCHAR email, VARCHAR username, CHAR password, VARCHAR address

  13. Notes: Aside from the requirements, an attempt will be made to add filtering so that a user can filter their searches according to the category The color scheme for the store would be black and yellow as they are colors of energy and happiness The idea is to keep the front end as neat and simple as possible so that the user can browse with ease If the whole project go as planned in terms of deadlines, there might be some added bonus features to make UI more interactive for the user using animations Featured products, similar to your previous searches!(Cookies, filters, what products users searched, suggestions) Thank you!

  14. Home page displaying all the products

  15. Zoomed out image showing the whole webpage

  16. Filtered results(Shoes)

  17. Filtered results(Shirts)

  18. Shopping cart

  19. Login page(upon sign in redirects user to admin or regular site depending on the credentials and user type)

  20. Registration form

  21. Admin panel showing dynamic data of number of users, Categories and products

  22. Category form to add categories

  23. Product form to add products

  24. Check out page with cart and user info for mailing

More Related Content