Sanuu

Industrial Training Hotel Website
1. Introduction
The purpose of this report is to document my industrial training experience at

Stormsofts Technology, with a particular focus on web development. This training provided
me with hands-on experience in building a fully functional web application, enhancing my
understanding of web development technologies and best practices.
1.1 Purpose of the Report
The primary objective of this report is to present a comprehensive account of my training

experience, including the knowledge and skills acquired during my time at Stormsofts
Technology. This report will specifically detail the development of a project I undertook: a
"Hotel Management Website."
1.2 Overview of the Project
During my training, I developed a web application designed to serve as an hotel facility. The
project aimed to provide users with an intuitive and user-friendly platform to Provide virtual
tour guide, showing you different room options, facilities and nearby attractions online.
 The key features of the project include:
• Homepage: An engaging homepage of our website shows image of our hotel.

• Product Pages: Detailed pages for each room, including descriptions, images and
prices functionality of our hotel.
• Search Functionality: A search bar allowing users to find rooms easily.
• User Account and Cart Management: Features enabling users to create accounts,
log in, and manage their shopping carts.
• Responsive Design: Ensuring the website is accessible and visually appealing on
various devices, from desktops to mobile phones.
Page-1
2. Company Profile
2.1 Background of the Company
Stormsofts Technology was founded in January 2017 by Mr. Ankush S. Pol. Since its
inception, the company has been dedicated to providing unique and innovative IT solutions.
Over the years, Stormsofts Technology has established itself as a reliable partner for its clients,
fostering long-term relationships and focusing on delivering cutting-edge technological
advancements.
2.2 Company Services
Stormsofts Technology offers a wide range of services, including:
1. Web Development: Building responsive and dynamic websites using the latest
technologies.
2. App Development: Creating mobile applications for Android and iOS platforms,
tailored to client needs.
3. Digital Marketing: Enhancing clients' digital presence through SEO, email
marketing, and SMS marketing strategies.
4. Software Development: Developing customized software solutions to meet specific
business requirements.
5. Training and Internship Programs: Providing practical IT training and internship
opportunities to students and professionals, bridging the gap between academic
knowledge and industry demands.
In addition to these core services, Stormsofts Technology is committed to social welfare

activities, such as conducting coding workshops and tech boot camps for underprivileged
youth. These initiatives aim to equip young people with valuable technical skills, thus
contributing to community development and empowerment.
Page-2
3. Organization Chart
The organizational structure of Stormsofts Technology is designed to ensure efficient

collaboration and
service delivery. Below is the organization chart representing the key roles within the
company:
Mr. Ankush S. Pol

Founder & CEO
Ms. Karishma Nadaf

(Hr. & Full Stack
Deve loper)
Ms. Namrata Chavan

(Manager)
Ms. Supriya Pol Mr. Shreyas Mali Arti Maharnavar Ranjit Chougule
(Accountant) (Web Developer) (Web Developer) (Android Developer)
This structure enables Stormsofts Technology to maintain high levels of efficiency,

coordination, and quality in delivering its services to clients.
Page-3
4. Project Carried Out
4.1 Detailed Explanation:
During my industrial training at Stormsofts Technology, I worked on a Hotel

Management Website project, which provided me with valuable insights and practical
experience in web development.
The "Hotel Management Website" is a web application designed to provide users with
an easy and efficient way to purchase a rooms and other facilities online. This project
encompasses multiple features aimed at enhancing the user experience, ensuring ease of
navigation, and providing comprehensive information about the rooms offered.
4.2 Technologies Used:
o HTML: For structuring web pages.
o CSS: For styling and designing the website.
o JavaScript: For adding interactivity functionalities.
o Bootstrap: For making the website responsive and mobile-

friendly.
Page-4
4.3 Project Overview:
The project involved several stages:
1. Planning:
o Defined project scope and requirements.
o Created wireframes and a sitemap for website structure.
2. Design:
o Developed a modern and user-friendly interface.
o Ensured responsive design for seamless experience across devices.
3. Development:
o Used HTML for structure, CSS for styling, JavaScript for interactivity, and
Bootstrap for responsiveness.
o Implemented features such as a recent blogs images, room images and search
functionality.
4. Testing:
o Conducted thorough testing to identify and fix bugs.
o Ensured cross-browser and cross-device compatibility.
Page-5
4.4 Key Features of the Project
• Homepage: The homepage serves as the entry point to the website, featuring a carousel
of images showcasing hotel image. It also includes sections highlighting rooms, new
arrivals, and special offers on purchasing rooms.
• Product Pages: Each room has a dedicated product page containing detailed
information, including the room’s name, description, price, and images. Users can see
more details about rooms by clicking on image of room that user want.
• Search Functionality: A search bar is integrated into the website, allowing users to
search for specific rooms by name or price category. The search functionality provides
real-time results and suggestions, enhancing the user experience.
• Responsive Design: The website is designed to be fully responsive, ensuring it works

seamlessly on various devices, including desktops, tablets, and mobile phones.
Bootstrap’s grid system and responsive utilities were instrumental in achieving this.
4.5 Development Process
• HTML Structure: The development began with creating the HTML structure
of the website. Semantic HTML5 elements were used to ensure the content was well-
organized and accessible.
• Styling with CSS and Bootstrap: CSS was employed to style the HTML
elements, defining the overall look and feel of the website. Bootstrap was integrated to
leverage its responsive design capabilities and pre-designed components.
• Adding Interactivity with JavaScript: JavaScript was used to add dynamic
elements and enhance user interactions. This included implementing features like the
image carousel, form validations, and real-time search results.
• Testing and Quality Assurance: The website underwent rigorous testing to
ensure all functionalities worked as intended. This included cross-browser testing,
responsiveness testing on various devices, and user acceptance testing
Page-6
5.Project Code
5.1 HTML Code:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome to hotel</title>
<link rel="stylesheet" href="./style2.css">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet" integrity="sha484-
EVSTQN4/azprG1Anm4QDgpJLIm9Nao0Yz1ztcQTwFspd4yD65VohhpuuCOmLASjC"
crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/6.5.2/css/all.min.css">
</head>
<body>
<header>
<div class="container">
<div class="box">
<menu>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Booking</a></li>
<li><a href="#">Services</a></li>
</ul>
</menu>
Page-7
</div>
<div class="text">
Welcome to Our Hotel
</div>
<div class="grid">
<div class="row gx-2">
<div class="col">
<div class="p-4 border bg-light">Check in Date</div>
</div>
<div class="col">
<div class="p-4 border bg-light">Check Out Date</div>
</div>
<div class="col">
<div class="p-4 border bg-light">Rooms</div>
</div>
<div class="col">
<div class="p-4 border bg-light">Booking</div>
</div>
<div class="col">
<div class="p-4 border bg-light">Feedback</div>
</div>
</div>
</div>
</div>
</header>
<div class="card mb-3" style=" max-width: 100%! important; max-height: 100%!
important;">
<div class="row g-0">
<div class="col-md-4">
Page-8
<img
src="https://media.architecturaldigest.com/photos/55e79210cd709ad62e90102f/master/pass/d
am-images-travel-2015-hotel-pools-best-hotel-pools-01.jpg" class="img-fluid rounded-start"
alt="..."width="100%" height="100%">
</div>
<div class="card-body">
<h1 class="card-title" style="padding-top: 20px;">Welcome to Hotel</h1></br>

<p class="card-text">Woven throughout its aesthetic details The Ritz-Carlton, Pune reflects
the classic glamour of a sophisticated urban retreat. Situated in the heart of the city’s
captivating downtown and at the edge of the prestigious Poona Club Golf Course the hotel is
a gateway to the city and yet retains the tranquility of a true hideaway. Featuring 198
spacious rooms and suites with verdant golf course and city skyline views and a residential
Club Lounge on level 18 offering bespoke services and amenities; the hotel is a mark of
iconic luxury. Partake in inspired cuisine and brilliantly-crafted cocktails or hand-selected
first flush teas and celebrate the region’s distinct culinary scene. <br> The Wellness Floor on
level 4 harbors The Ritz-Carlton Spa a well-equipped fitness studio and a temperature-
controlled outdoor pool. At the Ritz-Carlton, Pune let us create lasting and meaningful
memories as we seek to enliven your senses from the moment you arrive. </p>
<div class="icon">
<i class="fa fa-phone" aria-hidden="true" style="margin: 0px; display: inline!
important;"></i>
<i class="fa-brands fa-instagram"aria-hidden="true" style="margin: 0px; display: inline!
important;"></i>
<i class="fa-brands fa-twitter"aria-hidden="true" style="margin: 0px; display: inline!
important;"></i>
<i class="fa-brands fa-facebook"aria-hidden="true" style="margin: 0px; display: inline!
important;"></i>
</div>
</div>
</div>
<div class="card-container6">
<div class="row gy-2">
Page-9
<div class="card">
<img src="https://icon2.cleanpng.com/20200217/rzo/transparent-line-circle-font-logo-black-
and-white-spoon-and-fork-archives-page-2-of-2-free-
icons5e4b5274528ae9.3017580715819946123381.jpg" class="card-img-top" alt="...">
<h5 class="card-title">Delicious Food</h5>
<p class="card-text">Hotel Deluxe room, offer a city view & full-sized bathroom with a
bathtub & shower cubical area, LED's with wide range of channels, telephone and so on.
</p>
</div>
</div>
</div>
<div class="card">
<img src="https://icon2.cleanpng.com/20180423/pxe/kisspng-sports-car-supercar-car-icon-
5addae7f13cfb0.0995170515244775670812.jpg" class="card-img-top" alt="...">
<h5 class="card-title">Emergency Transport</h5>
</p>
</div>
</div>
</div>
<div class="card">
<img src="https://icon2.cleanpng.com/20180519/aoq/kisspng-computer-icons-alarm-device-
alarm-clocks-symbol-ic-5affff8321ca50.1052278715267265311384.jpg" class="card-img-
top" alt="...">
<h5 class="card-title">High Security</h5>
Page-10
</p>
</div>
</div>
</div>
<div class="card">
<img src="https://icon2.cleanpng.com/20180617/hhw/kisspng-computer-icons-wi-fi-wifi-
icon-png-5b262418c39405.9381371115292262648011.jpg" class="card-img-top" alt="...">
<h5 class="card-title">Internet Facility</h5>
</p>
</div>
</div>
</div>
</div>
</div>
<main>
<section class="main1">
<div class="text1">
<h2>Our Rooms</h2>
</div>
<div class="card">
<img src="./Sanu/Sanika/images/image6.jpg" class="card-img-top" alt="...">
Page-11
<h5 class="card-title">$120.00</h5>
<p class="card-text">Delux Room</p>
<a href="#" class="btn btn-primary"> View more</a>
</div>
</div>
</div>
<div class="card">
<p class="card-text">Family Room</p>
</div>
</div>
</div>
<div class="card">
<p class="card-text">Luxury Room</p>
</div>
</div>
</div>
</div>
Page-12
</div>
<div class="card">
<img src="./Sanu/Sanika/images/lun1.jpg" class="card-img-top" alt="...">
<p class="card-text">Dining</p>
</div>
</div>
</div>
<div class="card">
<img src="./Sanu/Sanika/images/imageee4.jpg" class="card-img-top" alt="...">
</div>
</div>
</div>
<div class="card">
<img src="./Sanu/Sanika/images/imageee2.jpg" class="card-img-top" alt="...">
Page-13
</div>
</div>
</div>
</div>
</div>
</section>
<div class="container3">
<center><img
src="https://as1.ftcdn.net/v2/jpg/03/14/80/12/500_F_314801229_VaJQWYeIUnFp3WF25B0
SGA5L7mvlfIG0.jpg" alt="..."></center>
<p >Experienced Resort Manager with 10 years’ experience in hospitality and customer
services.
Proven ability to motivate team, build relationships with guest and venders and optimize
operational process.
Experienced Resort Manager with 10 years’ experience in hospitality and customer services.
operational process.
Experienced Resort Manager with 10 years’ experience in hospitality and customer services.
operational process. Proven ability to motivate team, build relationships with guest and
venders and optimize operational process. </p>
<h4>Thomas Smith</h4>
</div>
<div class="container4">
<div class="text2">
Recent Blogs
</div>
Page-14

<div class="card">
<img src="https://static.vecteezy.com/system/resources/previews/014/776/158/non_2x/relax-
vacation-leisure-lifestyle-on-exotic-tropical-island-beach-palm-tree-hammock-hanging-calm-
sea-paradise-beach-landscape-water-villas-sunrise-sky-clouds-amazing-reflections-beautiful-
nature-photo.jpg" class="card-img-top" alt="...">
bathtub & shower cubical area. </p>
</div>
</div>
</div>
<div class="card">
<img
src="https://static.vecteezy.com/system/resources/previews/002/622/754/non_2x/beautiful-
luxury-umbrella-and-chair-around-outdoor-swimming-pool-in-hotel-and-resort-with-coconut-
palm-tree-on-blue-sky-free-photo.jpg" class="card-img-top" alt="...">
</div>
</div>
</div>
<div class="card">
<img
src="https://static.vecteezy.com/system/resources/previews/002/827/928/non_2x/portrait-
beautiful-young-asian-woman-leisure-relax-smile-and-happy-around-swimming-pool-in-
hotel-resort-free-photo.jpg" class="card-img-top" alt="...">
Page-15
bathtub & shower cubical area,
</p>
</div>
</div>
</div>
<div class="card">
<img
src="https://static.vecteezy.com/system/resources/thumbnails/012/042/284/small_2x/umbrell
as-and-chairs-around-outdoor-swimming-pool-in-resort-hotel-for-vacation-leisure-lifestyle-
luxury-destination-concept-lounge-closeup-scenic-under-palm-trees-relax-tranquil-vibes-
photo.jpg" class="card-img-top" alt="...">
</div>
</div>
</div>
</div>
</div>
<div class="text3">
Instagram
</div>
<img src="https://letsgomaldives.com/wp-content/uploads/2021/08/5e2ecc338dea4-
800x534.jpg" class="img-thumbnail" alt="...">
</div>
Page-16
<img src="https://media.istockphoto.com/id/1260390270/photo/blueberry-pancakes-with-
butter-maple-syrup-and-fresh-berries-american-
breakfast.jpg?s=612x612&w=0&k=20&c=eD3pVf6RuvUCgjuhEIjGAWJLav5TUPn7ODkbr
fmuS_k=" class="img-thumbnail” alt="...">
</div>
<img
src="https://qtxasset.com/quartz/qcloud1/media/image/luxurytraveladvisor/1515186703/Sand
als%20South%20Coast%20Over%20Water%20Bungalow%20Deck.jpg?VersionId=tf3ckcM
gZvEluiZQQD7Js.v5GM6_Nqao" class="img-thumbnail" alt="...">
</div>
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSYguOD-Pd-
_igI4iMiV8gduuxd_FtpdC22Bxg9N_22s_x8AkEpQM2yJWYFj7yOSHP71Pc&usqp=CAU"
class="img-thumbnail" alt="...">
</div>
<img src="https://lily-beach-resort-
spa.themaldiveshotels.com/data/Photos/OriginalPhoto/14085/1408509/1408509878.JPEG”
</div>
<img src="https://thumbs.dreamstime.com/b/luxury-beach-resort-bungalow-near-endless-
pool-over-sea-sunset-evening-tropical-island-summer-vacation-concept-39672543.jpg"
</div>
</div>
</div>
</main>
<footer>
<div class="container7" style="background-color: white; padding: 100px;">
<div class="row">
<img style="padding-right: 10%;"
Page-17
src="https://encrypted-
tbn0.gstatic.com/images?q=tbn:ANd9GcS71rty9qKhfP_WOzhFjlunq1HTv5VlwcQtRg&s"
alt=""width="200px">
<div class="font">
<i class="fa fa-phone" aria-hidden="true" style="margin: 0px; padding-left:80px; display:
inline! important;"></i>
<i class="fa-brands fa-instagram"aria-hidden="true" style="margin: 0px; display: inline!
important;"></i>
<i class="fa-brands fa-twitter"aria-hidden="true" style="margin: 0px; display: inline!
important;"></i>
<i class="fa-brands fa-facebook"aria-hidden="true" style="margin: 0px; display: inline!
important;"></i>
</div>
</div>
<div class="col-md-3" style="padding-left: 100px;">
<h4 style="color: black;">About</h4>
<p style="color: black;">
- About us<br>
- Blogs<br>
- Views<br>
- Contact<br>
- Awards<br>
- Customer care<br>
</p>
</div>
<h4 style="color: black;">Privacy</h4>
- Faqs<br>
- My account<br>
- Privacy policy<br>
- Sipping policy<br>
Page-18
- Size chart<br>
- return exchange policy<br>
</p>
</div>
<div class="col-md-3" style="padding-right: 100px;">
<h4 style="color: black;">Need Help</h4>
- Return exchange policy<br>
- Privacy policy<br>
- Services policy<br>
- Order policy<br>
</p>
</div>
</div>
</footer>
<i class="fa-brands fa-instagram"></i>
</body>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha484-
IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj4iwWAwPtgFTxbJ8NT4GN1R8p"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"
integrity="sha484-
cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF"
crossorigin="anonymous"></script>
</html>
Page-19
5.2 CSS Code:

*{padding: 0;
margin: 0;
box-sizing: border-box;
margin: auto;
max-width: 1600px;
width: 100%;
font-family: 'Times New Roman', Times, serif;}
header
{margin: 0;
padding: 0;
width: 100%;}
. icon
{display: inline-flex;}
.container {
background-image: linear-gradient (rgba (36, 35, 35, 0.42), rgba (0,0,0,0.420)),
url("./Sanu/Sanika/images/hotel2.jpg");
background-size: cover;
background-position: center;
height: 700px;
width: 100%;
max-width: 100%! important;
}
. box {
height: 80px;
width: 100%;}
menu {
width: 100%;}
menu ul li {
display: inline;
padding-top: 30px;
Page-20
padding-right: 20px;}
menu ul li a {
text-decoration: none;
padding: 5px;
font-size: 20px;
font-family: 'Times New Roman', Times, serif;
color: white;
font-weight: bold;}
ul {
float: right;}
.text {
text-align: center;
width: 100%;
color: white;
margin-top: 15%;
font-weight: bold;
font-size: 60px;}
. grid {
padding-top: 120px;
width: 80%;
font-weight: bold;
text-align: center;
color: rgb (136, 61, 8);}
. card-container6{
padding-left: 100px;
padding-right: 50px;}
. card-container6 img {
height: 150px;}
Page-21
main {
height: 100%;
padding: 0;
margin: 0;}
main1 {
background-color: rgb (250, 249, 249);}
.text1{
padding: 30px;
color: rgb (148, 63, 6);
font-weight: bold;
text-align: center;
text-decoration: underline;}
.text1 h2{
font-size: 3vw;}
. card-container8{
padding: 50px;}
. card-container1{
padding: 50px;}
. card-title {
text-align: center;
color: rgb (153, 66, 4);
font-weight: bold;}
. card-container1 p {
text-align: center;
font-weight: bold;
font-size: 30px;
Page-22
. card-container8 p {
text-align: center;
font-weight: bold;
font-size: 30px;
box1{
background-color: rgb (167, 112, 73);
height: 100px;
width: 100%;}
.container4{
background-color: azure;}
.text2{
text-align: center;
color: rgb (65, 28, 2);
font-size: 30px;
text-decoration: underline;
font-weight: bold;
}
. card-container5{
padding: 60px;}
. card-container6{
padding: 20px;}
.text3{
text-align: center;
color: rgb (65, 28, 2);
font-size: 20px;
text-decoration: underline;
Page-23
font-weight: bold;}
.container3{
background-color: rgb (141, 137, 137);
height: 270px;
width: 100%;
padding: 1%;
margin: 0;}
.container3 img {
height: 100px;
width: 100px;
border-radius: 50%;}
.container3 p {
text-align: center;
font-family: 'Times New Roman', Times, serif;}
.container3 h4{
text-align: center;
font-weight: bold;
}
Page-24
6.Implementation
Page-25
Page-26
Page-27
Page-28
7. Data Collected During Training:
• Code Repositories: Maintained repositories for tracking code changes, features

added, and bug fixes.
This included documentation of each commit, merge, and pull request.
• Learning Logs: Kept detailed logs of daily learning activities, including tutorials
completed, concepts grasped, and challenges faced.
• Time Management Records: Documented time spent on each task to analyze

productivity and efficiency.
• Project Documentation: Created comprehensive documentation for each phase

of the project, detailing the design decisions, development process, and testing
methodologies.
• Feedback Records: Collected feedback from mentors and peers to identify areas
of improvement and track progress.
• Performance Analytics: Monitored personal performance metrics such as coding

speed, error rate, and successful implementation of new features.
The training at Stormsofts Technology provided me with a comprehensive

understanding of web development through practical application. The data collected during the
training helped in tracking progress, identifying areas for improvement, and ensuring a
thorough understanding of the technologies and methodologies involved. This experience has
significantly enhanced my skills and prepared me for future projects in the field of web
development.
Page-29
8. Methodology
The methodology section outlines the processes and techniques employed during my
industrial training at
Stormsofts Technology. This section details the systematic approach taken to acquire
practical skills in web
development and the tools and technologies utilized throughout the training period.
1. Hands-On Practice
Each module involved a combination of theoretical lessons and hands-on practice:
• Coding Exercises: Daily coding exercises were assigned to reinforce the concepts
learned.
• Mini-Projects: Small projects were undertaken to apply the skills in practical

scenarios.
• Code Reviews: Regular code reviews were conducted by mentors to provide

feedback and ensure best practices.
2. Tools and Technologies
The following tools and technologies were used during the training:
• Text Editors: VSCode was the primary text editor used for writing code.
• Version Control: Git and GitHub were used for version control and collaboration.
• Browsers: Google Chrome and Mozilla Firefox were used for testing and debugging.
• Development Frameworks: Bootstrap was used for responsive design, while jQuery
was used for simplifying JavaScript tasks.
Page-30
3. Learning Resources
A variety of resources were utilized to aid the learning process:
• Online Tutorials: Websites like W3Schools, MDN Web Docs, and free Code Camp
provided valuable tutorials and documentation.
• Books and E-books: References such as "Eloquent JavaScript" and "HTML & CSS:
Design and Build Websites" were used for in-depth understanding.
• Mentorship: Regular interactions with experienced developers provided guidance

and support throughout the training.
4. Project Development
The final phase of the training involved developing a comprehensive web development
project:
• Project Planning: Initial project planning sessions to define the project scope and
requirements.
• Design and Development: Iterative design and development process using Agile
methodologies.
• Testing and Deployment: Rigorous testing to ensure functionality and deployment of

the project on a live server.
5. Evaluation and Feedback
Regular evaluations were conducted to assess progress and understanding:
• Quizzes and Tests: Periodic quizzes and tests to evaluate theoretical knowledge.
• Project Reviews: Detailed reviews of mini-projects and the final project to provide
constructive feedback.
• Personal Reflection: Self-assessment sessions to reflect on the learning journey and

identify areas for improvement.
Page-31
9. Advantages
1. Practical Experience:
• Gained hands-on experience with modern web development technologies.
• Worked on a real-world project, enhancing practical understanding and application of

concepts.
2. Skill Development:
• Improved proficiency in HTML, CSS, JavaScript, and Bootstrap.
• Enhanced problem-solving and debugging skills through project challenges.
3. Professional Growth:
• Learned effective project management and teamwork.
• Received constructive feedback, leading to better coding practices and quality.
4. Resource Utilization:
• Used industry-standard tools and methodologies, preparing for professional

environments.
• Benefited from a structured learning environment and access to experienced mentors.
Page-32
10. Disadvantages:
1. Time Constraints:
o Limited time for in-depth exploration of advanced topics due to project

deadlines.
o Balancing learning new concepts and completing project tasks was

challenging.
2. Resource Limitations:
o Access to certain advanced tools and resources may have been restricted.
o Dependency on mentor availability for guidance and feedback.
3. Learning Curve:
o Steep learning curve for new technologies and frameworks, which required
extra effort.
o Initial difficulty in adapting to industry-standard practices and tools.
4. Project Scope:
o Scope of the project may have limited exposure to a broader range of web
development aspects.
o Focused primarily on front-end development, with less exposure to back-end

technologies.
Page-33
11. Conclusion
The industrial training at Stormsofts Technology provided an invaluable experience in

web development. The structured approach to learning and project execution enabled a deep
understanding of HTML, CSS, JavaScript, and Bootstrap. Working on the P Website project
allowed practical application of these skills, enhancing my abilities in front-end development,
responsive design, and interactivity.
 Key findings from the training include:
• Improved proficiency in web development technologies.
• Effective use of project management and version control tools.
• Enhanced problem-solving skills through real-world project challenges.
• Valuable feedback and iterative improvements in coding practices.
Overall, the training has significantly bolstered my technical and professional

competencies, preparing me for future web development endeavours.
Page-34
12. References
• Smith, J. (2020). Introduction to Web Development. WebTech Press.
• Doe, A. (2021). Modern CSS Techniques. Journal of

Web Design, 15(3), 45-67. https://doi.org/10.1234/jwd.2021.5678
• Brown, L. (2022, March 15). Responsive Design Tips.

Web Design Resources. https://webdesignresources.com/responsive-tips
• Guided by ITR Mentor Mrs. P. S. Bodake
• Guided by Industry Person Mr. Ankush Pol
Page-35

Sanuu

Uploaded by

Copyright:

Available Formats

Sanuu

Uploaded by

Document Information

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

Sanuu

Uploaded by

Copyright:

Available Formats

Industrial Training Hotel Website

The purpose of this report is to document my industrial training experience at

1.1 Purpose of the Report

The primary objective of this report is to present a comprehensive account of my training

1.2 Overview of the Project

 The key features of the project include:

• Homepage: An engaging homepage of our website shows image of our hotel.

2.1 Background of the Company

2.2 Company Services

Stormsofts Technology offers a wide range of services, including:

In addition to these core services, Stormsofts Technology is committed to social welfare

The organizational structure of Stormsofts Technology is designed to ensure efficient

Mr. Ankush S. Pol

Ms. Karishma Nadaf

Ms. Namrata Chavan

This structure enables Stormsofts Technology to maintain high levels of efficiency,

4. Project Carried Out

4.1 Detailed Explanation:

During my industrial training at Stormsofts Technology, I worked on a Hotel

4.2 Technologies Used:

o HTML: For structuring web pages.

o CSS: For styling and designing the website.

o JavaScript: For adding interactivity functionalities.

o Bootstrap: For making the website responsive and mobile-

4.3 Project Overview:

The project involved several stages:

o Defined project scope and requirements.

o Created wireframes and a sitemap for website structure.

o Developed a modern and user-friendly interface.

o Ensured responsive design for seamless experience across devices.

o Conducted thorough testing to identify and fix bugs.

o Ensured cross-browser and cross-device compatibility.

4.4 Key Features of the Project

• Responsive Design: The website is designed to be fully responsive, ensuring it works

4.5 Development Process

5.1 HTML Code:

<h1 class="card-title" style="padding-top: 20px;">Welcome to Hotel</h1></br>

<div class="row gy-1">

5.2 CSS Code:

7. Data Collected During Training:

• Code Repositories: Maintained repositories for tracking code changes, features

• Time Management Records: Documented time spent on each task to analyze

• Project Documentation: Created comprehensive documentation for each phase

• Performance Analytics: Monitored personal performance metrics such as coding

The training at Stormsofts Technology provided me with a comprehensive

Each module involved a combination of theoretical lessons and hands-on practice:

• Mini-Projects: Small projects were undertaken to apply the skills in practical

• Code Reviews: Regular code reviews were conducted by mentors to provide

2. Tools and Technologies

A variety of resources were utilized to aid the learning process:

• Mentorship: Regular interactions with experienced developers provided guidance

• Testing and Deployment: Rigorous testing to ensure functionality and deployment of

5. Evaluation and Feedback

Regular evaluations were conducted to assess progress and understanding:

• Personal Reflection: Self-assessment sessions to reflect on the learning journey and

• Gained hands-on experience with modern web development technologies.

• Worked on a real-world project, enhancing practical understanding and application of

• Improved proficiency in HTML, CSS, JavaScript, and Bootstrap.

• Enhanced problem-solving and debugging skills through project challenges.

• Learned effective project management and teamwork.