VISVESVARAYA TECHNOLOGICAL UNIVERSITY

BELAGAVI-590018

“AN INTERNSHIP REPORT”

(Subject Code: 15IS84)
ON
“FASHION ADDA – AN E-COMMERCE WEBSITE”

Submitted in partial fulfilment for the requirements for the Award of Degree of

BACHELOR OF ENGINEERING
IN
INFORMATION SCIENCE AND ENGINEERING
BY

CHAITRA S (1EP16IS023)

UNDER THE GUIDANCE OF

Dr. Anitha N
Professor
Dept. of ISE, EPCET

Department of Information Science and Engineering

Jnana Prabha Campus, Bidarahalli,
Bangalore – 560 049
2019-2020
 (Affiliated to Visvesvaraya Technological University, Belagavi)
Jnana Prabha Campus, Bidarahalli,

Bangalore – 560 049

DEPARTMENT OF INFORMATION SCIENCE & ENGINEERING

CERTIFICATE

This is to certify that the Internship Work entitled “FASHION ADDA –AN E-
COMMERCE WEBSITE” is a bonafied work carried out by Ms. Chaitra S, bearing
USN 1EP16IS023,in partial fulfilment for the award of Bachelor of Engineering in
Information Science and Engineering under Visvesvaraya Technological University,
Belagavi during the year 2019-2020. It is certified that all the corrections/suggestions
indicated in the Internal Assessment have been incorporated in the report and submitted in the
department library. This internship report has been approved as it satisfies the academic
requirements in respect of Internship work prescribed for the award of the said degree.

GUIDE HOD PRINCIPAL

Dr. Anitha N Prof. Kemparaju N Dr.Prakash S
Professor, Prof. & Head Principal,

Examiners

Name of the Examiners Signature with Date

1.

2.
 ACKNOWLEDGEMENT

Any achievement, be it scholastic or otherwise does not depend solely on the

individual efforts but on the guidance, encouragement and cooperation of intellectuals, elders
and friends. I would like to take this opportunity to thank them all.

First and foremost I would like to express my sincere regards and thanks to
Mr.Pramod Gowda and Mr. Rajiv Gowda, CEO’s, East Point Group of Institutions,
Bangalore, for providing necessary infrastructure and creating good environment.

I express my gratitude to Dr. Prakash S, Principal, EPCET who has always been a
great source of inspiration.

I express my sincere regards and thanks to Prof. Kemparaju N, Professor and Head
of Department of Information Science and Engineering, EPCET, Bangalore, for his
encouragement and support.

I am obliged to Dr.Anitha N, Professor, who rendered valuable assistance as the

internship coordinator.

I am grateful to acknowledge the guidance and encouragement given to us by

Dr.Anitha N, Professor, Department of Information Science and Engineering, EPCET,
Bangalore, who has rendered a valuable assistance.

I also extend my thanks to the entire faculty of the Department of Information

Science and Engineering, EPCET, Bangalore, who have encouraged me throughout the
course of the internship.

Last, but not the least, I would like to thank my family and friends for their inputs to
improve the internship.

Name: Chaitra S

USN : 1EP16IS023
 TABLE OF CONTENTS

CHAPTER TOPICS PAGE

NO. NO.
1 Company Profile 1
2 About Company 2
3 Task Performed 3
3.1 Introduction to HTML 3
3.1.1 Features of HTML 4
3.1.2 Applications of HTML 5
3.1.3 Advantages of HTML 6
3.1.4 Disadvantages of HTML 6
3.2 Introduction to word press 7
3.2.1 What can WordPress do? 7
3.2.2 Features of WordPress 7
3.2.3 Application of WordPress 11
3.2.4 Advantages of WordPress 11
3.2.5 Disadvantages of WordPress 11
3.3 Cascading Style Sheet 12
3.3.1 Who creates and maintains CSS? 13
3.3.2 CSS Versions 13
3.3.3 CSS Syntax 13
3.4 Attaching Styles 15
3.4.1 Inline Styles 15
3.4.2 Embedding Style Sheets 15
3.4.3 External Style Sheets 16
3.4.4 CSS Background Properties 17
3.3.5 CSS Border Properties 17
3.4.6 CSS Text and Font Properties 18
3.4.7 Margins and Padding 19
3.5 MySQL 19
3.6 JDBC 20
3.7 JavaScript 21
4 Reflection 22
4.1 Project Executed 22
4.1.1 Home page module 22
4.1.2 About us Module 23
4.1.3 Contact us Module 23
 4.1.4 Cart Module 24
4.1.5 Products Module 25
4.1.6 Saree Product page 26
4.1.7 Kurtas Product page 26
4.1.8 Western Tops Product page 27
4.1.9Order Summary Module 28
4.1.10 Customer Login Page 29
4.2 Back End Database 30
CONCLUSION
REFERENCE
 LIST OF FIGURES

FIGURE DESCRIPTION PAGE

NO. NO.
4.1.1 Home page module 22
4.1.2 About us Module 23
4.1.3 Contact us Module 23
4.1.4 Cart Module 24
4.1.5 Products Module 25
4.1.6 Saree Product page 26
4.1.7 Kurtas Product Page 26
4.1.8 Western Tops Product Page 27
4.1.9 Order Summary Module 28
4.1.10 Customer Login Page 29
 ABSTRACT

Fashion Adda - is an E-Commerce website that consists of various products for Clothing.
This website is developed in order to create an E-commerce platform that enhances better
availability of products to the users in terms of profitability and performance. It provides a
user-friendly interface, so as to implement better options on the product metrices. Basic
functionalities that are being provided by this website are the product metrics, specification
and images, reducing sales visit using web or email and thus increasing productivity, an
option to change default shipping address for each product of the customer and providing an
option for adding multiple shipping address.
Fashion Adda –An E–Commerce Website Internship

CHAPTER 1
COMPANY PROFILE
Akarmaxs Tech Private Limited is a Private incorporated on 07 September 2015. Akarmaxs
is boutique digital marketing, software development and web development agency
dedicated to transforming brands and businesses into success stories through effective data-
centric marketing approaches. We seamlessly combines expertise in brand identity,
advertising solutions, digital marketing, web solutions, social media to define and connect
every aspect of a brand experience. The main vision of our services is to make our clients to
be connected in different zones of required services and to provide the better solution.

Dept. of ISE,EPCET 2019-2020 Page 1

Fashion Adda –An E–Commerce Website Internship

CHAPTER 2
ABOUT COMPANY

We’ll understand your innovative point of view. Before we even start writing, we see in your
point of view and value your opinions, so every word builds your brand. We focus on clients
satisfaction. For us, it’s all about what adds value for us and our business partners.

We are the best online catalyst that you can find. As we aim at making your website
more visible and profitable, we prefer to tackle all our projects head on. Intricate research
procedures and implementation of the best tools in the industry are our specialties.
Conversions and revenues are what we promise and we believe in keeping the promises we
make. We, at Akarmaxs, are committed to stretch the traditional industry-standards and
outmatch clients' expectations. We've been doing this for a decade now!

Our vision is to help clients strengthen their business with a myriad of services
including design, development, analytics and business intelligence, integration,
monitoring, maintenance, and round the clock support to their IT infrastructure.

Our long years of experience in Website Design, Development & Mobility, PPC,
SMM and Search Engine Marketing give your business the edge it deserves

Services we provide are:

 Web designing & development

 Digital analysis
 UI/UX design
 Digital marketing
 Mobile app development
 Email marketing
 Wordpress development
 Consumer support

Dept. of ISE,EPCET 2019-2020 Page 2

Fashion Adda –An E–Commerce Website Internship

CHAPTER 3

TASKS PERFORMED

3.1 INTRODUCTION TO HTML

Hypertext Markup Language (HTML) is the standard markup language for creating web
pages and web applications. With Cascading Style Sheets (CSS) and JavaScript, it forms a
triad of cornerstone technologies for the World Wide Web.

Web browsers receive HTML documents from a web server or from local storage and
render the documents into multimedia web pages. HTML describes the structure of a web
page semantically and originally included cues for the appearance of the document.

HTML elements are the building blocks of HTML pages. With HTML constructs,
images and other objects such as interactive forms may be embedded into the rendered page.
HTML provides a means to create structured documents by denoting structural semantics for
text such as headings, paragraphs, lists, links, quotes and other items. HTML elements are
delineated by tags, written using angle brackets. Tags such as <img/> and <input/> directly
introduce content into the page. Other tags such as <p> surround and provide information
about document text and may include other tags as sub-elements. Browsers do not display the
HTML tags, but use them to interpret the content of the page.

HTML can embed programs written in a scripting language such as JavaScript, which
affects the behaviour and content of web pages. Inclusion of CSS defines the look and layout
of content. The World Wide Web Consortium (W3C), maintainer of both the HTML and the
CSS standards, has encouraged the use of CSS over explicit presentational HTML since
1997.

Dept. of ISE,EPCET 2019-2020 Page 3

Fashion Adda –An E–Commerce Website Internship

HTML markup consists of several key components, including those called tags (and their
attributes), character-based data types, character references and entity references. HTML tags
most commonly come in pairs like <h1> and </h1> although some represent empty elements
and so are unpaired, for example<img>. The first tag in such a pair is the start tag, and the
second is the end tag (they are also called opening tags and closing tags). Another important
component is the HTML document type declaration, which triggers standards mode
rendering.

3.1.1 Features of HTML

Hypertext mark-up language (HTML) is the major mark-up language used to display Web
pages on the Internet. In other words, Web pages are composed of HTML, which is used to
display text, images or other resources through a Web browser. HTML is used with other
technologies because all HTML really does is organize documents. New Web developers
may mistake HTML for a programming language when it is actually a mark-up language.

HTML was never designed for the Web that exists today, as it is just a mark-up
language with severe limitations, in terms of control and design. Numerous technologies
have been used to work around this issue – the most significant being cascading style sheet
(CSS).On the client side, JavaScript (JS) is used to provide interactivity. On the server side,
a Web development platform like Ruby, PHP or ASP.NET is used. The line between server-
side development and client side development is blurry with technologies like AJAX. The
long term solution is (or hopefully will be) HTML5, which is the next generation of HTML
and allows for more control and interactivity. As with any development on the Web, the
move to standards is a slow and arduous process, and Web developers and designers have to
make do with current and supported technologies, which mean that basic HTML will
continue to be used for some time.

Dept. of ISE,EPCET 2019-2020 Page 4

Fashion Adda –An E–Commerce Website Internship

Features in HTML5 are:

 The DOCTYPE declaration for HTMl5 is very simple 

 The character encoding<meta charset=”UTF-8”>
 New function for embedding audio(<audio>), video(<video>), graphics(<svg> and
<canvas> ) 
 Client-side data storage
 Interactive documents
 New structural elements <article> ,<header>,<footer>,<nav>,<section> and <figure> 
 New from control calendar, date, time, email, url, search
 Java script enhancement 
 New HTML5 API’s
 HTML Geo location, HTML Drag And Drop, html local storage, HTML Application
Cash, HTML Web Workers, HTML SSE

3.1.2 APPLICATIONS OF HTML

HTML is a markup language, heavily utilized for creating web pages and web applications.
HTML, when combined with JavaScript and CSS, has become a milestone for web
development. One of a useful aspect of HTML is, it can embed programs written in a
scripting language like JavaScript, which is responsible for affecting the behavior and content
of web pages. CSS inclusion would affect the layout and appearance of the content. Basic
building blocks of any HTML pages are HTML elements. A structured document can be
created with help of structural semantic for text like heading, paragraph, list, link, and other
items. Browser indeed does not display the HTML tags but utilize them to interpret the
content of the page. One needs to study various tags and then understand their behavior.
HTML has been used widely and effectively. Below is the list of Uses of HTML language.

 Web pages development

 Web document creation
 Internet navigation
 Responsive images on web pages
 Data Entry support with HTML

Dept. of ISE,EPCET 2019-2020 Page 5

Fashion Adda –An E–Commerce Website Internship

 Game development usage


3.1.3 ADVANTAGE OF HTML
1. Its plain text so is easy to edit.
2. Its also fast to download (text is highly compressable).
3. Is very easy to pickup/learn
4. Its now a standard
5. Its supported by most browsers across most if not all platforms.
6. Simple to edit only requires a text editor.
7. Can be easily edited with WYSIWYG editors (no coding required)
8. Can be used to present just about any kind of data.
9. Tags can be used (or used to be able to be used) very loosely (i.e. used to be able to
omit end tags etc).
10. Every browser supports HTML language.
11. Easy to learn and use.
12. It is by default in every window so you don't need to purchase extra software.
13. You can integrate HTML with CSS, JavaScript, php etc.

3.1.4 DISADVANTAGES OF HTML

1. It can create only static and plain pages so if we need dynamic pages then HTML is
not useful.
2. Need to write a lot of code for making a simple webpage.
3. Security features are not good in HTML.
4. If we need to write long code for making a webpage then it produces some
complexity
5. It is static needs to be manually updated or needs some scripting support to change it
in some way.
6. Isn't really as flexible as other standards or technologies Its not centralised (all pages
must be edited individually). Very limited styling capabilities.


Dept. of ISE,EPCET 2019-2020 Page 6

Fashion Adda –An E–Commerce Website Internship

3.2 INTRODUCTION TO WORDPRESS

WordPress is a free and open-source content management system (CMS) written in PHP and
paired with a MySQL or MariaDB database. Features include a plugin architecture and a
template system, referred to within WordPress as Themes. WordPress was originally created
as a blog-publishing system but has evolved to support other types of web content including
more traditional mailing lists and forums, media galleries, membership sites, learning
management systems (LMS) and online stores. WordPress is used by more than 60 million
websites,including 33.6% of the top 10 million websites as of April 2019,WordPress is one
of the most popular content management system solutions in use. WordPress has also been
used for other application domains such as pervasive display systems (PDS).

3.2.1 What can WordPress do?

WordPress is an excellent website platform for a variety of websites. From
blogging to e-commerce to business and portfolio websites, WordPress is a
versatile CMS.

Here are just a few examples of the types of websites you can build with
WordPress

 Blog
 E-commerce
 Business
 News
 Photography
 Music
 Membership

3.2.2 FEATURES OF WORDPRESS

One of the most common misconception about WordPress is that it is just a blogging
platform. While WordPress started as a blogging tool, it has evolved throughout the years
into a powerful website builder and a robust content management system (CMS).

Dept. of ISE,EPCET 2019-2020 Page 7

Fashion Adda –An E–Commerce Website Internship

The best part about WordPress is that it’s easy to use and flexible enough to make
different types of websites. That’s the main reason why WordPress has grown so much in
popularity. According to a recent survey, WordPress powers 32.3% of all websites on the
internet.

Due to it’s robust features, many of the top brands use WordPress to power their
websites including Time Magazine, Facebook, The New Yorker, Sony, Disney, Target, The
New York Times, and more.

Let’s take a look at why should we use WordPress to make your website.

1. WordPress is Free as in Freedom

WordPress is free and open source

WordPress is a free software. It means you are free to download, install, use and modify it
to match your needs. You can use it to create any kind of website

While the WordPress software itself is free, you need a domain name and web hosting to
install it.

A domain name is the address of your website on the internet. This is what your users type
in their browser’s address bar to access your website (for example, wpbeginner.com).

Web hosting is your website’s house where all your website files are stored.

2. WordPress is Easy to Customize with Themes and Plugins

A large portion of people using WordPress are neither web designers nor programmers. As
a matter of fact, most folks start using WordPress without any prior knowledge of designing
websites.

For non-tech savvy folks, WordPress is the perfect solution because there are
thousands of free website templates (themes) that you can choose from. There is a perfect
WordPress theme for just about every kind of website (whether it’s a blog, business site, or
an online store).

Dept. of ISE,EPCET 2019-2020 Page 8

Fashion Adda –An E–Commerce Website Internship

WordPress themes are easy to customize because a lot of them come with their own
options panel allowing you to change colors, upload logo, change the background, create
beautiful sliders, and truly customize it to your needs without writing any code at all.

You can also add custom functionality to your WordPress site by using plugins.
WordPress plugins are like apps for your website that you can use to add advanced features
like analytics, contact forms, membership area, and more.

Just like themes, there are thousands of free and premium plugins available for you
to use. To learn more, see our article on what are WordPress plugins and how do they work.

Aside from adding extra functionality, some WordPress plugins can let you
transform your website into a completely new platform. Take a look at our expert pick of
essential WordPress plugins for every website.

3. WordPress is SEO Friendly

WordPress is written using standard compliance high-quality code and produces semantic
markup. In non-geek terms, this makes Google and other search engines love WordPress.

This is why WordPress sites tend to rank higher than others in search
engines. By design, WordPress is very SEO friendly out of the box. You can also
use WordPress SEO plugins to further optimize your website

4.WordPress is Easy To Manage

WordPress comes with a built-in updates management system. This allows you to update
your plugins and themes from within your WordPress admin dashboard.

WordPress also notifies you when there is a new version of WordPress

available, so you can update your site by simply clicking a button.

To protect your data from any accident or hacking, you can easily use a
WordPress backup plugin to automatically create backups and store them safely on a
remote location.

Dept. of ISE,EPCET 2019-2020 Page 9

Fashion Adda –An E–Commerce Website Internship

You can also manage your WordPress site on the go with WordPress mobile apps.

5. WordPress is Safe and Secure

WordPress is developed with security in mind, and it is considered to be a very safe and
secure platform to run a website. However, just like the real world, the internet can be an
uncertain place.

There are intruders out there who want to get their hands on as many sites as they could. To
protect your WordPress site, there are a few simple things that you can do to make it even
more secure. For details, see our step-by-step WordPress security guide for beginners.

We use Sucuri on our websites to protect against common threats such as brute force
attacks and malware.

6. WordPress Can Handle Different Media Types

WordPress is not just limited to writing text. It comes with a built-in media uploader to
handle images, audio, and video files.

WordPress supports oEmbed enabled websites which means you can embed
YouTube videos, Instagram photos, Tweets, and Soundcloud audio by just pasting the URL
in the WordPress post editor.

What ways to use WordPress?

WordPress can be used in many different ways from simple websites to eCommerce
marketplaces and anything in between.

Following are just a few examples of different kind of websites you can make with
WordPress.

 Start a Business
 Make a business website
 Start an online store
 Build a membership website

Dept. of ISE,EPCET 2019-2020 Page 10

Fashion Adda –An E–Commerce Website Internship

 Sell online courses

3.2.3 APPLICATION OF WORDPRESS

1. Develop a classified site for business or organization purpose.

2. Uses of WordPress helps you to Develop a real estate and property listing web
area.
3. Applications of WordPress Allows you building individual landing pages that
resemble a lot with sites.
4. Static website creation with its classified plugins, setup speed, and themes.
5. Creation of a web directory which involves consolidated site listings, these link
directories, paid premium links can be achieved using Sean Blues ton’s WP Link
Directory Plugin.
6. Setting up article repositories in word press powered sites which accept submission
of articles and also pick specific articles from the dragon network, this functionality
can be achieved by using Article Directory Plugin.

3.2.4 ADVANTAGES OF WORDPRESS

1. Easy
2. Community
3. Plugins
4. Templates
5. Menu management
6. Non-standard fields

3.2.5 DISADVANTAGES OF WORDPRESS

1. Modification requires knowledge of PHP

2. PHP security
3. Tables and graphics formatting
4. SQL queries

Dept. of ISE,EPCET 2019-2020 Page 11

Fashion Adda –An E–Commerce Website Internship

3.3 CASCADING STYLE SHEETS (CSS)

CSS is an abbreviation for Cascading Style Sheets. CSS works with HTML and other
Markup Languages (such as XHTML and XML) to control the way the content is presented.
Cascading Style Sheets is a means to separate the appearance of a webpage from the content of a
webpage. CSS is a recommendation of the World Wide Web Consortium (the W3C). The W3C is
a consortium of web stakeholders: universities, companies such as Microsoft, Netscape and
Macromedia, and experts in many web related fields. The presentation is specified by styles,
which are presented in a style sheet. If you're familiar with word processing programs like
Microsoft Word, you have probably played around at least a little bit with styles. For example,
when you want to make the headline text of your document big and bold, the hard way to do it
would be to select the text, select a font face and weight, and select the color. The easier way to
do it (presuming your document has more than one headline) is to create a "rule", or style, for all
the headlines in your document. Then all you have to do is to make one rule, and keep on
applying that to all your headers. CSS in its most basic form works exactly like this. Instead of
using <FONT> tags over and over again to control little sections of your page, you can establish
some rules to apply globally, to a single page or all the pages on your site. CSS is a great time
saver.

The cascade part of CSS means that more than one style sheet can be attached to a
document, and all of them can influence the presentation. For example, a designer can have a
global style sheet for the whole site, but a local one for say, controlling the link color and
background of a specific page. Or, a user can use her own style sheet if she has problems
seeing the page, or if she just prefers a certain look. 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, as well as a variety of other
effects. CSS is easy to learn and understand but it provides a powerful control over the
presentation of an HTML document. Most commonly, CSS is combined with the markup
languages HTML or XHTML.

Dept. of ISE,EPCET 2019-2020 Page 12

Fashion Adda –An E–Commerce Website Internship

3.3.1 Who creates and maintains CSS?

CSS is created and maintained through a group of people within the W3C called the CSS
Working Group. The CSS Working Group creates documents called specifications. When a
specification has been discussed and officially ratified by the W3C members, it becomes a
recommendation. These ratified specifications are called recommendations because the W3C
has no control over the actual implementation of the language. Independent companies and
organizations create that software.

3.3.2 CSS Versions

Cascading Style Sheets level 1 (CSS1) came out of W3C as a recommendation in December
1996. This version describes the CSS language as well as a simple visual formatting model
for all the HTML tags. CSS2 became a W3C recommendation in May 1998 and builds on
CSS1. This version adds support for media-specific style sheets e.g. printers and aural
devices, downloadable fonts, element positioning and tables.

3.3.3 CSS Syntax

A CSS comprises of style rules that are interpreted by the browser and then applied to the
corresponding elements in your document. A style rule is made of three parts:

• Selector: A selector is an HTML tag at which a style will be applied. This could be
any tag like <h1> or <table> etc.

• Property: A property is a type of attribute of HTML tag. Put simply, all the HTML
attributes are converted into CSS properties. They could be color, border, etc.

• Value: Values are assigned to properties. For example, color property can have the
value either red or #F1F1F1 etc.

You can put CSS Style Rule Syntax as follows:

selector { property: value; }

Example: You can define a table border as follows

Dept. of ISE,EPCET 2019-2020 Page 13

Fashion Adda –An E–Commerce Website Internship

table{border: 1px solid #C00;}

Here table is a selector and border is a property and the given value 1px solid #C00 is the
value of that property. You can define selection in various simple ways based on your
comfort.

The different types of selectors are:

 Universal Selector
 Element Selector
 Id selector
 Class Selector
 Descendant Selector
 Attribute Selector

A Simple CSS file looks like this:

body{
font-family: verdana, arial, “sans serif”;

color: #000000;
background: white;
}
P{
text-align: center;
}

Dept. of ISE,EPCET 2019-2020 Page 14

Fashion Adda –An E–Commerce Website Internship

3.4 ATTACHING STYLES

There are three ways that styles can be associated with an HTML document. First, styles can
be placed inline in a document. Second, a style sheet can be embedded in the head of an
HTML document. The third way of associating web pages with style sheets is to place a link
in the head of the HTML file to an external style sheet. With this link, when the browser
begins reading the page, it sees the style sheet link, and downloads the style sheet, then uses
the style sheet to draw the page.

3.4.1 Inline Styles:

Style rules can be specified right in the HTML tag, with style="style rules". Here is an
example:

<p style="font-family: trebuchet, times, serif; font-size: 20px; font-weight: 600; color:
#7C3030; background color: #B5D6A9">

The style rules above look like this!

</p>

Specifying inline styles is useful when you only want to apply those styles to a specific
element, as is the case above. For example, if you wanted to really emphasize a piece of text
in your sentence, you could specify a local style of "color: red" to a <span> element so that it
looks like this <span style="color: red;">it looks like this</span>.

3.4.2 Embedding Style Sheets:

Style sheets can be embedded into the <head> element of HTML documents. Quite simply,
the style sheet itself is placed inside a <style> tag like this:

<style type="text/css"> </style>

You would embed a style sheet within an HTML document when you want a single
document to have a unique style. The head of the HTML document would look something
like this:

<head>

<style type="text/css">

hr {color: brown;}

Dept. of ISE,EPCET 2019-2020 Page 15

Fashion Adda –An E–Commerce Website Internship

p{
font-family: arial, verdana, "sans-serif";}
body {background-color: #ffffff;}
</style>

</head>

The browser will now read the style definitions, and format the document according to it. It's
easiest for CSS beginners to start by putting CSS rules in the <head> section of the web page.
This way, you can make changes, preview the page in the browser, and see immediate results.

3.4.3 External Style Sheet:

An external style sheet is just a text file, containing property: value style rules. The only
difference between the contents of an external style sheet and having your style rules in the
document itself is that you do not include the <style> </style> tags, or any other HTML tags. To
link a HTML document to a style sheet, you place a link to the style sheet in the head of the
document. Linking to an external style sheet is ideal when applying styles to many pages. With
an external style sheet, you can change the look of an entire web site by changing one file. Each
page must link to the style sheet using the <link> tag. The <link> tag goes inside the head
section:

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />

</head>

The browser will read the style definitions from the file mystyle.css, and format the document
according to it. This can be either a relative or absolute url. The relative url is relative to the
HTML document, unlike url's within style sheets which are relative to the style sheet. An
external style sheet can be written in any text editor. The file should not contain any HTML
tags. Your style sheet should be saved with a .css extension.

Dept. of ISE,EPCET 2019-2020 Page 16

Fashion Adda –An E–Commerce Website Internship

3.4.4 CSS Background Properties:

The background property will let you set the background color, set the background as an
image, repeat a background image and set a background image position on a page.

 background-color: Sets the background color of an

element.
Values: color-rgb, color-hex, color-name, transparent
 background-image: Sets an image as the background.
Values: url, none
 background-attachment: Sets whether a background image is fixed or scrolls with
the rest of the page.
Values: scroll, fixed
 background-position: Sets the starting position of a background image.
Values: top left, top center, top right, center left, center center, center right, bottom
left
 background-repeat: Sets if/how a background image will be repeated.
Values: repeat, repeat-x, repeat-y, no-repeat

3.4.5 CSS Border Properties:

Borders can be applied to most HTML elements within the body. The Border properties
allow you to specify the style, color, and width of an element's border. In HTML tables are
usually used to create borders around text, but with the CSS Border properties you can create
borders that can be applied to any element. You can apply a border style to any of the four
sides of an element by using top, bottom, right or left designations in your selector.

 border-color: Sets the color of the four borders, can have from one to four colors.
Values: color
 border-style: Sets the style of the four borders, can have from one to four styles.
Values: none, hidden, dotted, dashed, solid, double, groove, ridge, inset, outset
 border-width: A shorthand property for setting the width of the four borders in one
declaration, can have from one to four values.
Values: thin, medium, thick, length

Dept. of ISE,EPCET 2019-2020 Page 17

Fashion Adda –An E–Commerce Website Internship

3.4.6 CSS Text and Font Properties:

To apply text and font styles, you redefine HTML elements like <p>, <h1>, <h2> and others.
Font and text appearance are the things we most want to control with CSS. Font selector rules
mostly apply to things we used to control with the <font> tag, while text selector rules cover
other things that influence the way a piece of text if presented.

The following are the text properties:

 color: Sets the color of the text.

Values: color
 letter-spacing: Increase or decrease the space between characters.
Values: normal, length
 text-align: Aligns the text in an element.
Values: left, right, center, justify
 text-decoration: Adds decoration to text.
Values: none, underline, overline, line-through, blink
 text-indent: Indents the first line of text in an element.
Values: length, %
 text-transform: Controls the letters in an element.
Values: none, capitalize, uppercase, lowercase

The following are the font properties:

 font-family: A prioritized list of font family names and/or generic family names for
an element.
Values: family-name, generic-family
 font-size: Sets the size of a font.
Values: xx-small, x-small, small, medium, large, x-large, xx-large, smaller, larger,
length
 font-style: Sets the style of the font.
Values: normal, italic, oblique
 font-weight: Sets the weight of a font.
Values: normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900

Dept. of ISE,EPCET 2019-2020 Page 18

Fashion Adda –An E–Commerce Website Internship

3.4.7 Margins and padding:

Margin and padding are the two most commonly used properties for spacing-out elements. A
margin is the space outside of the element, whereas padding is the space inside the element.
While most style rules can be applied to most block level and inline HTML elements, some
can only be applied to block-level elements: those are border, margin and padding.

The following paragraph has these styles applied:

p{
margin-left: 10px;
margin-right: 20px;
padding: 10px;
background-color: #FFCC99;
border: 5px dotted gray;

3.5 MySql

MySQL is an open source relational database management system (RDBMS). Its name is a
combination of "My", the name of co-founder Michael Widenius's daughter, and "SQL", the
abbreviation for Structured Query Language.

MySQL is free and open-source software under the terms of the GNU General Public
License, and is also available under a variety of proprietary licenses. MySQL was owned and
sponsored by the Swedish company MySQL AB, which was bought by Sun Microsystems
(now Oracle Corporation). In 2010, when Oracle acquired Sun, Widenius forked the
opensource MySQL project to create MariaDB.

MySQL is a component of the LAMP web application software stack (and others),
which is an acronym for Linux, Apache, MySQL, Perl/PHP/Python. MySQL is used by many
database-driven web applications, including Drupal, Joomla, phpBB, and WordPress.

Dept. of ISE,EPCET 2019-2020 Page 19

Fashion Adda –An E–Commerce Website Internship

MySQL is also used by many popular websites, including Google (though not for searches),
Facebook, Twitter, Flickr, and YouTube.

MySQL is written in C and C++. Its SQL parser is written in yacc, but it uses a home-
brewed lexical analyzer. MySQL works on many system platforms, including AIX, BSDi,
FreeBSD, HP-UX, eComStation, i5/OS, IRIX, Linux, macOS, Microsoft Windows, NetBSD,
Novell NetWare, OpenBSD, OpenSolaris, OS/2 Warp, QNX, Oracle Solaris, Symbian,
SunOS, SCO OpenServer, SCO UnixWare, Sanos and Tru64. A port of MySQL to
OpenVMS also exists.

The MySQL server software itself and the client libraries use dual-licensing distribution.
They are offered under GPL version 2, or a proprietary license.

Support can be obtained from the official manual. Free support additionally is available
in different IRC channels and forums. Oracle offers paid support via its MySQL Enterprise
products. They differ in the scope of services and in price. Additionally, a number of third
party organizations exist to provide support and services, including MariaDB and Percona.
MySQL has received positive reviews, and reviewers noticed it "performs extremely well in
the average case" and that the "developer interfaces are there, and the documentation (not to
mention feedback in the real world via Web sites and the like) is very, very good". It has also
been tested to be a "fast, stable and true multi-user, multi-threaded sql database server".

3.6 JDBC

Java Database Connectivity (JDBC) is an application programming interface (API) for the
programming language Java, which defines how a client may access a database. It is a Java-
based data access technology used for Java database connectivity. It is part of the Java
Standard Edition platform, from Oracle Corporation. It provides methods to query and update
data in a database, and is oriented towards relational databases. A JDBC-to-ODBC bridge
enables connections to any ODBC-accessible data source in the Java virtual machine (JVM)
host environment.

Dept. of ISE,EPCET 2019-2020 Page 20

Fashion Adda –An E–Commerce Website Internship

3.7 JavaScript

JavaScript often abbreviated as JS, is a high-level, interpreted programming language that

conforms to the ECMAScript specification. It is a language that is also characterized as
dynamic, weakly typed, prototype-based and multi-paradigm.

Alongside HTML and CSS, JavaScript is one of the three core technologies of the
World Wide Web. JavaScript enables interactive web pages and thus is an essential part of
web applications. The vast majority of websites use it, and all major web browsers have a
dedicated JavaScript engine to execute it.

As a multi-paradigm language, JavaScript supports event-driven, functional, and

imperative (including object-oriented and prototype-based) programming styles. It has APIs
for working with text, arrays, dates, regular expressions, and the DOM, but the language
itself does not include any I/O, such as networking, storage, or graphics facilities, relying for
these upon the host environment in which it is embedded.

Initially only implemented client-side in web browsers, JavaScript engines are now
embedded in many other types of host software, including server-side in web servers and
databases, and in non-web programs such as word processors and PDF software, and in
runtime environments that make JavaScript available for writing mobile and desktop
applications, including desktop widgets.

The terms Vanilla JavaScript and Vanilla JS refer to JavaScript not extended by any
frameworks or additional libraries. Scripts written in Vanilla JS are plain JavaScript code.

Although there are similarities between JavaScript and Java, including language name,
syntax, and respective standard libraries, the two languages are distinct and differ greatly in
design; JavaScript was influenced by programming languages such as Self and Scheme.

Dept. of ISE,EPCET 2019-2020 Page 21

Fashion Adda –An E–Commerce Website Internship

CHAPTER 4
REFLECTION

E-commerce website for shopping clothes is developed using HTML, JavaScript, Java and
MySQL. I developed Front-end and also Back-end of E-commerce website for shopping
clothes based on web server, which can be implemented on any computer. In this application,
JAVA is server-side language, MySQL is used as back-end design and HTML and JavaScript
are used as front-end tools.

WEB APPLICATION DEVELOPMENT

4.1 Project Executed:
4.1.1 Home Page Module:

Fig 4.1.1 :Home Page

The Fig 4.1.1 represents the home page of Fashion Adda for shopping clothes with respect to
the particular categories.

Dept. of ISE,EPCET 2019-2020 Page 22

Fashion Adda –An E–Commerce Website Internship

4.1.2 About us Module

Fig. 4.1.2: About Page

The Fig. 4.1.2 represents the brief description about the e-commerce website “Fashion
Adda”. It describes on how the company or the organization works and also the policies that
the company follows.

4.1.3 Contact us Module

Fig. 4.1.3: Contact Page

Dept. of ISE,EPCET 2019-2020 Page 23

Fashion Adda –An E–Commerce Website Internship

The Fig. 4.1.3 represents the contact page. It enables the customer to send feedbacks, ask
queries, and make complaints. The customer needs to enter his/her credentials in order to
perform the above mentioned tasks.

4.1.4 Cart Module

Fig. 4.1.4: Cart Page

The Fig. 4.1.4 represents the various clothes that the user or customer is interested in. Once
the user click on the Add to Cart button, that particular item will be added to the cart and
displayed on the Cart page. The user can either increase or decrease the quantity of the
selected item, remove or place order for the selected items.

Dept. of ISE,EPCET 2019-2020 Page 24

Fashion Adda –An E–Commerce Website Internship

4.1.5 Product Module

Fig. 4.1.5: Products Page

The Fig. 4.1.5 represents the Products page in which it consists of various products related to
a particular category that has been selected by the user. The user can browse through the
various products and select the products of their interest.

Dept. of ISE,EPCET 2019-2020 Page 25

Fashion Adda –An E–Commerce Website Internship

4.1.6 Saree Product page

Fig. 4.1.6: Saree Product Catalog

The Fig: 4.1.6 represents Saree product page in which it consists of various kinds of Sarees.
The user can browse through the various products and select the products of their interest.

4.1.7 Kurta Product Page

Fig. 4.1.7: Kurta Product Catalogue

Dept. of ISE,EPCET 2019-2020 Page 26

Fashion Adda –An E–Commerce Website Internship

The fig. 4.1.7 represents Kurtas product page in which it consists of various kinds of Kurtas.
The user can browse through the various products and select the products of their interest.

4.1.8 Western Tops Product Page

Fig. 4.1.8: Western Tops Product Catalogue

The fig. 4.1.7 represents Western Tops product page in which it consists of various kinds of
Western Tops. The user can browse through the various products and select the products of
their interest.

Dept. of ISE,EPCET 2019-2020 Page 27

Fashion Adda –An E–Commerce Website Internship

4.1.9 Order Summary

Fig. 4.1.9: Order Summary Page

Dept. of ISE,EPCET 2019-2020 Page 28

Fashion Adda –An E–Commerce Website Internship

The Fig. 4.1.9 represents the preview of the product that is about to be bought. The quantity
selected and price details is shown. The customer has to provide address details on where the
product has to be delivered. The customer also has privilege to add multiple shipping
addresses.

4.1.10 Customer Login Page

Fig. 4.1.10: Login Page

The login page as shown in Fig. 4.1.10 is used by the user or customer in order to access
his/her account, manage the items in his cart and also to place order. The email id and
password of the customer is authenticated with the help of the database.

Dept. of ISE,EPCET 2019-2020 Page 29

Fashion Adda –An E–Commerce Website Internship

4.2 Back end database:

The back end has the tables to store and to retrieve the details from the front end. The tables
that are used are:

1. Product Table.
2. User Table.
3. Customer query Table.
4. Order Address Table.
5. Delivery Address Table.
6. Cart Table.
7. Order Table.

Dept. of ISE,EPCET 2019-2020 Page 30

 CONCLUSION

The Internship Training Program has taught me on how to develop an E-

commerce website. The website has details of the products that are used for Clothing.
The customers can buy the product which they like to use or they can add it to the cart
to buy later. When the customer has interest to buy he or she can login into the website
and can buy the product. The customer can add more than one shipping address to
collect the product, or customer can change the delivery address before the product
gets dispatched. Developing an Online Web Application is achieved. The Responsive
capability of the application allows the users to access the application from various
smart devices like smart phones, tablets or any smart device.
 REFERENCES

[1] CSS - https://en.wikipedia.org/wiki/Cascading_Style_Sheets

[2] HTML - From Wikipedia, the free encyclopedia

https://en.wikipedia.org/wiki/HTML

[3] HTML 5 - https://en.wikipedia.org/wiki/HTML5

[4] JDBC - https://en.wikipedia.org/wiki/Java_Database_Connectivity

[5] JavaScript - https://en.wikipedia.org/wiki/JavaScript

[6] MYSQL - https://en.wikipedia.org/wiki/MySQL

CERTIFICATE OF INTERNSHIP