Yelp-Campground

Overview

My process

Users should be able to:

View the website on various devices and move between the sections of the app smoothly.

See others' campgrounds and reviews but to interact with them they need to be logged in.

Sign up or log in on the website directly or via their Google account.

Add location on the map by just adding a new campground and specifying the location of it.

Live Site URL: Yelp-Campground

Semantic HTML5 markup

CSS custom properties

Node.js

Express.js

EJS

Mongoose

MongoDB

Cloudinary

Mapbox

Passport

Npm

Node.js - To establish a server with JS

Express - Web framework for Node.js

EJS - Embedded javaScript templating

MongoDB - Database

Cloudinary - Database for pictures

Mapbox - To show the all maps in the app

Passport - All sorts of authentication

Npm - Npm package

How to create a website with a server and database using node.js for the server and express to handle the requests and the responses and also to manage static files in the public folder, and with EJS I was able to use javascript inside HTML files.

And how to save the data in databases like MongoDB, and Cloudinary as a database for pics due to its size.

Besides, the Mapbox website shows maps on the app and manages to provide geolocation features.

Also implemented many packages via npm to save time, and keep it simple, and efficient.

How to use the passport for authentication whether locally or with Google.

Finally to organize the app with controllers instead of putting everything in one place and to achieve MVC.

cookie-parser - This helped me for managing the cookies of the session, to keep the user logged in even after closing the browser.

method-override - This is an amazing package that helped me to control DELETE and PUT requests easily. I'd recommend it to anyone who want to handle those requests.

HELMET - This tool assisted me to keep the website secure, it's a huge bullet for security but it can help.

connect-flash - This is a small tool to control the messages on the website as a pop-up or notification, and it can be manipulated to handle all sorts of alerts.