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 चित्रहार
Queries ! Certificate
Queries !
Thank You

Full stack devlopment using django main ppt

  • 1.
    About Coursera DEPARTMENT OF COMPUTERENGINEERING INDUSTRIAL TRAINING PRESENTATION “Full Stack Web Development” PRESENTED BY:- SUDHANSHU VIJAY REG NO. :- PIET18CS139 YEAR :- 4th Introduction
  • 2.
    About Coursera Full Stack Development Coursera Inc. isan 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.
  • 3.
    Full Stack Development Stages of Full Stack • Full stackdevelopment: 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.
  • 4.
  • 5.
    Backend Introduction to Django Back end: Itrefers 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.
  • 6.
    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.
  • 7.
  • 8.
    Django Model Django View Introduction To Django Models AdvantagesOf Django Models Steps To Create Django Models
  • 9.
    Django View Django Templates Creating Django Views ClassBased View V/S Function Based Views Django Views Component
  • 10.
    Django Templates Key Features What Are DjangoTemplates? Steps to Create Django Templates Django Template Language
  • 11.
    Key Features Frontend Some of the busiestsites 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
  • 12.
    Frontend What is HTML? Frontend: It isthe 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.
  • 13.
    What is HTML? Explanation of basic structure HTMLis the standardmarkuplanguage 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.
  • 14.
    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.
  • 15.
    Types of elements in html What is CSS? An HTML elementis 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>
  • 16.
    What is CSS? Types of style sheets • CSS standsfor 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.
  • 17.
    Types of style sheets Advantages of CSS There are threeways 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.
  • 18.
    Advantages of CSS What is JavaScript? • It savetime 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.
  • 19.
    What is JavaScript? JavaScript Example JavaScript is theworld'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.
  • 20.
    JavaScript Example How to write code Explanation of thecode: 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>
  • 21.
    How to write code About Projects Apply in headsection •<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
  • 22.
  • 23.
  • 24.
  • 25.