SEMESTER TRAINING REPORT

On
E-COMMERCE- SMART SHOP
Submitted in partial fulfillment of requirements
for the award of the degree

Bachelor of
Computer and Application
To
ARNI UNIVERSITY

SUBMITTED BY:
Name: Samir
Roll no: Semester:6th
Batch:2021-2024

Under the guidance of

Mr. [Link]

DEPARTMENT OF COMPUTER AND APPLICATIONS

Arni University, kathgarh Indora kangra (H.P) - 176401

ABCA0009A/21
 CERTIFICATE

This is to certify that Ms. Samir has partially completed the Semester Training during the
period from Jan 2023 to Jun 2023 in our Arni University as a Partial Fulfillment of Degree of
Bachelor of Technology in Computer and applications.

(Signature of Project Supervisor)

Date: 30-04-2024

ABCA0009A/21
 CANDIDATE DECLARATION

I hereby declare that the Project Report entitled ("ANIK") is an authentic

record of my own work as requirements of 8th semester academic during the
period from January 2023 to June 2023 for the award of degree of B.C.A
(Computer Science & Applications , Arni University, kathgarh (HP) under
the guidance of (Avnitash).

(Signature of student)
(Samir)
) Date: 13-05-2024

Certified that the above statement made by the student is correct to the best of our knowledge and
belief.

Signatures
Examined by:
1. 2. 3. 4.

Head of Department

(Signature and Seal)

ABCA0009A/21
 ACKNOWLEDGMENT

I take this opportunity to express my sincere gratitude to the Dean-DR. Guirvinder Arni
University for providing this opportunity to carry out the present work.

I am highly grateful to the DR. Sunita HOD CSA, ARNI University (Indora). I would like to
expresses my gratitude to other faculty members of Computer Science & Engineering
department of , ARNI university for providing academic inputs, guidance & Encouragement
throughout the training period.. Finally, I express my indebtedness to all who have directly or
indirectly contributed to the successful completion of my semester training.

I also express my sincere thanks to all the faculty members of ARNI UNIVERSITY for their
critical advice and guidance without which the project would not have been possible.

ABCA0009A/21
 ABOUT COMPANY

As a final semester student pursuing a degree in Computer Science & Engineering, I had the
opportunity to gain valuable industry experience through a Six-month Semester Training program
with Solitaire Infosys Pvt. Ltd.

During my training, I received a certification in MERN STACK, which provided me with a strong
foundation in programming and software development. However, my major project revolved
around the development of an online e-commerce website using MERN Stack.

Solitaire Infosys is a leading Software and Web Application Development Company, based in
Mohali (Chandigarh), that provides high-quality comprehensive services to enterprises across a
wide range of platforms and technologies. Our major areas of expertise are in providing quality,
cost-effective software or web development services. Solitaire Infosys Pvt. Ltd. is an acclaimed
IT service provider contributing its part in the development of many businesses around the globe.
We socialize with our clients to get a superior cognizance of their business and requirements and
help them in fabricating websites and applications for their business.

Services Offered: IT Consulting, Software Design & Prototyping Custom Software Development,
Software Testing & QA Services , Web Application Development, Application Support & Software
Maintenance ,Web Designing Solutions (Graphics, Brand & Logo Designing) , Web Development
Solutions (PHP, .Net, HTML, C++, Java) , Mobile Application Development (Android, Ios) ,
Internet Marketing (SEO, SEM, SMM).

ABCA0009A/21
 ABSTRACT

"Anik" is an innovative e-commerce platform designed to revolutionize online shopping

experiences. Our website offers a seamless and intuitive interface, making it easy for users to
browse, compare, and purchase a wide range of products from the comfort of their homes. With a
focus on convenience, efficiency, and affordability, Smart Shop brings together cutting-edge
technology and user-friendly features to enhance the shopping journey.
Through Smart Shop, customers can explore an extensive selection of products across various
categories, including electronics, fashion, home essentials, and more. Our platform incorporates
advanced search and filtering capabilities, allowing users to quickly find the items they need.
Moreover, personalized recommendations based on browsing history and preferences help
streamline the decision-making process.
At Smart Shop, we prioritize security and trust, implementing robust measures to safeguard
customer information and transactions. Seamless payment options and reliable shipping services
ensure a hassle-free shopping experience from start to finish. Additionally, responsive customer
support is available to address any inquiries or concerns promptly.
In essence, Smart Shop redefines online shopping by offering a comprehensive, convenient, and
secure platform tailored to the evolving needs of modern consumers. Join us in embracing the
future of retail with Smart Shop.

ABCA0009A/21
 ANIK
Table of Content

[Link] Description [Link] Signature

1. List of Figures 1

2. List of databases Tables 2

3. Introduction Project 3-4

4. Problem Statement 5-6

• Existing System

• Need For New System

5. Characteristics 7

6. Objectives 8

7. Feasibility Analysis 9-10

8. Project Plan 11-15

9. Program Language Tool 16-17

10. Functionalities 18

11. Methodology 19

12. System Requirement 20

13. DFD’s 21-26
14. System Design 27
15. Normalized Database Schema 28-29
16. ER Diagram 30-32
17. User Interface Design 33-44
18. Responsive Website 45-46
19. Conclusion 47
20. Future Scope 48
21. References 49

1
 ANIK

Project Title

A
Authentic
N
Network
I
Innovative
K
Kollections

2
 ANIK

INTRODUCTION
The fashion industry in collaboration with e-commerce acts as a tool for innovation and growth
and has been at the forefront for multiple technological breakthroughs. The concept of e-commerce
has transformed the fashion industry, allowing consumers to shop from the comfort of their own
home.

E-Commerce also known as Electronic Commerce or Internet Commerce, is an activity of buying

and selling goods or services over the internet. So, any kind of transaction (whether money, funds,
or data) is considered as E-commerce. So, E-commerce can be defined in many ways, some define
E-Commerce as buying and selling goods and services over the Internet, others define ECommerce
as retail sales to consumers for which the transaction takes place on open networks. The buying
and selling of products, services, and digital products through the Internet all fall under the
umbrella of e-commerce. Moreover this system is designed for the particular need of the company
to carry out operations in a smooth and effective manner. The application is reduced as much as
possible to avoid errors while entering the data. It also provides error message while entering
invalid data. No formal knowledge is needed for the user to use this system. Thus by this all it
proves it is user-friendly. Online E-commerce System, as described above, can lead to error free,
secure, reliable and fast management system.

E-commerce is the application of information technology and communication technology to three

basic activities related to commercial business, the three basic activities are as follows:

1. Production and support- which includes assisting production, distribution, and maintenance of
goods and services.
2. Transaction preparation- which includes getting product information into the market-place and
bringing buyers and sellers into contract with each other; and
3. Transaction completion- which includes concluding transactions, transferring payments, and
securing financial services

3
 Objectives

1. Expand Market Reach: Reach customers globally, breaking geographical barriers and
accessing a wider audience.

2. Increase Sales: Generate revenue by facilitating online transactions and providing a

convenient purchasing experience.

3. Enhance Customer Convenience: Offer a user-friendly interface, allowing customers to

shop anytime, anywhere, and on any device.

4. Build Brand Awareness: Increase brand visibility through online presence, marketing
efforts, and customer engagement.

5. Provide Product Information: Offer detailed product descriptions, images, and reviews
to help customers make informed purchasing decisions.

6. Personalize Shopping Experience: Utilize data analytics to tailor product

recommendations and promotions based on customer preferences and behavior.

7. Improve Customer Service: Provide efficient customer support through various

channels, such as live chat, email, and phone, to address inquiries and resolve issues
promptly.

4
 Project Plan
• Development schedule

Problem Final
Topic formulation Planning Design Coding Testing Project
Submission

20 Jan,24
To
31 Jan,24
1 Feb,24
To
13 Feb,24
14 Feb,24
To
26 March,24

27 March,24

To
15 April,24
To
30 April,24
1 May,24
To
29 May,24

5
1. PROBLEM FORMULATION:-
A problem formulation is a question or something you are wondering about. The problem should
be something you can solve/give answers to. The aim of a problem formulation is also to set a
framework for your research and a good problem formulation is essential for completing a good
study.

Consider 5 ways to formulate the problem:

1. Specify your research objectives.
2. Review its context or environment.
3. Explore its nature.
4. Determine variable relationships.
5. Anticipate the possible consequences of alternative approaches.

2. PLANNING:-
Project planning is a discipline addressing how to complete a project in a certain timeframe, usually with
defined stages and designated resources. One view of project planning divides the activity into these steps:

• setting measurable objectives

• identifying

• scheduling

• planning tasks

The three major parts of a project plan are the scope, budget and timeline. They involve the following
aspects:

6
• Scope. The scope determines what a project team will and will not do. It takes the team's vision, what
stakeholders want and the customer's requirements and then determines what's possible. As part of
defining the project scope, the project manager must set performance goals.

• Budget. Project managers look at what manpower and other resources will be required to meet the
project goals to estimate the project's cost.

• Timeline. This reveals the length of time expected to complete each phase of the project and includes a
schedule of milestones that will be met.

3. DESIGN:-
Project design is an early phase of the project lifecycle where ideas, processes, resources, and deliverables
are planned out. A project design comes before a project plan as it’s a broad overview whereas a project plan
includes more detailed information.

There are seven steps involved when creating a project design, including defining goals and using a visual
aid to communicate objectives.

1. Define project goals.

2. Determine outcomes

3. Identify risks and constraints

4. Refine your project strategy with a visual aid

5. Estimate your budget

6. Create a backup plan

7. Document your milestones

7
4. CODING:-
Coding, sometimes called computer programming, is how we communicate with computers. Code
tells a computer what actions to take, and writing code is like creating a set of instructions. By
learning to write code, you can tell computers what to do or how to behave in a much faster way.
We can use this skill to make websites and apps, process data, and do lots of other cool things.
Coding is a system of symbols and rules used to represent instructions. If you right click on any
webpage and select View Source, the code for that particular webpage will be displayed. There are
various types of code, all which serve a different purpose.

The Coding is used for Programming applications, websites, and various other modern day tools.
Today every major domain including agriculture, medicine, entertainment etc. makes use of
Computer Coding. The following describes some of the main uses of Computer Programming.

• Computer programs are used in website development, graphic designing, and creating
apps.

• The special effects in videos and movies are added through Coding.

• The Coding is fundamentally used in visual effects (VFX) and game development.

• The Computer programs are also used for designing communication media, chat, SMS,
voice communication, and social media platforms amongst other applications.

• There are various software programs such as Calculator, MS Office tools and web browsers
including Internet Explorer, Google Chrome etc. which are installed in Computers. All of
these applications are built with the help of coded and Programming languages.

8
5. TESTING:-
Testing is the process of executing a program with the aim of finding errors. To make our software
perform well it should be error-free. If testing is done successfully it will remove all the errors from
the software.

Principles of Testing:-

i. All the test should meet the customer requirements.

ii. To make our software testing should be performed by a third party.
iii. Exhaustive testing is not possible. As we need the optimal amount of testing based on the
risk assessment of the application.
iv. All the test to be conducted should be planned before implementing it.
v. It follows the Pareto rule (80/20 rule) which states that 80% of errors come from 20% of
program components.
vi. Start testing with small parts and extend it to large parts.

9
 Programming languages and tools used

Frontend

i. HTML 5 : - ii. CSS:-

CSS stands for Cascading Style Sheets CSS Hypertext Markup Language revision 5
(HTML5) is markup language for the structure and presentation of World Wide Web
contents. HTML5 supports the traditional HTML and XHTML-style syntax and other
new features in its markup, New APIs, XHTML and error handling.

There are three organizations that are currently in charge of the specification of HTML5:

1. Web Hypertext Application Technology Working Group (WHATWG) created the

HTML5 specification and is in charge of the HTML5 development that provides open
collaboration of browser vendors and other involved parties.
2. World Wide Web Consortium (W3C) is in charge with delivering the HTML5
specification.
3. Internet Engineering Task Force (IETF) is in charge of the development of HTML5
WebSocket API. describes how HTML elements are to be displayed on screen, paper,
or in other media CSS saves a lot of work. It can control the layout of multiple web
pages all at once External stylesheets are stored in CSS files.

iii. JavaScript: -
JavaScript is a dynamic programming language that’s used for web development, in web
applications, for game development, and lots more. It allows you to implement dynamic
features on web pages that cannot be done with only HTML and CSS.

iv. React JS:-

React (also known as [Link] or ReactJS) is a free and open-source front-end JavaScript
library for building user interfaces based on UI components. It is maintained by Meta
(formerly Facebook) and a community of individual developers and companies. React can
be used as a base in the development of single-page, mobile, or server-rendered
applications with frameworks like [Link]. However, React is only concerned with state
management and rendering that state to the DOM, so creating React applications usually
requires the use of additional libraries for routing, as well as certain client-side
functionality.

10
Backend

i. Node:-
[Link] is an open-source and cross-platform JavaScript runtime environment. It is a popular tool
for almost any kind of project. [Link] runs the V8 JavaScript engine, the core of Google Chrome,
outside of the browser. This allows [Link] to be very performant. A [Link] app runs in a single
process, without creating a new thread for every request. [Link] provides a set of asynchronous
I/O primitives in its standard library that prevent JavaScript code from blocking and generally,
libraries in [Link] are written using non-blocking paradigms, making blocking behavior the
exception rather than the norm

[Link]:-
[Link] is a Node js web application server framework, which is specifically designed for
building single-page, multi-page, and hybrid web applications.
It has become the standard server framework for [Link]. Express is the backend part of something
known as the MEAN stack.

[Link]:-
MongoDB is an open-source, cross-platform, and distributed document-based database designed
for ease of application development and scaling. It is a NoSQL database.

11
 ANIK

Functionalities Provide by Online E-commerce ANIK are:

• Provides the searching facilities based on various factors. Such as Clothes, Shopping Cart, customer, Order.
• Online E-commerce System also manage the Delivery Address details online for Customer details, Order
details, Clothes.
• It tracks all the information of Item Category, Delivery Address, Customer etc. • Manage the information of
Item Category
• Shows the information and description of the Clothes, Shopping Cart

• To increase efficiency of managing the Clothes, Item Category

• It deals with monitoring the information and transactions of Customer. • Manage the information of Clothes.
• Editing, adding and updating of Records is improved which results in proper resource management of
Clothes data.
• Manage the information of Customer

• Integration of all records of Order.

2018875 17
 ANIK

System Requirement

Hardware Requirements

• Hard disks: 500 GB

• RAM: 4 GB

Software Requirements

• Front End Tool: HTML , CSS, ReactJS

• Back End: Node JS, Express JS, Mongo DB

• Operating System: Window8.1/10

2018875 13
 ANIK

DFD (Data Flow Diagram):

A data flow diagram (DFD) is a graphical representation of the “flow” of data through an
information system, modeling its process aspects. A DFD is often used as a preliminary step to
create an overview of the system, which can later be elaborated.

Components of DFD:

1. Data flow Lines

2. Input/output

3. Functions

2018875 14
 ANIK

DFD Diagrams:

Category
Management

System user
Customer The Management
Management Fashionista

Login
Management

2018875 15
 ANIK

•
CATEGORY MANAGEMENT

ADD CATEGORY

MANAGE CATEGORIES

REMOVE CATEGORIES

i. Add Category
Only admin is having the privilege to add a category.

ii. Remove Category

Admin has privilege to delete a category..

iii. Search Category:

The admin can search for a category by name.

16
 ANIK

SYSTEM USER MANAGEMENT

i. View Product

The user has the privileges to view the product on the site.

ii. Search Product

The user has the privileges to search the product on the site.

iii. Edit Profile

The user has the privileges to edit the profile on the edit page.

iv. Purchase Product

17
 ANIK

•
The user has the privileges to purchase the product directly on the site.

MANAGE USER

i. View Users
The admin will have a list view of all the users registered in the system. Admin can view
all the details of each user in the list except password.

ii. Add Users

Admin has privileges to add a user directly by providing the details.

iii. Delete & Block Users

Administrator has a right to delete or block a user. The default status of a new user
registered is set as blocked. The admin must accept the new user by unblocking him.

18
 ANIK

SYSTEM DESIGN

• MODULES DETAILS
The system after careful analysis has been identified to be presented with the following modules and
roles.
The modules involved are:

⮚ Administrator

⮚ Users

ADMINISTRATOR:-

The administrator is the super user of this application. Only admin have access into this admin
page. Admin may be the owner of the shop. The administrator has all the information about all the
users and about all products.

This module is divided into different sub-modules.

1. Manage Categories
2. Manage Products
3. Manage Users
4. Manage Orders

19
 ANIK

E-R DIAGRAMS:-

• USER DETAILS

• PRODUCT DETAILS

20
 ANIK

COMPLETE ER DIAGRAM DIAGRAM

21
 ANIK

USER INTERFACE DESIGN

• Home Page

H
O
M
E

P
A
G
E

22
ANIK

LOGIN PAGE

REGISTER PAGE

23
ANIK

ABOUT US

USER PROFILE

24
 ANIK

•
Select The Product

• Select a Size

25
 ANIK

•
Select the color and Add to Cart

26
 ANIK

Responsive Website
We display a responsive layout where there is a left bar when the screen is wide, and there’s a
drop-down on the right pane if there’s not. When we display the items in the chosen section, we
choose from the left pane or the drop-down. To display the items, we use the Card widget from
React Bootstrap.

27
 ANIK

Future Scope

Growth of e-commerce trends is becoming more popular day by day as per the market demand. This
is actually carrying us to the new innovative world which eventually saves lot of time and money as
well because of the attractive features provided by the online market. This paper gives an overview
of the applications and future of e-commerce and discusses the various factors that are important for
the growth of Ecommerce in India. According to the present scenario we can imagine the growth of
overall E-commerce that will increase with the emerging market of India. This paper is outcome of
a review of various research studies carried out on E-Commerce.

28
 ANIK

Conclusion

After extensive research and analysis we have drawn to the following conclusions. Yes online
cloth shopping is pretty popular among the young Indian blood. Many teenagers and bachelors
are now using the E-Commerce for fulfilling there shopping desires. Most of them are
completely aware of all the pros and cons of online shopping. Cash on delivery remains the
best choice for payment followed by Debit and credit cards. Females are marginally more
interested in shopping through the internet due too its convenience. Most users are shopping
once or twice a week though the web with spending ranging from rupees 100 to 2500 monthly.
With most of the E- retailers selling branded goods and having flexible return policies they are
being well trusted by the users. Apparel, footwear and Accessories lead as the most demanded
goods online followed by Software and Music. After this analysis we conclude that India has
a huge potential for growth of a multibillion dollar industry of E-Commerce as the top players
of the market are having more than 100% growth year on year and their valuations are crossing
billions of dollars.

References

1. [Link]
2. Solitaire Infosys Pvt. Ltd.
3. [Link]

29
ANIK

30