Training Project –

PG-LIFE
Name : Prashant Tripathi
Group B8
Roll no12005041
INTRODUCTION
• INTRODUCTION TO PROJECT

PG rooms are an integral part of our travel or student routine,

and you can choose your rest place near your college . A variety
and design of rooms are now available in the market for various
activities from mountaineering to. The value of a good rooms is
constant. Whatever the occasion may be befitting a room for
shelter is need. Online room booking is the process preferred by
many these days. Hence pg-life has designed an easy and
efficient online pg booking website project using web
development technology like html css js. This PG life website is
a good collection of rooms for girls and boys paired with
extremely profitable offers and deals to choose from this
website. Thus, this online Pg booking will relieve people by
providing access for purchasing pg rooms just by sitting at home.
About us
• “PG-LIFE” this is project in which a customer can see and book the
room according to his/her need.
• This website is for men, women .
• It contains a huge variety and collection of rooms in different
location.
• There also available other facility like wifi, tv, water purifier , air
conditioner etc.
• Last but not the least it also contains wardrobe for your storage”.'
• It have a specific option for the user to buy a product on a low price
i.e.“Sale”.
THIS IS HOME PAGE OF THE WEBSITE
• First it have the logo of the website on the left side of the
page specifying the name of website and contents.
• For search accordingly to your required place for hostel
room there is search bar.
• In this page there we have SIGN IN / LOG IN On clicking
on any option lodin or sign up box will open and you can
enter detail and make an account.
• Below the bar there are 4 different Delhi, Mumabi,
Benguluru, Hyderabad.
• On clicking on any of the photo the specific page will open
specifying the option a user clicked on
CODE OF THE NAV BAR
MAJOR CITIES INPUT
OUTPUT
• There is a 4 option of major cities.
• You can find room by filtering according by cities
• When we click one of these option a new page will open with room availability
option in select city
SEARCH BAR INPUT
SIGN IN MODAL
OUTPUT OF THE MODAL
• This is a sign up section where you can enter the details and create an
account clicking on create account.
• It will open when you click on sign up.
LOGIN MODAL
• It is a login box it pop up when you click on Log in.
• Enter email in the email section.
• Enter the password in password section hidden way.
CODE OF LOGIN MODAL
 Property list
• At the top have a breadcrumb which actually describe context address of page is now opening
• There have also 3 option Filter, Highest rent first and lowest rent first.
• Then there is various option of rooms available in city.
• There are also a little description about available room like Name of PG , address of Pg, Rent prize ,
like option where are customer and add to favourite.
• When you click on view option a new page will open with much more about the room and place.
CODE OF PROPERTY LIST
Code of card 2
Property Detail
HEADER PART OF PROPERTY DEATAIL
Crousel
AMENTIES
Code of amenties
About the property
Code of about property
Property Rating And Reviews
THANK YOU