Web development

©Garvit Baleshwar
JODHPUR INSTITUTE OF ENGINEERING & TECHNOLOGY, JODHPUR
PRACTICAL TRAINING SEMINAR
ON
WEB DEVELOPMENT
SUBMITTED BY:
GARVIT BALESHWAR
CSE
1

©Garvit Baleshwar
Company Introduction
Company Name :- Cipher Schools
Instructor Name :- Mr. Arun Kudiyal
Training Duration :- 45 Days
2

©Garvit Baleshwar
TABLE OF CONTENT
◼ Introduction to Web Development
◼ Types of Web Developer
◼ Introduction to HTML
◼ Terms in HTML
◼ Introduction to CSS
◼ CSS Syntax
◼ Types of CSS
◼ Introduction to JavaScript(JS)
◼ JavaScript Syntax
◼ Projects
3

©Garvit Baleshwar
INTRODUCTION TO WEB DEVELOPMENT
◼ Web development is the work involved in developing a Web
site for the Internet
◼ Web development can range from developing a simple single static
page of plain text to complex Web-based Internet
applications (Web apps)
◼ It usually refers to the main non-design aspects of building Web
sites: writing markup and coding
◼ It refers to building, creating, and an maintaining websites
4

©Garvit Baleshwar
TYPES OF WEB DEVELOPER
◼ Back-End Developer
The back-end is where the website’s core structure is designed.
These developers are experts in programming and using
complex software languages like Java, SQL and C#
◼ Front-End Developer
This is also known as client-side development. It’s more
connected to web design than back-end development because it
involves using HTML, CSS, and JavaScript to create things the
user can see
◼ Full Stack Developer
A full stack web developer is a person who can develop both
client and server software. They are working with both the
front and back ends of a website or application
5

©Garvit Baleshwar
INTRODUCTION TO HTML
◼ Hypertext Markup Language is the standard markup language
for documents designed to be displayed in a web browser.
◼ Extension .html or .htm
◼ Developed in 1997
◼ HTML describes the structure of a Web page
◼ HTML consists of a series of elements
◼ HTML elements tell the browser how to display the content
6

©Garvit Baleshwar
TERMS IN HTML
◼ Tags
◼ HTML makes use of various tags to format the content
◼ These tags are enclosed within angle braces
<Tag Name>
◼ Except few tags, most of the tags have their corresponding
closing tags.
E.g.
<html> </html>
<body> </body>
<p> </p>
<title> </title>
<br>
7

©Garvit Baleshwar
HTML ELEMENT & ATTRIBUTES
Elements
● An HTML element is defined by a start tag,
some content, and an end tag
● <tagname>Content goes here...</tagname>
E.g.
<h1>My First Heading</h1>
<p>My first paragraph</p>
Attributes
● All HTML elements can have attributes
● Attributes provide additional information about
elements
● Attributes are always specified in the start tag
E.g.
<p align = "left">This is left aligned</p>
<img src="img_car.jpg">
<p style="color:red;">This is a red paragraph.</p> 8

©Garvit Baleshwar
SIMPLE HTML DOCUMENT
9

©Garvit Baleshwar
INTRODUCTION TO CSS
◼ CSS stands for Cascading Style Sheets
◼ CSS 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 style sheets are stored in CSS files
◼ Extension .css
◼ (CSS) is a simple mechanism for adding style (e.g., fonts, colors, spacing) to Web
documents.
10

©Garvit Baleshwar
CSS SYNTAX
• The selector points to the HTML element you want to style.
• The declaration block contains one or more declarations separated by
semicolons.
• Each declaration includes a CSS property name and a value, separated by
a colon.
E.g.
p {
color: red;
text-align: center;
} 11

©Garvit Baleshwar
TYPES OF CSS
Inline CSS
◼ Inline CSS is used to apply a unique style to a single HTML element.
◼ It is applied by using the style attribute inside HTML elements
Internal or Embedded CSS
◼ This CSS style is an effective method of styling a single page
◼ It is applied by using a <style> element in the <head> section
External CSS
◼ With external CSS, web pages are linked to an external .css file, which
can be created by any text editor
◼ This CSS type is a more efficient method, especially for styling a large
website
◼ It is applied by using a <link> element to link to an external CSS file
12

©Garvit Baleshwar
SIMPLE CSS DOCUMENT
13

©Garvit Baleshwar
Introduction
• JavaScript is used to program the behavior of web pages
• JavaScript code is inserted
between <script> and </script> tags
• Scripts can be placed in the <body>, or in the <head> section
of an HTML page, or in both.
• JavaScript is a case-sensitive language
• File extension .js, .mjs
JavaScript Functions
• A JavaScript function is a block of JavaScript code, that can
be executed when "called" for
• JavaScript function is placed in the <head> section and in
<title> section of an HTML page
JAVA SCRIPT
14

©Garvit Baleshwar
JAVASCRIPT SYNTAX
The JavaScript syntax defines two types of
values:
◼Fixed values
Fixed values are called Literals
◼Variable values
Variable values are called Variables
Variables
◼Variables are used to store data values.
◼JavaScript uses the var keyword to declare variables
◼An equal sign is used to assign values to variables
16

Web development

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to Web development

Similar to Web development (20)

Recently uploaded

Recently uploaded (20)

Web development