BANGALORE INSTITUTE OF TECHNOLOGY

K.R.ROAD, V.V.PURAM, BANGALORE - 560004

DEPARTMENT OF INFORMATION SCIENCE AND ENGINEERING

An internship on
“KID’S PRE-SCHOOL WEBSITE”
At
“PRINSTON SMART ENGINEERS”

External Guide NIHARIKA SINGH Internal Guide

USN: 1BI21IS063
Ms. Farheen Farhath Dr. Vani V
HR Director Assistant Professor
Prinston Smart Engineers Dept. of ISE
CONTENTS
• Introduction
• About the company
• Organization of the company
• Services provided by the company
• Task assigned by the company
• Basic training
• Internship timeline
• Problem statement
• Technology used in the Project
• Code snippets
• Output
• Reflection Outcomes
• Conclusion
Introduction
Welcome to the innovative endeavor of crafting a dynamic online platform for a distinguished
Kid’s Pre-School Website. This project revolves around the creation of an engaging and
informative website using HTML, CSS, and JS. With a focus on intuitive design and seamless
functionality, the website showcases key sections like About, Home, Admission, Contact. At our
preschool, we believe in fostering holistic development through engaging activities like
playtime, healthy meals, special events like Easter plays, farm trips, music concerts, and Talents
Day. These enriching experiences not only cultivate essential skills but also ignite curiosity and
creativity in our young learners. We are committed to providing a supportive atmosphere where
children can thrive, discover their passions, and build a strong foundation for future success.
Join us on this journey of exploration and growth!
About the company
● PRINSTON SMART ENGINEERS is a Mechanical,
Electrical and Plumbing Design consultancy, they design,
build, construct, supply, install, service and upgrade of
Electro-Mechanical Systems & Networks, Utilities and
Equipment. Their scope covers Engineering, Documentation,
Submittals Approval, Shop drawings, Coordinating Drawings,
Commissioning, Start-Up, As-Built ACC.

● To Contract Programs, Project Time Schedules – Complying

Consultant Specifications, as well as IT services and provides
a platform for engineering students to learn industry skills by
providing live instructor-led interactive online training.
COMPANY PROFILE
 Corporate Name: PRINSTON SMART ENGINEERS

 Main Office: Vishnuvardhan Statue Rd, Vishwa Priya Nagar, Begur, Bengaluru,
Karnataka 560068

 Phone: +91 9810 188 747

 Contact Person: Mrs. Fraheen Farhath

 Email Address: Prinston.Smart@gmail.com

 Year Started: 2004

 Company Category: IT Software/Embedded

ORGANISATIONAL STRUCTURE of the company
OBJECTIVES OF THE DEPARTMENT
• To Provide Quality Internship Opportunities: By offering quality internship programs conducted by expert
teams, the company aims to bridge the gap between theoretical knowledge and real-world applications, thereby
preparing students for their future careers.
• To Expand Services Through Collaborations: The collaboration with Wedir-tech Trading Contracting &
Services W.L.L in Doha, Qatar, indicates a strategic move to enhance service offerings, leverage mutual
benefits, and tap into new markets.
• To Unite Education and Community for Business Growth: By creating a platform that integrates education
and community engagement, Prinston Smart Engineers aims to foster sustainable business practices while
contributing to the development of society.
• To Address Unemployment Among Engineering Graduates: Prinston Smart Engineers aims to tackle the
issue of unemployment among engineering graduates by providing skill development programs and training in
various domains.
CLIENTS OF THE COMPANY
• Honeywell: Honeywell is a global conglomerate that has been innovating for over 100 years. The company
operates in various sectors, including aerospace technologies, building automation, energy & sustainability
solutions, and industrial automation.
• Kribhco: KRIBHCO (Krishak Bharati Cooperative Limited) is a premier National level Cooperative Society of
India engaged in fertilizer production and distribution.
• Shipra: Shipra Group of Companies has a rich heritage dating back to its establishment in 1984, embodying
resilience and innovation throughout its journey. The brand has evolved into a celebrated legacy, empowering
lives and shaping industries with unwavering determination.
• C & S Electronics: C&S Electronics is a prominent player in the switchgear business segment and holds a
market-leading position in the busbar business, commanding over 50% share in the Indian market.
• The India Islamic Cultural Centre: IICC was established to promote mutual understanding and harmony
among the people of India, showcasing the true essence of Islam as a tolerant, liberal, progressive, and forward-
looking religion.
CLIENTS OF THE COMPANY
SERVICES
• MEP Design services
• Operation and Maintenance
• MEP Installation
• Website Development
• HVAC Design
• Plumbing
• Electrical design
BASIC TRAINING
● Introduction to Web Development: Overview of web development and the role of a full stack
developer , Introduction to the tools and setup: Code editor (VS Code), browser developer tools,
and version control (Git).

● HTML Basics: Common HTML elements: headings, paragraphs, lists, links, images, and
tables ,Semantic html using : <header> ,<footer>,<section>, and many other tags

● Advanced HTML: Forms and form elements:<input>,<textarea>,<select>,<button>.

Multimedia elements: <audio>,<video>,<canvas>.

● CSS Basics: Introduction to CSS and how it works with HTML, Basic selectors, properties, and
values ,Styling text, backgrounds, and borders.

● Advanced CSS: Box model, margin, padding, and border, Positioning elements: static, relative,
absolute, and fixed positioning.
BASIC TRAINING
● JavaScript Basics: Introduction to JavaScript and its role in web development, Basic syntax,
data types, and variables, Functions, loops, and conditionals.
● DOM Manipulation: Understanding the Document Object Model (DOM), Selecting and
manipulating DOM elements, Event handling and listeners.
● JavaScript Frameworks and Libraries: Introduction to jQuery and its basic usage, Overview
of modern JavaScript frameworks (e.g., React, Vue.js, Angular).
● Project Development: Implementing the HTML structure and CSS styling for the project,
Adding interactivity with JavaScript.
● MySQL: A runtime environment that allows the execution of JavaScript code on the server side,
facilitating server-side scripting.
● DBMS: Using SQL to query relational databases with CRUD operations.
TASKS ASSIGNED
• Develop the given website consisting of at least 6 pages, using HTML, CSS, and Bootstrap.
• Ensure responsive design across various devices and screen sizes, enhancing user experience
and accessibility.
• Implement basic functionalities using JavaScript
• Create a demo video of the project, prepare a report on the project.
INTERNSHIP TIMELINE
SL. No. WEEK TASKS PERFORMED
• Introduction to Web Development.
• Basics of HTML5 – boiler plate structure, basic tags
Week – 1 like header, footer, image, body.
1.
(25 Oct, 2023 to 1thNov, 2023)
th
• CSS3 for styling and layout.
• Bootstrap for styling, responsive design and layout.
• JavaScript to create user functionality.
Week – 2 • DOM structure and it’s manipulation
2.
(2 Nov, 2023 to 8thNov, 2023)
nd

• SQL
Week – 3 • DBMS
3. (9 Nov, 2023 to 15thNov, 2023)
th
• CRUD operations
• Got assigned a Task – “Kid’s Pre-School Website” to be
Week – 4 developed
4. (16 Nov, 2023 to 23thNov, 2023)
th • Started working on the allotted Project by the Company.
• Providing demo and presentation on assigned project
Problem statement
• The problem statement is to develop a Kids Pre-School website, utilizing my skills in full stack
web development using HTML, CSS, and JavaScript
Technology or Methodology used in the project
1. Frontend Technologies:
1. HTML: Used for structuring the web pages.
2. CSS: Used for styling and layout.
3. Bootstrap: A CSS framework used for responsive design and pre-built components.
4. JavaScript: Used for interactive elements and behavior.

2. Additional Libraries:
1. Swiper: A JavaScript slider library used for creating sliders or carousels .
2. Font Awesome: For Adding scalable vector icons that can be customized with CSS.
3. Google Fonts: Used to include custom fonts (like-”lato”) from Google Fonts.
METHODOLOGY

System Architecture
CODE SNIPPET
 Index.html
 About.html
 Style.css
 script.js
Outputs

Homepage:
About us:
Contact
REFLECTION OUTCOMES OF THE INTERNSHIP

o TECHNICAL OUTCOMES
1. Understanding of Web Development Concepts: I gained a solid understanding of fundamental web development
concepts, including front-end and back-end development, responsive design, and user experience (UX)
principles.
2. Programming Skills:
● HTML/CSS: I sharpened my HTML and CSS skills, which are essential for structuring web content and
styling web pages.
● JavaScript: I improved my JavaScript programming skills, enabling interactive and dynamic functionalities
on web pages.
● Frameworks and Libraries: I became proficient in utilizing frameworks and libraries such as Bootstrap for
responsive design and jQuery for DOM manipulation.
3. Front-End Development:
Responsive Design: I learned about responsive design techniques to ensure the website is accessible and
functional across different devices and screen sizes.
o NON-TECHNICAL OUTCOMES
1.Adaptability: I learned to adapt to different project requirements and challenges encountered during the Men's salon
website development, showcasing flexibility in approach and problem-solving.

2.Teamwork: Collaborating with peers and stakeholders on the Men's salon website project enhanced my ability to
work effectively in a team environment, fostering communication, coordination, and knowledge-sharing.

3.Time Management: Balancing multiple tasks and deadlines in the website development project helped me improve
my time management skills, ensuring efficient utilization of resources and timely project delivery.

4.Critical Thinking and Problem-Solving: Engaging in the development of the Men's salon website required critical
thinking and problem-solving abilities, enabling me to analyze user feedback, identify design improvements, and
implement meaningful solutions to address real-world challenges.
 Conclusion
• In conclusion, my internship experience working on the Kid’s Pre-School website has been immensely valuable
both technically and non-technically. Through hands-on involvement in web development, I have enhanced my
skills in HTML, CSS and JavaScript. This project presented various challenges, such as debugging, which I
successfully navigated, further strengthening my problem-solving capabilities.
• On the non-technical front, the internship fostered significant personal growth. I improved my communication and
teamwork skills by collaborating with peers. Time management became crucial as I balanced multiple tasks and
deadlines, leading to efficient project delivery. Additionally, I developed critical thinking skills by analyzing user
feedback and implementing design improvements, which contributed to creating a user-friendly website.
• Overall, this internship has provided me with a comprehensive learning experience, equipping me with practical
skills and professional insights that will be instrumental in my future career. The knowledge and connections gained
have solidified my interest in web development and design, setting a strong foundation for my professional journey.