Final in Ten Ship
Final in Ten Ship
Final in Ten Ship
BACHELOR OF TECHNOLOGY
In
22ME1A5446
Under Supervision of
Mr.P.V.Kishore Kumar
Assistant Professor
DEPARTMENT OF
NH-16, Bypass Road, Vatluru (V), Eluru – 534007, Eluru Dt., A.P.
CERTIFICATE
This is to certify that the “Internship Report” submitted by PALETI RAM PRASAD
(Regd. No.: 22ME1A5446) is work done by him/her and submitted during 2023 – 2024
academic year in partial fulfillment of the requirements for the award of the degree of
BACHELOR OF TECHNOLOGY in CSE (ARTIFICIAL INTELLIGENCE AND DATA
SCIENCE),at Techno Hacks, Recognized by ISO (INTERNATIONAL
ORGANIZATION FOR STANDARDIZATION).
External Examiner
Declaration
we hereby declare that the internship on “Web Devlopment” submitted us to Jawaharlal Nehru
Technological University Kakinada in partial fulfilment of the requirements of II B.Tech II
semester of bachelor of technology in CSE (AI&DS).this internship work carried by us under
the supervision of Dr. Shameena Begum , Professor in CSE(CS).
I have extended our sincere thanks to Dr.SHAMEENA BEGUM, Professor and Head of the
Department CSE-CYBER SECURITY for helping me in the successful completion of my
internship.
I would like to express my deepest gratitude to Dr. V. Srinivasa Rao, Principal, Ramachandra
College of Engineering, Eluru for his valuable suggestions during the preparation of draft in our
document.
I sincerely thank all the faculty members and staff of the Department of CYBER SECURITY
for their valuable advices, suggestions and constant encouragement which played a vital role in
carrying out my internship.
Finally, I thank one and all who directly or indirectly helped me to complete my internship
successfully.
4
ABSTRACT
5
Index
6
INTENSHIP CERTIFICATE
7
Chapter 1
Among web professionals, "web development" usually refers to the main non-design
aspects of building web sites: writing markup and coding. Web development may use
content management systems (CMS) to make content changes easier and available with basic
technical skills.
Web development can range from developing a simple single static page of plain
text to complex web-based internet applications (web apps), electronic businesses, and
social network services. A more comprehensive list of tasks to which web development
commonly refers, may include web engineering, web design, web content development,
client liaison, client-side/server-side scripting, web server and network security
configuration, and e- commerce development.
DEFINATION: Web development is the work involved in developing a web site for the
Internet (World Wide Web) or an intranet (a private network).
For larger organizations and businesses, web development teams can consist of
hundreds of people (web developers) and follow standard methods like Agile methodologies
while developing websites. Smaller organizations may only require a single permanent or
contracting developer, or secondary assignment to related job positions such as a graphic
designer or information systems technician. Web development may be a collaborative effort
between departments rather than the domain of a designated department.
8
1.1.1 The Goals of Web Development
One of the greatest advances in technological tools has been the use of the Internet, due
to its rapid reception, its transfer speeds and the effectiveness of resources, since access
to its different applications is almost immediate, information of any content can be
found
, in any class and of any kind, it is important to set clear goals and objectives, in the
creation of websites defining the service and use that will be given to the information,
having a clear vision of the type of audience that will host these pages and will be
potential users of them.
Currently the development and creation of websites is imposed on the world as a
technological tool to unite the regions, create businesses, support companies, be
displayed in the market and infinity of applications according to the perspectives of
people and their scope, finding on the internet, a vital source of job creation, efficient
and intelligent businesses and great help in achieving objectives and approaches.
Web development in recent decades has been transforming and driving the evolution of
the Internet, every day greater progress on this issue, directly involving the ingenuity of
the developer on the subject.
With the passing of time, new steps are being taken in search of a more stable, creative
and efficient web environment where user interaction with the network is simple and
practical for users.
It is self-evident that the goals of Web-D are important and desirable. However, we still
give some more supporting argument to this issue.
First of all, the web entrepreneur must know deeply about the design of virtual spaces,
having clear the minimum requirements for the creation of sites, where the priority is the
information and the use of it creating rapid and efficient exchange methods, to carry out
projects that comply with the required guidelines; One of the tasks is to create systems
that generate solutions to problems related to communication, currently based on the use
of the Internet.
9
In order for websites to be dynamic and efficient, very specific and relevant aspects must
be taken into account for the proper use of this technology, both the technical part and
the use of external resources, it is not the same to see a website in the city where data
transfer resources are high to visualize it in rural environments where resources are
limited or nonexistent, this is one of the great risks that are faced, which can lead to
losing interest in it because it is not accessible , so the planning is vital for the good
performance of the same in environments of different characteristics being just one of the
problems that can affect the creation of a website.
The implementation of new updates, allow developers to be proactive in the solution and
implementation of new designs more effective and competitive, leading by new
directions in search of a final product according to the needs of each new user, where the
marketing of These pages require web designers innovation in creation. You should have
ideas that awaken in the users an interest when exploring these proposals.
The stages of development of current websites and their programming languages are very
complex because of their extensive and varied code. Therefore, it is necessary to know
tools that are currently available to dynamically develop web pages.
For the initiation of website design it is very important to have knowledge bases in the
use of the programming language, both in HTML and other tools such as PHP, JAVA-
SCRIPT, Dreamweaver, among others. They are a very interesting tool that induces
joint work in the wonderful world of web page design, with the appropriation and
correct handling of the tools, you can get to operate innovative and creative designs
when marketing and offering the products made.
The network is a mechanism where information is stored and processed at great speeds,
mostly handled through web pages, where daily users perform a number of operations
according to their web management.
10
Chapter 2
HTML – All code in a web application is eventually translated to HTML. It’s the
language that web browsers understand and use to display information to users. A
web developer’s understanding of HTML is analogous to a carpenter’s understanding
of a screwdriver. It’s so important and necessary that it’s often assumed for
employment.
CSS – By itself, HTML is quite plain. HTML does provide some basic style options,
but to build a good frontend, developers must have experience with CSS. CSS provides
the paint, templates, glitter, buttons, tassel, lights, and many other things that can be
used to improve the presentation of a web page. CSS is so commonly used that
languages have been built to make writing CSS easier. These languages – like Sass and
LESS – are also known as CSS precompilers, but they are simply used to write more
efficient and manageable CSS code.
JavaScript – If you could only learn one language in your lifetime, you’d be well-
advised to choose JavaScript. Though it’s not exclusively a frontend language, that’s
where it’s most commonly used. JavaScript is a language that is run on a client
machine,
i.e. a user’s computer. This means that JavaScript can be used to program fast, intuitive
and fun user experiences, without forcing a user to refresh their web page. Drag-and-
drop, infinite-scroll and videos that come to life on a web page can all be programmed
with JavaScript. Frameworks like Angular, Ember, React and Backbone are all very
widely used for JavaScript-heavy frontends.
11
Here’s an example. Say you log into your Facebook account, and you are greeted with
the latest updates in your News Feed. They’re not going to be the same updates that you
saw yesterday.
How did the page change? Did a Facebook employee manually edit the page to update
your news feed? Of course not. A script on the Facebook back-end would have received
the updates and re-generated the front-end accordingly.
Back-end scripts are written in many different coding languages and frameworks, such as…
PHP
Ruby on Rails
ASP.NET
Perl
Java
Node.js
Python
Back-end Development is the term used for the behind-the-scenes activities that happen
when performing any action on a website. It can be logging in to your account or
purchasing a watch from an online store.
12
work will be done on the backend. Backend code is run on the server, as opposed to the
client. This means that backend developers not only need to understand programming
languages and databases, but they must have an understanding of server architecture as
well. If an application is slow, crashes often, or constantly throws errors at users, it’s
likely because of backend problems.
Backend development is not all ones and zeros though. Much like frontend development,
backend development has a human aspect to it as well. Since most of the code for an
application is written on the backend, it should be easy to understand and work with.
Most backend languages – like Ruby and Python – have standardized styles and idioms
that make reading and writing code more efficient and enjoyable.
13
Chapter-3
INTRODUCTION TO HTML
Basics of HTML
Syntax:
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>Heading</h1>
<p>Paragraph</p>
</body>
</html>
Syntax Explained:
14
Paragraphs Tag: The <p> tag defines a paragraph. Browsers automatically add some
space (margin) before and after each <p> element. The margins can be modified with
CSS (with the margin properties).
Line Breaks: The <br> tag inserts a single line break. The <br> tag is an empty tag
which means that it has no end tag.
Headings: Headings are defined with the <h1> to <h6> tags.<h1> defines the most
important heading. <h6> defines the least important heading.
Strong and Emphasized text: The <em> tag is a phrase tag. It renders as emphasized
text. The <strong> tag defines important text.
Html Formatting Tag: HTML uses tags like <b> and <i> for formatting output,
like bold and italic text respectively.
HTML Lists
Unordered HTML Lists: An unordered list starts with the <ul> tag. Each list item starts
with the <li> tag. The list items will be marked with bullets (small black circles).
Ordered HTML Lists: An ordered list starts with the <ol> tag. Each list item starts with
the <li> tag. The list items will be marked with numbers.
HTML Images: In HTML, images are defined with the <img> tag. The <img> tag is
empty, it contains attributes only, and does not have a closing tag. The src attribute
defines the url (web address) of the image
15
HTML Links: HTML links are hyperlinks. A hyperlink is an element, a text, or an
image that you can click on, and jump to another document.
HTML Tables: Tables are defined with the <table> tag. Tables are divided into table
rows with the <tr> tag. Table rows are divided into table data with the <td> tag. A table
row can also be divided into table headings with the <th> tag.
HTML Forms
HTML forms are used to pass data to a server. An HTML form can contain input
elements like text fields, checkboxes, radio-buttons, submit buttons and more. A form
can also contain select lists, textarea, fieldset, legend, and label elements. The <form> tag
is used to create an HTML form:
<form>
input elements
</form>
The Input Element: The most important form element is the <input> element. The
<input> element is used to select user information. An <input> element can vary in many
ways, depending on the type attribute. An <input> element can be of type text field,
checkbox, password, radio button, submit button, and more. The most common input
types are described below:
<input type="text"> defines a one-line input field that a user can enter text into:
Example:
<form>
First name: <input type="text" name="firstname"><br/>
Last name: <input type="text" name="lastname">
</form>
16
Output:
Example:
<form>
Password: <input type="password" name="pwd">
</form>
Output:
Radio Buttons: <input type="radio"> defines a radio button. Radio buttons let a user
select ONLY ONE of a limited number of choices:
Example:
<form>
<input type="radio" name="sex" value="male">Male<br/>
<input type="radio" name="sex" value="female">Female
</form>
Output:
17
Checkboxes Buttons: <input type="checkbox"> defines a checkbox. Checkboxes let a
user select ZERO or MORE options of a limited number of choices.
Example:
<form>
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br/>
<input type="checkbox" name="vehicle" value="Car">I have a car
</form>
Output:
HTML Headings
HTML headings are defined with the <h1> to <h6> tags.
<h1> defines the most important heading. <h6> defines the least important heading:
Example:
18
Output:
HTML Links
HTML links are defined with the <a> tag:
Example:
Output:
19
Chapter-4
Cascading Style Sheets (CSS)
HTML was NEVER intended to contain tags for formatting a web page!
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
When tags like <font>, and color attributes were added to the HTML 3.2 specification, it
started a nightmare for web developers. Development of large websites, where fonts and
color information were added to every single page, became a long and expensive
process.
To solve this problem, the World Wide Web Consortium (W3C) created
CSS. CSS removed the style formatting from the HTML page!
1. Inline CSS.
2. Internal CSS.
20
3. External CSS.
Inline CSS
I have not mentioned them until now because in a way they defeat the purpose of using
CSS in the first place. Inline styles are defined right in the (X)HTML file alongside the
element you want to style.
See example below.
<html>
<head>
</head>
<body>
<p style=”color:blue”>hello</p>
<h1 style=”font-family:arial”>Baby</h1>
</body>
</html>
Internal Css
First we will explore the internal method. This way you are simply placing the CSS code
within the <head></head> tags of each (X)HTML file you
want to style with the CSS.
The format for this is shown in the example below.
<html>
<head>
<style>
h1{
Color:blue;
Font-family:Times new Roman;}
</style>
</head>
<body>
<h1>HTML stands for Hyper Text markup language</h1>
</body>
</html>
External CSS
An external CSS file can be created with any text or HTML editor such as "Notepad" or
"Dreamweaver". A CSS file contains no (X) HTML, only CSS. You simply save it with
21
the .css file extension. You can link to the file externally by placing one of the following
links in the head section of every (X)HTML file you want to style with the CSS file.
By using an external style sheet, all of your (X)HTML files link to one CSS file in order
to style the pages. This means, that if you need to alter the design of all your pages, you
only need to edit one .css file to make global changes to your entire website. Here are a
few reasons this is better.
(1) Easier Maintenance
(2) Reduced File Size
(3) Reduced Bandwidth
(4) Improved Flexibility
CSS Syntax
A CSS rule-set consists of a selector and a declaration block:
Each declaration includes a CSS property name and a value, separated by a colon.
A CSS declaration always ends with a semicolon, and declaration blocks are surrounded
by curly braces.
Example
In this example all <p> elements will be center-aligned, with a red text color:
22
p{
color: red;
text-align: center;
}
Output:
CSS Selectors
CSS selectors are used to "find" (or select) the HTML elements you want to style.
Note: The universal selector (*) selects all HTML elements on the page.
Example The CSS rule below will affect every HTML element on the page:
*{
text-align: center;
color: blue;
}
23
Chapter-
5
JAVASCRIPT
Why JavaScript ?
Web pages are not the only place where JavaScript is used. Many desktop and server
programs use JavaScript. Node.js is the best known. Some databases, like MongoDB and
CouchDB, also use JavaScript as their programming language.
Uses of JavaScript
• Use it to add multimedia elements
With JavaScript you can show, hide, change, resize images, and create image rollovers.
You can create scrolling text across the status bar.
• Create pages dynamically
Based on the user's choices, the date, or other external data, JavaScript can produce pages
that are customized to the user.
• Interact with the user
It can do some processing of forms and can validate user input when the user submits the
form.
24
Writing JavaScript
JavaScript code is typically embedded in the HTML, to be interpreted and run by the
client's browser. Here are some tips to remember when writing JavaScript commands.
• JavaScript code is case sensitive
• White space between words and tabs are ignored
• Line breaks are ignored except within a statement
• JavaScript statements end with a semi colon (;)
document.getElementById("demo").innerHTML = "Hello
JavaScript";
document.getElementById("demo").style.fontSize = "35px";
document.getElementById("demo").style.display = "none";
<script>
document.getElementById("demo").innerHTML = "My First JavaScript";
</script>
25
JavaScript in <head> or <body>
You can place any number of scripts in an HTML document.
Scripts can be placed in the <body>, or in the <head> section of an HTML page, or in
both.
JavaScript in <head>
In this example, a JavaScript function is placed in the <head> section of an HTML page.
<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{ document.getElementById("demo").innerHTML = "Paragraph
After.";
}
</script>
</head>
<body>
<h1>A Web Page</h1>
<p id="demo">Paragraph Before</p>
<button type="button" onclick="myFunction()">Try it</button>
</body>
</html>
Output:
External JavaScript
External scripts are practical when the same code is used in many different web pages.
JavaScript files have the file extension .js. To use an external script, put the name of the
script file in the src (source) attribute of a <script> tag:
Example
<script src="myScript.js"></script>
You can place an external script reference in <head> or <body> as you like. The script will
behave as if it was located exactly where the <script> tag is located. External scripts cannot
contain <script> tags.
To add several script files to one page - use several script tags:
Example
<script src="myScript1.js"></script>
<script src="myScript2.js"></script>
External References
External scripts can be referenced with a full URL or with a path relative to the current
web page. This example uses a full URL to link to a script:
Example
<script src="https://www.w3schools.com/js/myScript1.js"></script>
27
Chapter-6
PHP (HyperText Pre-Processor)
What is PHP?
PHP is an amazing and popular language. It is powerful enough to be at the core of the
biggest blogging system on the web (WordPress). It is deep enough to run the largest
social network (Facebook). It is also easy enough to be a beginner's first server side
language.
PHP files can contain text, HTML, CSS, JavaScript, and PHP code
PHP code are executed on the server, and the result is returned to the browser as
plain HTML
PHP files have extension ".php"
28
With PHP you are not limited to output HTML. You can output images, PDF files, and
even flash movies. You can also output any text, such as XHTML and XML.
Why PHP?
PHP 7 is much faster than the previous popular stable release (PHP 5.6)
PHP 7 has improved Error Handling
PHP 7 supports stricter Type Declarations for function arguments
PHP 7 supports new operators (like the spaceship operator: <=> )
Instead of lots of commands to output HTML (as seen in C or Perl), PHP pages contain
HTML with embedded code that does "something" (in this case, output "Hi, I'm a PHP
script!"). The PHP code is enclosed in special start and end processing instructions <?php
and ?> that allow you to jump into and out of "PHP mode." What distinguishes PHP from
something like client-side JavaScript is that the code is executed on the server, generating
HTML which is then sent to the client. The client would receive the results of running
that script, but would not know what the underlying code was. You can even configure
your web server to process all your HTML files with PHP, and then there's really no way
that users can tell what you have up your sleeve.
The best things in using PHP are that it is extremely simple for a newcomer, but offers
many advanced features for a professional programmer. Don't be afraid reading the long
list of PHP's features. You can jump in, in a short time, and start writing simple scripts
in a few hours. Although PHP's development is focused on server-side scripting, you
can do much more with it.
29
A PHP script is executed on the server, and the plain HTML result is sent back to the
browser.
A PHP script can be placed anywhere in the document. A PHP script starts with <?php
and ends with ?>:
<?php
// PHP code goes here
?>
The default file extension for PHP files is ".php". A PHP file normally contains HTML
tags, and some PHP scripting code. Below, we have an example of a simple PHP file,
with a PHP script that uses a built-in PHP function "echo" to output the text "Hello
World!" on a web page:
Example
<!DOCTYPE html>
<html>
<body>
<?php
echo "Hello World!";
?>
</body>
</html>
Note: PHP statements end with a semicolon (;).
30
PHP Case Sensitivity
In PHP, NO keywords (e.g. if, else, while, echo, etc.), classes, functions, and user-defined
functions are case-sensitive. In the example below, all three echo statements below are
equal and legal:
Example
<!DOCTYPE html>
<html>
<body>
<?php
ECHO "Hello World!<br>";
echo "Hello World!<br>";
EcHo "Hello World!<br>";
?>
</body>
</html>
Look at the example below; only the first statement will display the value of the $color
variable! This is because $color, $COLOR, and $coLOR are treated as three different
variables:
Example
<!DOCTYPE html>
<html>
<body>
<?php
$color = "red";
echo "My car is " . $color . "<br>";
echo "My house is " . $COLOR . "<br>";
echo "My boat is " . $coLOR . "<br>";
?>
</body>
</html>
31
Chapter-7
Project Discussion and Snapshots
Today Online Examination System has become a fast growing examination method
because of its speed and accuracy. It is also needed less manpower to execute the
examination. Almost all organizations now-a-days, are conducting their objective exams
by online examination system, it saves students time in examinations. Organizations can
also easily check the performance of the student that they give in an examination. As a
result of this, organizations are releasing results in less time. It also helps the environment
by saving paper.
According to today’s requirement, online examination project in php is very useful to
learn it.
Administrator of Online Examination has multiple features such as Add, Delete, Update
Topics and Question.
To Login as Admin put inside your browser "www.applicationname/admin"
32
The user will automatically get the updated version by logging using the user
ID and Password provided at the time of registration.
No need of reprinting, appearance, vigilance and the job is done.
Project objective:
Online examination system is a non removable examination pattern of today’s life. We
need more time saving and more accurate examination system as the number of
applicants is increasing day by day. For all IT students and professionals, it is very
important to have some basic understanding about the online examination system.
TECHNOLOGIES USED
1. Tools to Be Used
Database design:- MySQL
Website design:- Bootstrap with Custom Designing using CSS3, Wordpress
Coding(logic):- PHP and JavaScript
Server:- XAMPP
Platform:- Windows
Application:-Notepad++
33
2. Requirements and setting up system for PHP development
What we need to know:
Designing part of the website is done with the help of Bootstrap 4.0 and CSS3
and for the database designing we use My SQL
What we need to have (System Requirements):
To run Website we need a browser and to code we need application like Notepad+
+,atom, etc.
SOFTWARE REQUIREMENTS
1. Software Requirements
Initially we need to have a development machine that is running any of the following
operating systems:
Windows XP, Vista, Windows 7, 8
Development environment (Notepad++).
XAMPP server.
34
SNAPSHOTS
1) Home Page
2) Registration Page
35
3) LogIn page for an Adminstrator
4) Dashboard for creating the test with Test_name and Description about the test
36
5) Creating Multiple Choice Questions
37
7) Result Page after giving the online test
38
WEEKLY REPORT
WEEK: 1
List one thing that went particularly well this week (area of improvement, new task, etc.)
=>HTML overview and basics of Front-End Web Development
List one thing that was the most challenging this week (issue, problem, difficulty, etc.)
=>It’s all related to basics
39
WEEK: 2
List one thing that went particularly well this week (area of improvement, new task, etc.)
=>Floating is quite interesting
List one thing that was the most challenging this week (issue, problem, difficulty, etc.)
=>There was some issue in understanding up the float property
40
WEEK: 3
List one thing that went particularly well this week (area of improvement, new task, etc.)
=>JavaScript Functions was pretty interesting topic
List one thing that was the most challenging this week (issue, problem, difficulty, etc.)
=>There were some difficulties in Control Flow in JavaScript
41
WEEK: 4
List one thing that went particularly well this week (area of improvement, new task, etc.)
=>Animation was a pretty new concept
List one thing that was the most challenging this week (issue, problem, difficulty, etc.)
=> There were some difficulties in Draggables & Resizables
42
WEEK: 5
List one thing that went particularly well this week (area of improvement, new task, etc.)
=> phpMySQL was easy
List one thing that was the most challenging this week (issue, problem, difficulty, etc.)
43
WEEK: 6
List one thing that went particularly well this week (area of improvement, new task, etc.)
=>SQL was easy
List one thing that was the most challenging this week (issue, problem, difficulty, etc.)
=> There were some difficulties with Session Variables and Cookies
44
CONCLUSION AND FUTURE SCOPE
From this summer training and the project, we are able to experience a technology which is Web
Development. We are confident enough to tack the real-life problems or task based on the
supervised and unsupervised learning. A website is the representation of the business online.
These days, every business realizes the need for having a website and are putting in efforts to
design and develop the best site for taking their products or services online. This is where we can
With the tremendous progress in the launch of websites, people who can create exemplary
designs and platforms for their online presence is what businesses are searching for. Web
developers and designers are bringing in all the best of their technical expertise and skills to
develop and unique design websites that are and capable of pulling the crowd.
Most web developers and designers are familiar with the latest tools, techniques, technologies,
and frameworks that will help them get beautiful sites up in a short span of time. The
development time of websites has come down with the agile technologies that make
development easier. Here, we will cover the scope and future of web developmen
45
46
View publication
stats