Full Stack Web Dev Project Report

PROJECT REPORT
ON
full stack web development
USING PYTHON
SUBMITTED IN
PARTIAL FULFILLMENT FOR THE AWARD OF
BATCHLER OF TECHNOLOGY IN COMPUTER SCIENCE
BY GOLU KUMAR Roll:01520902718
Sunderam Bhartiya Roll: 04220902718
TO
GB PANT GOVT. ENGG. COLLEGE ,GOVING PURI
NEW DELHI
Project Report Full Stack Web Devlopment Submitted to Prof. Kundan Kumar Chandan Dept. of
Computer Science and Engineering G.B Pant Govt Engineering College Django Framework which is an
excellent open source web application frame work for complex datadriven website development. The
major part of this report will introduce how to use Django to create a database table, web page user
interface and inner logic to handle user request by going through the group component implementation
process.
Project Title :Anime Streaming Website

Full Stack Web Developer
A full stack web developer is a person who can develop
both client and server software.
In addition to mastering HTML and CSS, he/she also knows how to:
 Program a browser (like using JavaScript, jQuery, Angular, or Vue)

 Program a server (like using PHP, ASP, Python, or Node)
 Program a database (like using SQL, SQLite, or MongoDB)
1 Front-End Developer
Front-end web development, also known as client-side development is the practice of

producing HTML, CSS and JavaScript for a website or Web Application so that a user
can see and interact with them directly. The challenge associated with front end
development is that the tools and techniques used to create the front end of a website
change constantly and so the developer needs to constantly be aware of how the
field is developing.
The objective of designing a site is to ensure that when the users open up the site
they see the information in a format that is easy to read and relevant. This is further
complicated by the fact that users now use a large variety of devices with varying
screen sizes and resolutions thus forcing the designer to take into consideration
these aspects when designing the site. They need to ensure that their site comes up
correctly in different browsers (cross-browser), different operating systems (cross-
platform) and different devices (cross-device), which requires careful planning on the
side of the developer.
1.1 Hypertext Markup Language (HTML) is the standard markup language for documents
designed to be displayed in a web browser. It can be assisted by technologies such as Cascading
Style Sheets (CSS) and scripting languages such as JavaScript.
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.
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
1.2 CSS
Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a
document written in a markup language such as HTML.[1] CSS is a cornerstone technology of
the World Wide Web, alongside HTML and JavaScript.[2]
CSS is designed to enable the separation of presentation and content, including layout, colors,
and fonts.[3] This separation can improve content accessibility, provide more flexibility and control in
the specification of presentation characteristics, enable multiple web pages to share formatting by
specifying the relevant CSS in a separate .css file which reduces complexity and repetition in the
structural content as well as enabling the .css file to be cached to improve the page load speed
between the pages that share the file and its formatting.
body {
background-color: lightblue;
}
h1 {
color: white;
text-align: center;
}
p {
font-family: verdana;
font-size: 20px;
}
Try it Yourself »
1.3 javascript
Javascript is a MUST for students and working professionals to become a great

Software Engineer specially when they are working in Web Development Domain. I will
list down some of the key advantages of learning Javascript:
 Javascript is the most popular programming language in the world and that
makes it a programmer’s great choice. Once you learnt Javascript, it helps you
developing great front-end as well as back-end softwares using different
Javascript based frameworks like jQuery, Node.JS etc.
 Javascript is everywhere, it comes installed on every modern web browser and so
to learn Javascript you really do not need any special environment setup. For
example Chrome, Mozilla Firefox , Safari and every browser you know as of
today, supports Javascript.
 Javascript helps you create really beautiful and crazy fast websites. You can
develop your website with a console like look and feel and give your users the
best Graphical User Experience.
 JavaScript usage has now extended to mobile app development, desktop app
development, and game development. This opens many opportunities for you as
Javascript Programmer.
 Due to high demand, there is tons of job growth and high pay for those who know
JavaScript. You can navigate over to different job sites to see what having
JavaScript skills looks like in the job market.
 Great thing about Javascript is that you will find tons of frameworks and Libraries
already developed which can be used directly in your software development to
reduce your time to market.
Alert(“hello world”);
Prompt(”enter something”)
2. BACK END DEVELOPER
A back-end web developer is responsible for server-side web application logic and
integration of the work front-end web developers do. Back-end developers usually write
web services and APIs used by front-end developers and mobile application
developers.
Writing a good job description and a job ad for a back-end developer requires proper
separation of concerns. Posting a generic web developer description in your job ad,
when you are looking for an advanced back-end web developer, will bring numerous
applications from people who are specialized in building front-end user interface, or web
designers who have absolutely no knowledge about programming.
There are technologies and knowledge that are common to all web developers, and
some that are specific to back-end developers. This article will provide you with a
sample back-end web developer job description that will help you write a perfect job ad
and assure that you easily find and hire the person that matches your specific criteria.
2.1 Python
Python is an interpreted, high-level and general-purpose programming language. Python's design
philosophy emphasizes code readability with its notable use of significant whitespace. Its language
constructs and object-oriented approach aim to help programmers write clear, logical code for small
and large-scale projects.
Python is dynamically typed and garbage-collected. It supports multiple programming paradigms,
including structured (particularly, procedural), object-oriented and functional programming. Python is
often described as a "batteries included" language due to its comprehensive standard library.
print("Hello, World!")
2.2
Django is a high-level Python Web framework that encourages rapid

development and clean, pragmatic design. Built by experienced developers, it
takes care of much of the hassle of Web development, so you can focus on
writing your app without needing to reinvent the wheel. It’s free and open
source.
3 Basic learning’s
3.1 box model with the help of table creation
<table class="art">
<td id="one"></td>
<td id="two"></td>
<td id="three"></td>
<td id="four"></td>
<td id="five"></td>
<p></p>
</table>
3.2 form creation using boostrap
<form>
<div class="mb-3">
<label for="exampleInputEmail1" class="form-label">Email address</label>
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp">
<div id="emailHelp" class="form-text">We'll never share your email with anyone else.</div>
</div>
<div class="mb-3">
<label for="exampleInputPassword1" class="form-label">Password</label>
<input type="password" class="form-control" id="exampleInputPassword1">
</div>
<div class="mb-3 form-check">
<input type="checkbox" class="form-check-input" id="exampleCheck1">
<label class="form-check-label" for="exampleCheck1">Check me out</label>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
3.3
Prompt creation using java script
var name;
name=prompt("enter your name")
alert("welcome back " + name)
PROJECT OUTPUT
Bibliography
[1] Django homepage. http://www.djangoproject.com/.
[2] Python documentation. http://www.python.org/doc.
[3] Django(web framework). http://en.wikipedia.org/wiki/Django.
[4] Django documentation. http://docs.djangoproject.com.
[5] The perl programming language. http://www.perl.org/.
[6] Ruby programming language. http://www.ruby-lang.org/en/.
[7] Python(programming language). http://en.wikipedia.org/wiki/Python

Full Stack Web Dev Project Report

Uploaded by

Document Information

Original Description:

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Full Stack Web Dev Project Report

Uploaded by

Copyright:

Available Formats

PROJECT REPORT

Project Title :Anime Streaming Website

 Program a browser (like using JavaScript, jQuery, Angular, or Vue)

Front-end web development, also known as client-side development is the practice of

Javascript is a MUST for students and working professionals to become a great

2. BACK END DEVELOPER

Django is a high-level Python Web framework that encourages rapid

Prompt creation using java script

name=prompt("enter your name")

alert("welcome back " + name)

[1] Django homepage. http://www.djangoproject.com/.

[2] Python documentation. http://www.python.org/doc.

[3] Django(web framework). http://en.wikipedia.org/wiki/Django.

[4] Django documentation. http://docs.djangoproject.com.

[5] The perl programming language. http://www.perl.org/.

[6] Ruby programming language. http://www.ruby-lang.org/en/.

[7] Python(programming language). http://en.wikipedia.org/wiki/Python

You might also like