JAVA SCRIPT LIBRARIES

(E.g. react, react native,

angularJS etc.)
AOOP PROJECT
PRESENTATION

SUBMITTED BY
HAMNA AMIR 2020F-BCE-090
FARIHA SAEED 2020F-BCE-094
IBRAHIM ILYAS 2020F-BCE-100
PROJECT OVERVIEW

 We create E-commerce online shopping cart website with frontend and backend. We create
this website by using several languages such as: HTML, CSS, Java Script Libraries (React
js) for frontend and java with spring framework for backend. This project allow user to
view cart, add item to cart, delete item, add quantity of item and purchase online whereas,
backend is capable of get product and upload on website, update product and delete
product.
BRIEF OVERVIEW

 JAVASCRIPT LIBRARIES
JavaScript is one of the most widely used programming languages in the world. It’s a scripting language used by
developers to create interactive user interfaces that display dynamic content. It is s referred to as The Language of the
Web Browser because it is the most commonly used language to build web applications and works well 
across all web browsers. 
 Most Popular JavaScript Libraries:
 jQuery
 React.js
 AngularJS
 Ember.js
 Vue.js
 Underscore.js
 D3.js library
 REACT JS
 React.js (also known as React JS or React) is an open-source, front-end JavaScript library.
It was created in 2013 by Jordan Walke, who works at Facebook as a software engineer.
 Now, it has the MIT license but was initially released under the Apache License 2.0. React
was designed to make interactive UI creations painless.
 Just design a simple view for individual states in your app. Next, it will render and update
the right component efficiently upon data changes.
 Facebook, Instagram, and Whatsapp all use React.
 HTML
HTML stands for HyperText Markup Language. It is used to design web pages using a
markup language. HTML is the combination of Hypertext and Markup language. Hypertext
defines the link between the web pages. A markup language is used to define the text
document within tag which defines the structure of web pages. This language is used to
annotate (make notes for the computer) text so that a machine can understand it and
manipulate text accordingly.
CSS
 Cascading Style Sheets, fondly referred to as CSS, is a simple design language intended to
simplify the process of making web pages presentable.
 CSS handles the look and feel part of a web page. Using CSS, you can control the color of
the text, the style of fonts, the spacing between paragraphs, how columns are sized and laid
out, what background images or colors are used, layout designs,variations in display for
different devices and screen sizes as well as a variety of other effects.
TOOLS USED
 VISUAL STUDIO CODE
 NOTEJS
 NETBEANS
 XAMMP
 POSTMAN
 INSTALLATION OF THAT TOOL
 Visual Studio Code on Windows OS
 Step 1 :
 Download VS code from here Link.
 Step 2 :
 Download the Visual Studio Code installer for Windows. Once it is
downloaded, run the installer (VSCodeUserSetup-{version}.exe). Then, run
the file – it will only take a minute. 
Accept the agreement and click “next.”
After accepting all the requests press finish button. By default, VS Code
installs under: "C:\users{username}\AppData\Local\Programs\Microsoft
VS Code."
 Node.js
 Download the Windows installer from 
Nodejs.org.
 Run the installer (the .msi file you downloaded
in the previous step.)
 Follow the prompts in the installer (Accept the
license agreement, click the NEXT button a bunch
of times and accept the default installation
settings).
 Restart your computer. You won’t be able to run
Node.js until you restart your computer.
 NetBeans

 Step 0: Install JDK

 To use NetBeans for Java programming, you need
to first install Java Development Kit (JDK). See "
JDK - How to Install".
 Step 1: Download
 Download "NetBeans IDE" installer from 
http://netbeans.org/downloads/index.html. There
are many "bundles" available.
 Step 2: Run the Installer
 Run the downloaded installer.
 XAMPP
 Step 1: Download
 XAMPP is a release made available by the non-profit project Apache Friends. Versions with PHP 5.5, 5.6, or 7 are
available for download on the Apache Friends website.
 Step 2: Run .exe file
 Once the software bundle has been downloaded, you can start the installation by double clicking on the file with the
ending .exe.
 Step 3: Deactivate any antivirus software
 Since an active antivirus program can negatively affect the installation process, it’s recommended to temporarily pause
any antivirus software until all XAMPP components have successfully been installed.
 Step 4: Deactivate UAC
 User Account Control (UAC) can interfere with the XAMPP installation because it limits writing access to the C:
drive, so we recommend you deactivate this too for the duration of the installation process.
 Step 5: Start the setup wizard
 After you’ve opened the .exe file (after deactivating your antivirus program(s) and taken note of the User Account
Control, the start screen of the XAMPP setup wizard should appear automatically.
 Step 6: Choose software components
 Under ‘Select Components’, you have the option to exclude individual components of the XAMPP software bundle
from the installation.
 Step 7: Choose the installation directory
 In this next step, you have the chance to choose where you’d like the XAMPP software packet to be installed.
 Step 8: Start the installation process
 Once all the aforementioned preferences have been decided, click to start the installation.
 Step 9: Windows Firewall blocking
 Your Firewall may interrupt the installation process to block the some components of the XAMPP. 
 Step 10: Complete installation
 Once all the components are unpacked and installed, you can close the setup wizard by clicking on ‘Finish’.
 Postman
 Step 1: Visit the https://www.postman.com/ website
using any web browser. 
 Step 2: Click on Windows Button to download.
 Step 3: Now click on Windows 64 – bit button.
 Step 4: Now check for the executable file in downloads
in your system and run it.
 Step 5: Now installing process will start it takes a
minute to install in the system.
 Step 6: After installing the program the software opens
automatically. Now you can see the interface of the
software
 Postman is successfully installed on the system and an
icon is created on the desktop.
CONCULSION
Our project is website based on online
shopping system by using java script
libraries. The web based online shopping
system is developed with the help of tools
such as HTML, CSS and React js.
This project will help you to create a
shopping cart website and we can also make
this website with further improvement.