The Social Network

A social media network aimed to connect people with similar hobbies.

Folder Structure • Etymology • Key Features • How To Use • API • Credits • Architecture Diagram • License

Folder Structure

.
├── .github/workflows
├── backend                      # Nest JS Microservices, MongoDB, Redis and Docker server folder
├── client                       # Angular workspace includes projects of users website and admins website folder
├── postman                      # All Api documentation
├── .gitignore
├── LICENSE
├── README.md
├── docker-compose.prod.yml
├── logo.png
└── package.json

Etymology

The naming is inspired from the movie The Social Network (2010), it has nothing to do if I liked it or not, it just when I was looking for a name for this project I was like "this a networking website and there's a movie of this theme thus why not"

Key Features

JWT token authentication (access token store in memory, and refresh token store in cookie)
Contact us
Email verification and welcome on verification
Auto refresh JWT before it expires
Upload profile images to a CDN
Change password
Edit profile
Delete account
View profile
Role based authorization
Form validation
Proteced route navigation from unsaved form
Microservices architecture
Container presentation pattern
Docker compose integration for local development and production
Password hashing
Login/register
Nginx configured for Angular routing
Let's Encrypt HTTPS certificates with Certbot
GitHub actions for CI/CD
Pagination

How To Use

Developing

Clone Project

To clone and use this application, you'll need Git and Node.js (which comes with npm) installed on your computer. From your command line:

# Clone this repository
$ git clone https://github.com/AmineAML/TheSocialNetwork.git

Configuration

An example of environments variables do exist in /backend folder as .env.example, change the name to .env and set them up for development

Docker

Nest JS depends on MongoDB as a database and Redis for communication between it microservices running from Docker containers started by a docker-compose.yml file

# Go into the repository
$ cd TheSocialNetwork

# Go into the backend folder
$ cd backend

# Start the containers
$ npm run docker:up

Nest JS Project

To run the backend side, you'll need NestJS CLI

# Go into the repository
$ cd TheSocialNetwork

# Nestjs app
$ cd backend

# Install dependencies
npm install

# Run the API gateway and all of the microservices
npm run start:dev:all

Angular Project

To run the client side, you'll need Angular CLI

# Go into the repository
$ cd TheSocialNetwork

# Angular app
$ cd client

# Install dependencies
npm install

# Run the site app
ng serve site

Note: you must edit proxy.conf.json with your api port

Deploying

This stack can be adjusted and used with several deployment options that are compatible with Docker Compose, but it's designed to be used in a Linux server with pure Docker, a Nginx reverse proxy and handling HTTPS certificates with Certbot

Main steps involves, starting an Nginx Docker Container and making it part of a network (this is important, you can check the docker-compose.prod.yml we added all containers in a network named "production"), then making nginx configuration file to redirect request with your domain to the Angular app container

The other step, is to configure the nginx.conf which you could find in /client folder, this handles each request redirected from the reverse proxy to the container to again redirect those pointing to the api into the api-gateway, then you can set up your GitHub Secrets, add your server to the self-hosted runners (which both you can find them respectively under your repository's settings as Actions and Secrets) and configure your GitHub workflow to build and deploy the app

We are using MongoDB Atlas, and install Docker and Docker Compose on your server

API

You can find a Postman file of a collection with all API endpoint in postman folder, here is an overview of all API endpoints

Accounts

Method	URL	Description
GET	/api/v1/users/user/id/:id	User data by id
GET	/api/v1/users/user/username/:username	User data by username
GET	/api/v1/users/user	Authenticated user data
GET	/api/v1/users/query?search_term=:hobby	Search by query (optional: page and limit)
GET	/api/v1/users/confirm/:auto_generated_string	Confirm new email
GET	/api/v1/users/interests	All interests sorted by popularity
POST	/api/v1/users/user	Add new user
POST	/api/v1/users/login	Login
POST	/api/v1/users/refresh_token	Refresh access token
PUT	/api/v1/users/user/:id	Update user
PUT	/api/v1/users/logout	Logout
PUT	/api/v1/users/confirm/email	Resend email confirmation
PUT	/api/v1/users/user/change/password	Change password
DELETE	/api/v1/users/user/:id	Account removal

Images

Method	URL	Description
GET	/api/v1/images/image/:id	All user profile images
POST	/api/v1/images/image/upload	Upload profle image
DELETE	/api/v1/images/image/:id	Image removal

Reports

Method	URL	Description
GET	/api/v1/reports/report/:id	report by its id
GET	/api/v1/reports	All reports
POST	/api/v1/reports/report	Add new report
PUT	/api/v1/reports/report/:id	Modify report

Mailer

Method	URL	Description
POST	/api/v1/mailer/contact	Submit contact us email

Credits

This software uses the following open source packages/frameworks:

And:

Mailing by Sendgrid
Image CDN by Imagekit
Authentication by JWT
Illustrations by unDraw
Icons by Font Awesome

Also:

Docker
Database by MongoDB
Microservices communication by Redis
Reverse proxy by Nginx
Certbot
CI/CD by GitHub Actions
Server by OCI
DNS Netlify
Postman

Architecture diagram

C4 Model Diagram

License

amineamellouk.com · GitHub AmineAML · LinkedIn amine-amellouk

amineaml / thesocialnetwork Goto Github PK