Download as pdf or txt
Download as pdf or txt
You are on page 1of 23

UNIVERSITY DEPARTMENT RAJASTHAN TECHNICAL

UNIVERSITY, KOTA

DEPARTMENT OF COMPUTER SCIENCE


ENGINEERING

Summer Internship Report

TOPIC: login signup page

SUBMITTED TO: SUBMITTED BY:


Dr. C.P Gupta Name: Alka meena
Professor Roll No: 19EUCCS300
Department of Computer Science Branch: Computer Science
Engg.

Semester/Year: 7 SEM Final Yr.


th

1
DECLARATION

I hereby declare that the report based on the summer training/course was carried out
and written by me with my correct and complete knowledge. This work has not
previously formed the basis for the award of any degree or diploma or certificate
nor has been submitted elsewhere for the award of any degree or diploma.

Date: Alka meena


19EUCCS300

2
CERTIFICATE

ACKNOWLEDGEMENT

It is my proud privilege and duty to acknowledge the kind of help and guidance
received from several people in preparation of this report. It would not have been
possible to prepare this report without their valuable help, cooperation and guidance.

First and foremost, we wish to record our sincere gratitude to Dr. C.P Gupta for
his
constant support and mentoring in preparation of the report. I would also like to
thank
“ Bit to Byte Robotics Company” to give this
golden opportunity to learn and implement my skills in the project. Without their
support, one cannot achieve this success.

I also wanted to thank our parents for financing our studies in this college as well
as for constantly encouraging us to learn Engineering. Their personal sacrifice in providing
this opportunity to learn Engineering is gratefully acknowledged.

3
PREFACE

This internship report reflects the two months summer internship from 10 th May,2022-
15th July, 2022.
The report has details of the practical experience and the academic knowledge that
I have gained from these two months as a student.
I have tried my best to elucidate all the relevant details to be included in this report.
During the tenure of 2 months of internship, I worked on different technologies like
HTML, CSS, JavaScript ,php mySQL. Also, we build a simple Blog website and
Todo List using these technologies.

4
Table of Contents

S.no CONTENTS Pg.no


1. Introduction 1
a. Modules 2
2. Analysis 3
a. Requirement analysis 4
b. Interviews 4
c. Interviewees
d. How the interviews were conducted 5
e. Interview findings 6
3. System requirements specifications
a. System configuration 7
b. Software requirements 7
c. Hardware requirements 7
4. Technology
a. PHP 8
b. HTML 9
5. Project 10
6. Conclusion 12

CHAPTER 1:INTRODUCTION

1.1 Objectives

Training is generally thought of to be reserved for college students looking


to gain experience in a particular field. However, a wide array of people can
benefit from Training Internships in order to receive real world experience
and develop their skills

5
1. Training is used to get educated about the official habitat.
2. Training also provides opportunities for technical skill.

1.2 Goals

1. Goal of training is to develop and improve technical skills.


2. Goal of training is to understand how these things work in the real world.
3. Goal is to improve the professional ethics and values.
4. Goal is to learn and work on new technologies .
5. Goal is to improve problem solving skills.
6. Goal is to improve communication skills.
7. Goal is to work with high professional people.
CHAPTER2:InternshipEnterprise

2.1 About Company

Bit to Byte Robotics located in KOTA(RAJASTHAN) is a


professionally managed company engaged in the supply of Process testing &
Measuring Instruments, Lab Scientific Instruments, Analytical Instruments(Online &
Lab), Audio-Visual Systems, Online UPS systems, SMF Batteries, Security
Surveillance
Systems. They are also into Industrial/Process Automation by incorporating customised
SCADA & PLC application, take projects as a part or on turnkey basis,provide
technical service based on projects related to web development and Application
Development. For the last Seven years, They have been dedicated to provide state-
of-the-art products and services with top-ranking quality to a number of satisfied
clients in Rajasthan, UP, MP states and increasing boundaries each day. The four
basic pillars on which our goodwill rests are “Excellence, Quality, Reliability,
Commitment.

6
Figure :1

They have a talented and experienced team of engineers and technicians for designing,
development, installation and commissioning of laboratory and automation projects
and caring for after sales service
CHAPTER 3:Technologies

_________________________________________________________________

Technology is the application of knowledge to reach practical goals in a


specifiable and reproducible way. The word technology may also mean the
product of such an endeavour. The use of technology is widely prevalent in
medicine, science, industry, communication, transportation, and daily life.

First we will go through the important part of the back-end,that is HTML,php,CSS,JS.

HTML: HTML stands for Hyper Text Markup Language. It is used to design the
frontend portion of web pages using markup language. It acts as a skeleton for a
website since it is used to make the structure of a website.

CSS: Cascading Style Sheets fondly referred to as CSS is a simply designed language
intended to simplify the process of making web pages presentable. It is used to style
our website.

7
JavaScript : JavaScript is a scripting language used to provide a dynamic behaviour
to our website.

3.1 HTML

1. HTML stands for Hyper Text Markup Language.


2. HTML is the standard markup language for creating Web pages.
3. HTML describes the structure of a Web page.
4. HTML consists of a series of elements.
5. HTML elements tell the browser how to display the content.
6. HTML elements label pieces of content such as "this is a heading", "this is
a paragraph", "this is a link", etc.

3.1.2 A Simple HTML Document

Figure 2- HTML Document

Explanation of Above Used Code:-

1. The <!DOCTYPE html> declaration defines that this document is an HTML5


document
2. The < html> element is the root element of an HTML page
3. The < head> element contains meta information about the HTML page
4. 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)

8
5. 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.
6. The < h1> element defines a large heading
7. The <p> element defines a paragraph

3.1.3 About HTML Element

An HTML element is defined by a start tag, some content, and an end tag:

< tagname > Content goes here... < /tagname >

The HTML element is everything from the start tag to the end tag:
< h1 > My First Heading < /h1 >< p > My first paragraph. < /p >

Figure 3-HTML Element

3.1.4 Web Browsers

The purpose of a web browser ( Chrome, Edge, Firefox, Safari) is to read HTML
documents and display them correctly.

A browser does not display the HTML tags, but uses them to determine how to
display the document:

9
Figure 4-Web Browser

Below is a list of some of the semantic elements in HTML.

Figure 5-Semantic Elements


3.2 CSS

CSS is the language we use to style a Web page.

Why Use CSS?

CSS is used to define styles for your web pages, including the design, layout and
variations in display for different devices and screen sizes.

Figure 6- CSS example

10
3.2.1 There are three types of CSS which are given below:

1. Inline CSS
2. Internal or Embedded CSS
3. External CSS

Basic Format :

<! DOCTYPE html>


< html>

< head>

<!-- Head section of web page -->

< title></title>

<!-- Stylesheet of web page -->

< style></style>

< /head>

< body>

<!-- Body section of web page →

< /body>

< /html>

11
3.2.2 CSS Syntax

A CSS rule set contains a selector and a declaration block.

Figure 7-CSS Syntax


Some Basic CSS properties -
1. CSS Colors
2. CSS Backgrounds
3. CSS Borders
4. CSS Margins
5. CSS Padding
6. CSS Height/Width
7. CSS Box Model
8. CSS Outline
9. CSS Text
10. CSS Fonts
11. CSS Icons
12. CSS Links
13. CSS Lists
14. CSS Tables

3.3 JavaScript

JavaScript is a scripting or programming language that allows you to implement complex


features on web pages.

1. Every time a web page does more than just sit there and display static
information for you to look at .

12
2. displaying timely content updates, interactive maps, animated 2D/3D
graphics, scrolling video jukeboxes, etc.
3. you can bet that JavaScript is probably involved. It is the third layer
of the layer cake of standard web technologies, two of which (HTML
and CSS) we have covered in much more detail in other parts of the Learning
Area.

Figure 8-HTML CSS Java Script example via cake

3.3.1 JavaScript can be added to your HTML file in two ways:

Internal JS : We can add JavaScript directly to our HTML file by writing the code
inside the <script> tag. The <script> tag can either be placed inside the <head> or
the <body> tag according to the requirement.

External JS : We can write JavaScript code in other file having an extension .js

and then link this file inside the <head> tag of the HTML file in which we want to add this

code. Syntax -

< script>

// JavaScript Code

</script>

13
3.3.2 if-else Statement in JavaScript -

The conditional statement will perform some action for the specific condition. If the
condition meets then the particular block of action will be executed otherwise it will
execute another block of action that satisfies that particular condition.

JavaScript’s conditional statements:

1. if
2. if-else
3. nested-if
4. if-else-if ladder

Syntax:

1. if (condition)
2. statement;
3. else if (condition)
4. statement;
5. else statement;

3.4 Introduction to Node Js


As an asynchronous event-driven JavaScript runtime, Node.js is designed to
build scalable network applications. In the following "hello world" example,
many connections can be handled concurrently. Upon each connection, the
callback is fired, but if there is no work to be done, Node.js will sleep.

1. Node.js is an open source server environment.


2. Node.js is free.
3. Node.js runs on various platforms (Windows, Linux, Unix, Mac, OS, etc.).
4. Node.js uses JavaScript on the server.

14
3.4.1 The Built-in HTTP Module

Node.js has a built-in module called HTTP, which allows Node.js to transfer data
over the HyperText Transfer Protocol (HTTP).

To include the HTTP module, use the require() method:


Node.js as a

Figure 9- require ‘http’

Figure 10- Build HTTP Module

3.4.2 Web Server

The HTTP module can create an HTTP server that listens to server ports and gives
a response back to the client.

Use the createServer() method to create an HTTP server:

15
Figure11- Web Server

Add an HTTP Header

If the response from the HTTP server is supposed to be displayed as HTML, you
should include an HTTP header with the correct content type:

Figure 12- HTTP Header

The first argument of the res.writeHead() method is the status code, 200 means that
all is OK, the second argument is an object containing the response headers.

3.5 Express.js

E xpress.js tutorial provides basic and advanced concepts of Express.js. Our Express.js
tutorial is designed for beginners and professionals both.

Express.js is a web framework for Node.js. It is fast, robust and asynchronous in nature.
Our Express.js tutorial includes all topics of Express.js such as Express.js installation
on windows and linux, request object, response object, get method, post method,
cookie management, scaffolding, file upload, template etc.

16
Why Express.js?

1. Express was created to make APIs and web applications with ease.
2. It saves a lot of coding time almost by half and still makes web and
Mobile applications efficient.
3. Another reason for using express is that it is written in javascript as
javascript is an easy language even if you don't have a previous
4. knowledge of any language. Express lets so many new developers
enter the field of web development.

The reason behind creating an express framework for node js is:

1. Time-efficient
2. Fast
3. Economical
4. Easy to learn
5. Asynchronous

How does Express look like

3.5.1 Let's see a basic Express.js app.


File:basic_express.js

Figure 13- basic express.js

17
Figure 14- Terminal of basic express.js

Figure 15- Output of basic express.js

18
CHAPTER 4:Project

4.1 ABOUT:

Project Title : Blog Website


Login – Signup Page –
Link to the Website - https://github.com/alka639/LOGIN_SIGHNUP

Project Description : In this project I use HTML, CSS, JavaScript as frontend and
Node.js and Express.js as backend. This project is used to create daily blogs or journals .
In this we create a server on our local machine at port 3000 .So on http://localhost:3000/
this page we get this page.

Figure 16- Home page

19
In this page our server displays all the blogs or journals here all the blogs are shown like
this and when we click on Read More then we go on a separate dedicated page for that
blog or journal like this page.

Figure 17-Expansion of particular blog

For composing a blog or journals we have another page like.

Figure 18- Composing page

20
When we click on the Submit button then our page redirects to the home page and there we
can see our recently made blog.

CHAPTER 5:Conclusion

1. This training helps me to understand the deep knowledge of technologies and how
backend works.

2. For implementing the big project massive amounts of domain knowledge is required.
3. This helps me a lot in understanding time management and self motivation and also
helps me how to approach the different problems in different environments.
4. I also learned how to communicate in the tech field.

21
Future Scope
_____________________________________________________________
_

22
References

1. www.youtube.com
2. www.geekforgeeks.com
3. www.w3school.com

23

You might also like