Meetgather

A platform you’re able to form any kind of activities to invite netizens to participate your events. Also, it’s a website that makes you meet new friends who share the same hobbies with you.

Motivation

I’m an adventurous person who would like to break my comfort zone to experience the world. People who want to experience new things or make new friends can utilize the web to make their lives splendid. Most importantly, I’d like to showcase my full-stack developing skills and proficiency in AWS.

Technologies

Front ends

• HTML, CSS, JavaScript

  I developed the web without using any templates on the internet. I did it from the scratch on my own.

• Ajax

  Use async, await to fetch api and get data from server

• Jinja

  Simplify HTML templates with Jinja

• i18n

  The web can be adapted to English and Chinese

• RWD

  Adapt web to any size of screen

• Open Graph Protocol

  Add OG properties to have distinctive graphics and descriptions when sharing on social media

• Google Maps API

  Apply Google map to show the accurate position of events

Back ends

• Python Flask

  Establish server with Flask

• RESTful API

  Make use of RESTful API to let front-ends read, create, patch or delete data. All APIs URLs are displayed on second.py.

• MVC

  Separate different functions in each part. Models are wrapped in models.db.py, views are in static and templates folders, controllers are in app.py

• Smtplib

  Send emails with Python via Zoho Mail when hosts deliver messages to attendees

• JWT

  Produce a limited token when an user login, which is a credential for server to identify the user

• Nginx

  Utilize a reverse proxy to conceal IP address of the web with a domain name

• Domain Name

  Create a domain name, meetgather.site, on GoDaddy and connecting it with IP address of Meetgather

• SSL certificate

  Secure URL with https by Certbot

• Docker

  Write Dockerfile, make an image and run the image on EC2 without setting up environment.

• Third-party sign-in

  Use Google OAuth 2.0 to allow users to login without inventing an unique password

AWS

• EC2

  Run the application on EC2, using Ubuntu 22.04.4 LTS system.

• RDS

  Deploy MySQL to store and preserve data.

• lastiCache

  Run Redis to cache data with faster speed instead of requeasting data to RDS everytime.

• S3

  Store photos of activities and personal profiles that users upload

• CloudFront

  Display photos faster with CDN in AWS

How to run the project?

EC2

• Create AWS account and launch EC2 instance of Ubuntu 22.04.4
• Allocate and associate elastic IP address
• Go to Security Groups in EC2 and set up inbound rules, which is opening the port 2000, 80, 443, 3306, 6379.
  2000 is port of the web, 80 is port of HTTP, 443 is port of HTTPS, 3306 is port of RDS and 6379 is port of Redis.
• Login EC2 and operate with Linux command line.
• The project needs to be run with .env file, so operator should ask authour for .env and put .env in a folder

Docker

• Install docker on EC2

sudo apt-get update

sudo apt install docker.io

sudo systemctl enable docker

sudo systemctl start docker

• Check whether docker could run successfully

sudo docker run hello-world

• Pull the docker image

sudo pull alemapnil/meetgather_f

• Go to the folder containing .env, run the project with docker image and open port 2000. Later you can see the web through URL, which is "elastic IP:2000"

sudo docker run -d -p2000:2000 --env-file .env alemapnil/meetgather_f

Domain name registrar

• Set up a domain name with elastic IP in A record
• Set up MX record and TXT record regarding email server, which is zoho.com. Ask authour about this

Nginx

• Install nginx on EC2 and run

sudo apt update

sudo apt install nginx

sudo systemctl start nginx.service

• Check nginx status of operation

sudo systemctl status nginx

• Go to nginx.conf

sudo vim /etc/nginx/nginx.conf

• Amend nginx.conf with commenting out two lines in http{} and increasing server{} in it.

http{
# include /etc/nginx/conf.d/*.conf;
# include /etc/nginx/sites-enabled/*;
server{}
}

• Set up elastic IP and port in server{} well so that users could visit the web with domain name

server {
listen 80;
server_name meetgather.site;
client_max_body_size 4M;
location / {
	proxy_pass	http://elastic IP:2000/;
 	proxy_redirect	off;
  	proxy_set_header   Host			$host;
  	proxy_set_header   X-Real-IP		$remote_addr;
  	proxy_set_header   X-Forwarded-For	$proxy_add_x_forwarded_for;
  	proxy_set_header   X-Forwarded-Proto	$scheme;
  	add_header Content-Security-Policy upgrade-insecure-requests;}
}

• Confirm whether configuration of nginx is correct

sudo nginx -t

• Start nginx again and you can visit web through domain name

sudo systemctl restart nginx

SSL

• Add SSL on domain name through Certbot

sudo snap install --classic certbot

sudo ln -s /snap/bin/certbot /usr/bin/certbot

sudo apt-get install python3-certbot-nginx

sudo certbot --nginx

How to Use the Web?

meetgatherCut.mp4