TRAINING REPORT

On

Never Ending Voyage

Submitted in partial fulfilment of the

Requirements for the award of
Degree of Bachelor of Technology in Computer Science & Engineering

Submitted By

Name: Abhishek Kumar & Ojas Bhimta

University ID: 18BCS1553 & 18BCS1569
Training Group: CSG-10

SUBMITTED TO:

Department of Computer Science & Engineering

CHANDIGARH UNIVERSITY
Gharuan, Mohali
0
Introduction to Project:

1. Name of Website: Hotel Website

2. Number of pages in Website: 3 pages
• 2 main pages: Home, About and Contact page
3. Elements of Home Page:
I. Navigation Bar
 HCDG
 Home
 About
 Contact

II. Header
 Welcome message
 Link to about page
 Background image
III. Section
 Picture of hotel
 History of hotel (linked to about page)
 Features and facilites (icons has been used to make it more attractive)
 Great location
 Delicious meals
 Fitness

IV. Footer

 Message is displayed with the help of html entities(©)

4. Elements of About Page:

I. Navigation Bar
 HCDG
 Home
 About
 Contact
II. Header
 About Hotel CDG
 Hotel image (round image-using border radius)

1
 III. Section
 Guest reviews
 Background image
 Use of opacity

IV. Footer

 Message is displayed with the help of html entities(©)

5. Elements of Contact Page:

I. Navigation Bar
 HCDG
 Home
 About
 Contact

II. Section;

 Form:

 Name
 Phone no
 Email
 Message
 Submit
 Reach Us Info:
 Hotel address
 Contact information
 Email address

III. Footer:

 Message is displayed with the help of html entities(©)

6. Database Connection To:

 Contact form.

7. Elements of Database:
I. Name
II. Phone no.(primary key)

2
 III. E-mail

IV. Message

8. Purpose of Project:
a. To show the use of front end and back end web development as a single website
project.
b. To show the linking of different website pages as a part of single website.
c. To make an interactive webpages with the help of HTML and CSS.
d. To make a hotel website describing the features of the hotel as well as its history.
Also it displays the reviews given by the customers
e. To test and implement the different functions, operations and uses of database and
web development elements.

9. Purpose of HTML:
To provide basic code concept and basic elements of a website. It gives the structure of the
website.

10. Purpose of CSS:

a. To give different styles to text, boxes, images and other content.
b. To provide sufficient margins and paddings to the boxes so as it make it look neat and
well structured.
c. To insert background images and apply required changes.

11. Purpose of database:

To store the credential information of contact page.

12. Purpose of PHP:

To link the database to the required HTML file.

This project presents a hotel website along with its images also it shows the history of the hotel and
displays the specials features that will be provided. The About page is linked through the navigation
bar as well as through the section of history of hotel. The About gives the details ogf the hotel also it
shows the valuable reviews given by guests. At the end there is a contact us page that contains a form
and at the bottom it contains location, email and phone no of the hotel

3
Tools & Technology Used:

1. HTML:

Hypertext Markup Language (HTML) is the standard markup language for creating web
pages and web applications. 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.
Used to:
• Building base code.
• Adding text and button elements.
• Structuring the content according to display.
• Linking all the pages.

2. CSS:

CSS stands for Cascading Style Sheets. CSS describes how HTML elements are to be
displayed on screen, paper, or in other media. CSS saves a lot of work. It can control the
layout of multiple web pages all at once. CSS is designed to enable the separation of
presentation and content, including layout, colors, and fonts.
Used to:
• Text-style/align
• Text sizing
• Box-sizing/Box-shadow
• Form aligning and decoration
• Positioning of elements
• Indexing

4
 • Background image sliding animation
• Hover effect
• Active element effect
• Color and opacity control
• Overflow control
• Margin and padding control

3. MySQL:
MySQL is an open-sourcerelational database management system (RDBMS).Its name is a
combination of "My", the name of co-founder Michael Widenius's daughter, and "SQL", the
abbreviation for Structured Query Language.
Used to:
• Create database
• Storing information In database
• Creating primary key of the database

4. PHP:
PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source
general-purpose scripting language that is especially suited for web development and can be
embedded into HTML.
Used to:
• Link html to Database
• Creating response for successful and unsuccessful login.
• Fetching information from database.

5. Xampp:
Xampp is a free and open-sourcecross-platformweb serversolution stack package for scripts
written in the PHP and Perlprogramming languages. Since most actual web server
deployments use the same components as XAMPP, it makes transitioning from a local test
server to a live server possible.
Used as:
• Developer server
• Testing
• Deployment

5
6
Snapshots:

Navigation bar:

7
8
About Page:

9
Contact Page:

10
Results and Discussions:

• Objective: To make a functioning website.

• Result: Demo website for Hotel

Elements Display Status

Home Page Complete Working

About Page Complete Working

Contact Page Complete Working

Hover effect Complete working

Active links Complete working

11
Conclusion and Future Scope:

Conclusion:
• Completion of a responsive demo website
• Learned basic properties of HTML and CSS.
• Learned basic properties of PHP and MySQL
• Learned the use and maintenance of developer server through XAMPP
• Applied and practiced different Styles and formats using CSS.
• Linked multiple web pages to single home page
• Linked html and database using php

References:

1. https://en.wikipedia.org/wiki/Cascading_Style_Sheets

2. https://en.wikipedia.org/wiki/HTML

3. https://en.wikipedia.org/wiki/MySQL

4. https://www.php.net/manual/en/intro-whatis.php

5. https://en.wikipedia.org/wiki/XAMPP

6. https://www.youtube.com/watch?v=ooc6f1w6Mzg&t=97s

7. https://www.youtube.com/watch?v=TzAshjkhFQw&t=134s

8. https://www.w3schools.com/css/

9. https://www.w3schools.com/html/

10.https://www.w3schools.com/php/

12
13