/ResortP

A Resort Website made with react, styled components and Headless CMS

Primary LanguageJavaScript

React Beach Resort

It is a Resort website where user can checkout different types of rooms such as single, double, family and presidential. There is a filter in room page where user can filter rooms by room type, room capacity, price and whether pet is allowed or not.

Live link: Click here


Quick Start

# clone repository
https://github.com/savajapurva/ResortP.git

# Install dependencies
cd ResortP && npm install

To query and get content using the APIs, client applications need to authenticate with both the Space ID and an access token. So, create account in contentful and then create an App.

API keys of your app will be in setting -> API keys section

Now, create an .env.development file in yor project and add your keys.

REACT_APP_API_SPACE=YOUR_SPACE
REACT_APP_API_ACCESS_TOKEN=YOUR_ACCESS_TOKEN

To access your data from contentful, you need to add all your fields and data to the content model. Kindly, refer to the below snapshot of my dashboard.

<img src="img/d.png">

<img src="img/f.png">


To run the development server:

```bash
# the development server runs on port 3000
npm run dev

To run production build:

# create code bundle
npm run build

# run production server
npm run prod

To deploy this project to heroku see steps below:

You will need to create an account in Netlify

# Heroku-cli (paste link in browser)
https://devcenter.heroku.com/articles/heroku-cli

Afer installing heroku-cli run the following commands in terminal

# login locally
heroku login

You will be prompted to enter your email and password which is the same the email and password used when you sign up for Heroku

# create your app
heroku create

# set enviroment vareiables
heroku config:set mongoURI=YOUR_OWN_MONGO_URI
heroku config:set secretOrKey=YOUR_OWN_SECRET

Try to keep your production DB different from development DB

# bundle code for production
npm run build

# deploy code to heroku
git push heroku master:master




Main Technologies

Client Side

Libraries used in Client-side

Server Side

Libraries used in Server-side