Project 15: Around U.S Full-Stack Social Travel App 🌎

Developed By Grace Chen Abudi 👩🏽‍💻

This repository contains the full API of "Around the U.S." project that features user authorization and user registration and handles cards and users.

This app was integrated between Backend & Frontend repositories, then deployed to Vercel.

📣 Overview:

Intro
Tech Stack & Techniques
Free Images Source
Possible Improvements
Live Project
All Project Features

🔎 Intro

This is a Full-stack interactive app with responsive design which enables travelers to share their travel photos by creating account.

🧰 🛠️ Tech Stack & Techniques:

ReactJS
Express.js
Node.js
MongoDB + MongoDB-Atlas
Vercel Deployment
CI/CD
Vercel Serverless technology
JWT server Auth
localStorage
REST API with CRUD Implementation
CSS3
Git/GitHub

NPM Packages (Backend)	Aspects of Use
bcryptjs	Password Encryption
body-parser	Returns middlewares that handle incoming requests before they reach a target controller .
celebrate	It's an express middleware function that wraps the joi validation library .
cors (Cross-Origin Resource Sharing)	It is a mechanism to allow or restrict requested resources on a web server depend on where the HTTP request was initiated. This policy is used to secure a certain web server from access by other website or domain .
dotenv	automatically loads environment variables from a . env file into the process. env object .
express-winston	Provides middlewares for request and error logging of your express.js application .
winston	Universal logging library with support for multiple transports .
validator	A library of string validators and sanitizers .
jsonwebtoken	An open standard for securely transferring data within parties using a JSON object .
express-rate-limit	Use to limit repeated requests to public APIs and/or endpoints such as password reset .
helmet	Helps you secure your Express apps by setting various HTTP headers .

📍 API Endpoints :

RESTful API Enpoints	HTTP Methods	Usage Purpose
/signup	POST	User Registration
/signin	POST	User Login
/users	GET	GETting data from all users
/users/:_id	GET	GETting user by their id.
/users	POST	Creating a specific user profile
/users/me	PATCH	Updating user data
/users/me/avatar	PATCH	Updating user avatar data
/cards	GET	GETting data from all cards
/cards	POST	Creating a new card
/cards/:_id	DELETE	DELETE card by its id
/cards/:_id/likes	PUT	Liking a card
/cards/:_id/likes	DELETE	Disliking a card

📷 Free Images Source

For incredible images, Feel Free to 👉🏽 Click Here !

🔧 Possible Improvements

Create a Forgot Password option in case the users forget theirs.
Resets Password

✨ Live Project

Visit the App 👉🏽 HERE !
Remote Server API Deployment

Enjoy ! 🌺

📸 All Project Features

In first visitation, the users requires to sign up to create an account.
- If the users has registered already, they can simply log in.
Once the users logged in, there's no need to log back in again for 7 days at least, as this is the expiration duration of JWT token.
- They will be navigated to the Homepage with several features to use.
  - Edit their profile name, about, and their avatar image.
  - Adding their own cards to the collection.
  - Seeing others cards.
  - Capability to like or dislike own and others cards as well.
  - The users can remove only their own cards and not someone elses.
  - Click on the image to view it in its full size.

Chen-Abudi/react-around-api-full