This internship report provides an in-depth analysis and reflection on the web page development project undertaken during the internship period. The project focused on creating an efficient and user-friendly property listing website. This report discusses the objectives, methodologies, challenges faced, solutions implemented, and the overall impact of the web development process.The real estate industry has seen a significant shift towards online platforms for property transactions. In response to this trend, the internship project aimed to develop a dynamic and intuitive web page for property listings. The goal was to create a platform that not only showcased properties effectively but also provided a seamless user experience. The primary objectives of the web development project were as follows:
User-Friendly Interface: Design and implement a user-friendly interface for easy navigation and property search.
Dynamic Property Listings: Develop a system for dynamic property listings, allowing easy addition, modification, and removal of property details.
Advanced Search Functionality: Implement advanced search filters to enable users to find properties based on specific criteria.
Responsive Design: Ensure the website is responsive across various devices to enhance accessibility.
2. Methodology
2.1 Requirement Analysis
The first phase of the project involved a thorough analysis of the requirements. Meetings with stakeholders and discussions about the essential features and functionalities were conducted to define the scope of the web page.
2.2 Design
The design phase focused on creating wireframes and mockups based on the gathered requirements. The design aimed to achieve a balance between aesthetics and functionality, ensuring an appealing yet user-friendly interface.
2.3 Development
The actual development involved the use of modern web technologies such as HTML5, CSS3, JavaScript, and a backend framework for server-side operations. The development process followed an agile methodology, allowing for iterative improvements based on continuous feedback.
2.4 Testing
A comprehensive testing phase was conducted to identify and rectify bugs and errors. This involved functional testing, usability testing, and performance testing to ensure the website met quality standards.
2.5 Deployment
The final phase included the deployment of the web page on a hosting server. Continuous monitoring and post-deployment support were essential to address any issues that arose after the website went live.
3. Features Implemented
3.1 User Authentication
To enhance security and provide personalized services, a user authentication system was implemented. This allowed users to create accounts, log in, and save preferred property searches.
3.2 Property Listing
The heart of the web page was the property listing section. Properties were categorized based on various criteria, and each listing included detailed information, high-quality images, and contact details for
Electromagnetic relays used for power system .pptx
internship final web development ppt[1].pptx
1. RV College of
Engineering
Go, change the world
Web Page development for
listing properties
Department of Electronics & Telecommunication
Engineering, RVCE
Student Name - Rishabh Jain
USN – 1RV21ET044
Internal Guide Name - Prof.Shambulinga M.
Designation – Assistant Professor
Dept. of ETE RVCE
Company Name - Internshala
Summer Internship-1 -21ETI310
2. Go, change the world
CONTENT
Thursday,30 March 2023 Dept of EtE, RV COLLEGE OF ENGINEERING 2
S.NO CONTENT
1. Summary
2. About the company
3. About the department
4. List of the task performed
5. Client server network
6. HTML, CSS and its properties
7. Database Management System
8. Web page Development for listing properties
8.1 Index page
8.2 Property list
8.3 Property detail
9 Reflection-Learning outcomes
10 Certificate
3. Go, change the world
SUMMARY
S.N
o
Company Internal Guide Duration in Weeks External Guide
1 Internshala Prof.Shambulinga M.
(Assistant Professor)
8 weeks Anuj Kalbalia
(Founder,Ungineering)
SUMMARY OF INTERNSHIP
4. Go, change the world
SUMMARY OF INTERNSHIP
Internshala is a popular online platform that connects students and young
professionals with employers offering internships in various fields. One of
the popular categories on Internshala is web development, which is a field
of software engineering focused on building web applications and
websites using technologies such as HTML, CSS, JavaScript, and various
web frameworks.
Overall, an internship in web development through Internshala can
provide valuable hands-on experience, networking opportunities, and a
chance to explore a career in web development. It can also be a stepping
stone to a full-time job or further education
Thursday,30 March 2023 Dept of EtE, RV COLLEGE OF ENGINEERING 4
5. Go, change the world
ABOUT THE COMPANY
Internshala is an Indian company that provides an online internship
platform for students and recent graduates. It was founded in 2010 by
Sarvesh Agrawal and is headquartered in Gurgaon, India.
Internshala provides internship opportunities across various industries
such as engineering, management, media, law, design, and more.
Internshala has partnered with over 100,000 companies and has helped
more than 5 million students find internships and training opportunities.
The company has received several awards, including the Best
Educational Website award at the Indian Education Awards in 2017 and
2018.
Thursday,30 March 2023 Dept of EtE, RV COLLEGE OF ENGINEERING 5
6. Go, change the world
ABOUT THE DEPARTMENT
Web development refers to the process of creating and maintaining websites or web
applications. It involves designing, coding, testing, and publishing web pages Web
development can be broadly classified into two categories: Front-end development
and Back-end development.
• Front-end development involves designing and developing the user interface of
the website or web application using HTML, CSS, and JavaScript..
• Back-end development involves creating and maintaining the server-side of the
website or web application.
• Full-stack development is a combination of front-end and back-end
development and involves creating and maintaining both the client-side and
server-side of the website or web application.
Thursday,30 March 2023 Dept of EtE, RV COLLEGE OF ENGINEERING 6
7. Go, change the world
LIST OF TASK PERFORMED
• Study how the client server network work Learns about the http
request and how the web browser and web server works with each
other and learn how the ip address is used for communication
between systems
• Learn about Html and basic CSS properties box model, font family,
inspect element, flex box and how the bootstrap can used to reduce
the work and make the project more easy to understand.
• Learn about the Data Base Management System (DBMS) and also
learn how the user data is stored
• In the end of the project create the web page to display the listing of
pg in different city.
Thursday,30 March 2023 Dept of EtE, RV COLLEGE OF ENGINEERING 7
Fig 1.1 Client server network
Fig 1.2 Web page for listing properties
8. Go, change the world
CLIENT SERVER NETWORK
Thursday,30 March 2023 RV COLLEGE OF ENGINEERING 8
In web development, a client-server network architecture is a common model
used to facilitate communication between the user's web browser (the client)
and the web server that hosts the website. In the project Xamp is used to create
the web server in the system itself .The client-server model works as follows:
• The user opens their web browser and enters a URL (Uniform Resource
Locator) to access a website.
• The browser sends a request to the web server for the page or resource
associated with the URL.
• The web server receives the request and processes it, generating a response
that contains the requested data.
• The server sends the response back to the client's browser, which displays
the data on the user's screen.
Fig 2.1 Process of http request and response
9. Go, change the world
HTML AND CSS
Thursday,30 March 2023 RV COLLEGE OF ENGINEERING 9
1. HTML (Hypertext Markup Language) is the standard markup language used to create
web pages. It defines the structure of a web page and its content using various elements
such as headings, paragraphs, links, images, tables, and forms.
2. CSS (Cascading Style Sheets) is a style sheet language used to describe the presentation
of HTML documents. It allows web designers to control the layout, typography, and
color of a web page. Some common properties in CSS include:
• Font properties: used to specify the font family, size, style, weight, and color of text.
• Box model properties: used to control the size, padding, border, and margin of elements.
Positioning properties: used to position elements on the page, including relative, absolute,
fixed, and sticky positioning.
• Display properties: used to control how elements are displayed, including block, inline,
and flex display.
Fig 2.2 HTML
Fig 2.1 CSS
Fig 2.3 CSS properties
10. Go, change the world
Date Base Management System(DBMS)
Thursday,30 March 2023 Dept of EtE, RV COLLEGE OF ENGINEERING 10
Fig 3.2 PhpMyAdmin server used for forming database
A Database Management System (DBMS) is a software system
that allows users to manage databases. It enables users to store,
organize, retrieve and manipulate data in a structured way. DBMS
provides data security, consistency, integrity, backup and recovery.
It is used in various industries such as finance, healthcare,
education, and government. There are different types of DBMS
including relational, NoSQL and object-oriented. Relational DBMS
is the most common type and it organizes data into tables that can
be linked together through relationships. Overall, DBMS is an
essential tool for managing large amounts of data
efficiently and securely.
11. Go, change the world
Web Page for Listing Properties
Thursday,30 March 2023 Dept of EtE, RV COLLEGE OF ENGINEERING 11
The web page for listing properties (project) consist of 3 web page which are
connect through anchor tag the different element use in creating the web page is
HTML, CSS, bootstrap The code is written in the vs code editor the different
tools of bootstrap used in the project such as carosel, modal, sticky image, bread
crumb etc. the different part of the page are divided into class and each class is
edited with different properties using class and selectors The file from the
bootstrap it taken from the internshala which helps in designing and adding
properties to the different element just by using the class name of it apart from
this the image folder used in the project is also given during the internship itself
The three page are-
• Index page
• Property list
• Property detail
Fig 4.1 Index page of project
12. Go, change the world
Thursday,30 March 2023 RV COLLEGE OF ENGINEERING 12
INDEX PAGE
START
BANGALORE MUMBAI
HOME PROPERTY LIST
PAGE
PG
LIFE SIGNUP LOGIN MAJOR
CITIES
ENTER
DETAIL
CREATE
ACCOUNT
ENTER
DETAIL DELHI
13. Go, change the world
Thursday,30 March 2023 RV COLLEGE OF ENGINEERING 13
INDEX PAGE
The index page consist of following things-
• The PG life button which take the page to home page
• Login page which has option for entering detail of the
user and on clicking on the login button user redirect to
the home page
• Create account option is also their which has option to
already account which go the login page
• There is search option also but is does not connect to any
another page
• There are option of major cities which transfer page to
property details
Fig 5.1 Top of the index page
Fig 5.2 Bottom of the index page
14. Go, change the world
Thursday,30 March 2023 RV COLLEGE OF ENGINEERING 14
PROPERTY LIST PAGE
START
Property
detail
page
PROPERTY 1 PROPERTY 2 PROPERTY 3
View
DETAIL
View
DETAIL
View
DETAIL
FILTERS
OKAY
15. Go, change the world
Thursday,30 March 2023 RV COLLEGE OF ENGINEERING 15
PROPERTY LISTING PAGE
Page 2 to the project contains the listing properties
in the web site it contain the option for the filter and
sorting apart for this now breadcrumb can be visible
in the navigation bar which led the user to the home
page apart from this the signup and login option are
present in the sticky top of the web page the lising
property is divided in to the different div and it
show the rating price and view option clicking on
the view option led to the final page to the project
property details
Fig 6.1 Top of the listing page
Fig 6.2 Bottom of the Listing page
16. Go, change the world
Thursday,30 March 2023 RV COLLEGE OF ENGINEERING 16
PROPERTY DETAIL PAGE
START
RENT NOW
SIGNUP
LOGIN
ENTER
DETAIL
CREATE
ACCOUNT
ENTER
DETAIL
17. Go, change the world
PROPERTY DETAIL PAGE
The property detail page is the last page of the project it
contain the detail of the specific property which include
the amenities such Wi-Fi, ac, food etc. apart from this the
rent option is also available in the page. The property
page also contain the testimonials of the people apart
from this the property detail page has carousel which is
moving image which we use by taking files from
bootstrap apart from this the property detail page it also
contain the rating by the user
Thursday,30 March 2023 Dept of EtE, RV COLLEGE OF ENGINEERING 17
Fig 7.1 Top of the property detail page
Fig 7.2 Bottom of the Listing page
18. Go, change the world
LEARNING OUTCOMES
Thursday,30 March 2023 Dept of EtE, RV COLLEGE OF ENGINEERING 18
Learning outcomes for a web development internship include:
• Understanding the basics of web development: HTML, CSS, and
JavaScript
• Learning how to build websites using popular front-end frameworks like
Bootstrap, React
• Gaining hands-on experience with server-side programming languages
such as PHP
• Understanding how to create and manage databases using MySQL or
MongoDB Learning about web application security
• Understanding how to deploy websites and applications to a server or
cloud-based platform
• Learning how to collaborate with a team and communicate effectively.
Fig 8.1 Learning Outcomes
19. Go, change the world
Thursday,30 March 2023 RV COLLEGE OF ENGINEERING 19
REFERENCES
Here are some of the reference used for making project –
[1] J. Smith, "A Comparison of Front-End Frameworks for Web Development," IEEE International Conference on Web
Services, 2018, pp. 78-85
[2] S. Kumar and R. Sharma, "Responsive Web Design: A Comprehensive Study," IEEE International Conference on
Computing, Communication and Automation, 2017, pp. 68-74
[3] J. Doe and M. Singh, "Web Security: Threats and Countermeasures," IEEE International Conference on Computer
and Communications Security, 2019, pp. 215- 222.
[4] R. Gupta and A. Singh, "Web Accessibility: A Review of Guidelines and Techniques," IEEE International
Conference on Advances in Computing, Communication and Information Science, 2020, pp. 124-131.
[5] N. Patel and V. Shah, "Performance Analysis of Web Applications Using Different Metrics," IEEE International
Conference on Emerging Trends in Technology and Applied Sciences, 2018, pp. 89-96.A Complete Overview On: Web-
development Ayush Mauryavans
20. Go, change the world
CERTIFICATE
Thursday,30 March 2023 Dept of EtE, RV COLLEGE OF ENGINEERING 20
.
21. Go, change the world
Thursday,30 March 2023 RV COLLEGE OF ENGINEERING 21
THANK YOU