Yelp-Campground

Ahmed Abdelsamie

Backend Engineer
Frontend Engineer
HTML5
MongoDB
Node.js

Yelp-Campground

Table of contents

Overview

Project goal

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.

Screenshot

Links

Live Site URL: Yelp-Campground

My process

Built with

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

What I learned

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.

Useful resources

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.
Partner With Ahmed
View Services

More Projects by Ahmed