DevUp

By Michelle Shen, Eduardo Venegas, and Angela Wang

Deployment: https://dev-up.tech

📖 Project Overview

Ever wanted to work on a project with others but don't know where to get started? Introducing DevUp - a platform to help developers find teammates for side projects.

Developers can search for projects that they are interested in, and contact the current team members of the project to learn more about them and join their team. Developers that already have an project idea can make a post on DevUp to display it to other project-seeking developers and find new team members.

📍 Table of Contents

• Technologies Used
• Architecture
• CI/CD
• Site Overview
• Monitoring
• Installation
• Usage
• Contributing

💻 Technologies Used

• Docker
• React Ionic
• Flask
• PostgreSQL
• AWS
• NGINX
• cAdvisor
• Prometheus
• Grafana
• Github Actions
• Github Package Registry
• Python
• JavaScript

📚 Architecture

The architecture is highly modularized, where every service has its own container and is independent from the others.

• The Nginx service container loads the SSL certificate and has a reverse proxy to connect the client app and the monitoring tools.
• The Client and API containers get their images by pulling from our Github Package Registry. These images are built into the CI/CD workflow with Github Actions.
• The API image is only accesible via the internal Nginx service in the Client container. On top of that, the API container connects to a Database contianer that has its own volume for data persistance.
• The Monitoring containers are accessible by their own routes or ports and have volumes to keep their data persistant.

🤖 CI/CD

This project has a full Continuous Integration and Delivery system.

• All code is tested the moment a pull request is created using Linters and Unit Tests (Postman Testsing and Jest).
• You can merge into main when all tests pass
• When Continuous Delivery is triggered, Github Actions builds the Client and API images and pushes them into a Github Package Registry.
• Finally, Github Actions SSHs into the AWS instance, pulls the new images, stops the current docker compose and runs it again.

🔍 Site Overview

Login/Register

Developers can create a DevUp account to share their interests and languages, post about their projects, and contact other project owners.

Explore/Home Page

The Explore/Home Page is where developers can see projects that are open for collaboration. Users will be able to view more details about the project and contact the project owner.

Categories Page

The Categories Page shows all available topics and users can click on a topic to view related projects.

Projects Page

The Projects Page displays all of the projects that the user is contributing to. It is also where the user can post about their own project to look for other developers, and make edits to their post when necessary.

Profile Page

The Profile Page displays a user's basic information, languages, interests, and top projects that they are working on.

🖥️ Monitoring

cAdvisor

Prometheus

Grafana

⬇️ Installation

Make sure you have python3 and pip installed

Clone the directory and enter the project directory:

$ git clone https://github.com/LaloVene/MLH-PE-Project.git
$ cd MLH-PE-Project

Create and activate virtual environment using virtualenv, under /api

$ cd api

# Install virtualenv
$ pip install virtualenv

# Create virtualenv
$ python -m venv venv
# Create virtualenv for windows
$ py -3 -m venv venv

# Activate virtualenv:
$ source venv/bin/activate
# Activate virtualenv for windows:
$ venv\Scripts\activate

Use the package manager pip to install all dependencies

$ pip install -r requirements.txt

💼 Usage

Create a .env file in the root app directory using the following template:

FLASK_APP=api.py
FLASK_ENV=development
POSTGRES_USER=[username]
POSTGRES_PASSWORD=[password]
POSTGRES_HOST=[host_name]
POSTGRES_DB=[db_name]

Run on Docker

$ flask db init
$ docker-compose up --build

This will create a server running on localhost:5000 and a client running on localhost:3000. Data will be stored in a Docker volume.

AWS Configuration

• Instance: AWS EC2
• Instance type: t2.small
• Traffic: All

📝 Contributing

Contributions are welcome! Please refer to the Contributing guidelines.