Full stack devlopment using django main ppt

About
Coursera
DEPARTMENT OF COMPUTER ENGINEERING
INDUSTRIAL TRAINING PRESENTATION
“Full Stack Web
Development”
PRESENTED BY:- SUDHANSHU VIJAY
REG NO. :- PIET18CS139
YEAR :- 4th
Introduction

About
Coursera
Full
Stack
Development
Coursera Inc. is an American massive open online
course provider founded in 2012 by Stanford
University computer science professors Andrew
Ng and Daphne Koller. Coursera works with
universities and other organizations to offer
online courses, certifications, and degrees in a
variety of subjects.

Full
Stack
Development
Stages
of
Full
Stack
• Full stack development: It refers to the development of
both front end(client side) and back end(server side)
portions of web application.
• Full stack web Developers: Full stack web developers have
the ability to design complete web application and
websites. They work on the frontend, backend, database
and debugging of web application or websites.

Stages
of
Full
Stack
Backend
Full
Stack
Frontend
Backend

Backend
Introduction
to
Django
Back end: It refers to the server-side
development of web application or website
with a primary focus on how the website
works. It is responsible for managing the
database through queries and APIs by client-
side commands. This type of website mainly
consists of three parts front end, back end,
and database.

Introduction
to
Django
Pillars
Of
Django
Definition :
» “Django” is basically a web framework
created using python.
» “Django” is mainly use to create Backend of
a website by mixing python programming in
HTML, CSS, JS etc.
» “Django” provides a platform to develop web
applications rapidly and more securely.

Pillars
Of
Django
Django
Model
VIEW
DJANG
O

Django
Model
Django
View
Introduction To Django
Models
Advantages Of Django Models
Steps To Create Django Models

Django
View
Django
Templates
Creating Django Views
Class Based View V/S
Function Based Views
Django Views
Component

Django
Templates
Key
Features
What Are Django Templates?
Steps to Create Django Templates
Django Template Language

Key
Features
Frontend
Some of the
busiest sites
on the planet
use Django’s
ability to
quickly and
flexibly scale
to meet the
heaviest
traffic
demands.
Exceedingly
Scalable
Django takes
security seriously
and helps
developers avoid
many common
security mistakes,
such as SQL
injection, cross-
site scripting,
cross-site request
forgery and
clickjacking. Its
user
authentication
system provides a
secure way to
manage user
accounts and
passwords.
Reassuringly
Secure
Django includes
dozens of extras you
can use to handle
common Web
development tasks.
Django takes care of
user authentication,
content
administration, site
maps, RSS feeds, and
many more tasks —
right out of the box.
Fully Loaded
Django was
designed to
help
developers
take
applications
from concept
to completion
as quickly as
possible.
RidiculouslyFast

Frontend
What
is
HTML?
Frontend: It is the visible part of website or
web application which is responsible for user
experience. The user directly interacts with
the front end portion of the web application
or website.

What
is
HTML?
Explanation
of
basic
structure
HTMLis the standard markuplanguage for
Web pages.
HTMLwas invented by Tim Berners-Lee.
It is used for creating web pages, which are
displayedon world wide web.
It needs text editors likenotepad, Sublime,
ect. to write the code.

Explanation
of
basic
structure
Types
of
elements
in
html
•The <!DOCTYPE html> declaration defines
that this document is an HTML5 document.
•The <html> element is the root element of
an HTML page.
•The <head> element contains meta
information about the HTML page.
•The <title> element specifies a title for the
HTML page (which is shown in the browser's
title bar or in the page's tab).
•The <body> element defines the document's
body, and is a container for all the visible
contents, such as headings, paragraphs,
images, hyperlinks, tables, lists, etc.

Types
of
elements
in
html
What
is
CSS?
An HTML element is defined by a
start tag, some content, and an end
tag:
<tagname>Content goes
here...</tagname>
<h1>My First Heading</h1>
1. CONTAINER TAG: Requires
opening and closing
both.<b>HTML</b>
2. EMPTY TAG: Doesn't require a
closing tag.Ex,<br>

What
is
CSS?
Types
of
style
sheets
• CSS stands for Cascading Style Sheets
• CSS is the language we use to style an HTML
document.
• CSS saves a lot of work. It can control the
layout of multiple web pages all at once.

Types
of
style
sheets
Advantages
of
CSS
There are three ways of inserting a style sheet:
1. External CSS- It is separate style file used to
define all style rules which is saved with
extension .css.
2. Internal CSS- In this, we define the style
rules in the same html page, where we
wants to style.
3. Inline CSS- We can define the style rule for a
single tag in html page itself.

Advantages
of
CSS
What
is
JavaScript?
• It save time to develop web pages.
• It is easy to maintain.
• It supports all type of web standers and
browsers.
• CSS efficiently works with search engines.
• CSS has wide variety of tags.

What
is
JavaScript?
JavaScript
Example
JavaScript is the world's most popular programming
language.
JavaScript is an object-based scripting language which is
lightweight and cross-platform.
It is a case-sensitive language.
JavaScript is a language that works with html to enhance
web pages and to make them interactive.

JavaScript
Example
How
to
write
code
Explanation of the code:
The text/javascript is the content type that
provides information to the browser about the
data.
The document.write() function is used to
display dynamic content through JavaScript.
<script type="text/javascript">
document.write("
JavaScript is a simple language for learners");
</script>

How
to
write
code
About
Projects
Apply in head section
•<html>
• <head>
• <script type="text/javascript">
• function msg(){
• alert("Hello Javatpoint");
• }
• </script>
• </head>
• <body>
• <p>Welcome to JavaScript</p>
• <form>
• <input type="button" value="click" onclick="msg()"/>
• </form>
• </body>
• </html>
Through external flie
•<html>
•<head>
•<script type="text/javascript" src="message.js"></script>
•</head>
•<body>
•<p>Welcome to JavaScript</p>
•<form>
•<input type="button" value="click" onclick="msg()"/>
•</form>
•</body>
•</html>
function msg(){
alert("Hello");
}
Message.
js

About
Projects
Certificate
चित्रहार

Full stack devlopment using django main ppt

More Related Content

Full stack devlopment using django main ppt