Scribd
Upload
21 views16 pages

BTP Final Presentation

Uploaded by

Tarun Boricha
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
21 views16 pages

BTP Final Presentation

Uploaded by

Tarun Boricha
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 16

Angular CRUD Men’s

Fashion Web-APP
Name: Tarun Boricha
ID: 201901080
Company: Clomotech
On-campus Mentor: Prof. Abhishek Jindal
Off-campus Mentor: Jigar Bagdai
Project Idea:

 4uMensWear is a men’s fashion web application where customer can


shop and place the order online.
 The Seller can login into the application.
 The seller (Business owner) can manage the product and perform all the
CRUD operation efficiently.
 The website is user friendly and is compatible on different web browser.
 The application allows the user to Signup and login into the application.
 Every user has Cart and it allows them to select products on their
computer or mobile device and store them in a virtual cart to do the
shopping easily.
 User can places the order.
Project is build using the
following:

For the Front-end

For the Back-end


Angular’s MVC

Angular-Client
 Model: the data that is shown to the user and
Model
View
Controller
with which the user interacts
 View: what the user sees (the Document
Object Model)
API

 CONTROLLER: the business logic behind views


HTML and Angular: Clint-Side

 Created new views using HTML & Angular’s ng-model and ngclick
directives.
 productDetails.html
 AddtoCart.html
 header.html
 sellerHomepage.html
Directives
 user.html
 Seller.html

https://www.c-sharpcorner.com/article/explore-directives-in-angular2/
JSON server: Server-side

 JSON Server is a Node Module that you can use to create fake REST API
in less than a minute.
 Angular requests the data from the server, then returns responses from
server back to Angular
 Used HttpClientModule to perform HTTP requests and easily manipulate
those requests and their responses.
Why Angular for the Project:

 Angular is used to build the single page application (primary goal of the
application)
 Angular is a full-featured and dynamic framework. And its usability,
flexibility, and maintainability makes it unique and provides chances to
create excellent and successful web-based applications.
 The core idea behind angular, build component. Each has its own html
template, styling and more importantly its own business logic.
Components:

Header

Main area Side-bar


Header Component:
Default:

User:

Seller:
Product Details Component:
Seller Home-page
Component :
User Add to Cart Component
Seller Add-Product
Component:
Tools and Technologies:

 Angular
 JSON server
 HTML
 CSS
 TypeScript
 Visual Studio Code
 Google Chrome Developer tool
Acknowledgement:

 I have gained vast experience of tech tools in the web development.


 My peers and seniors helped me a lot during this period, specially my
mentor.
 However, this all things are certainly not possible without DA-IICT.
Studying at DA-IICT is certainly an experience in my life which I never
forget.
Thank You

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy