Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/willycamps/webapp
Web Development - REST API (Python Flask), MySQL and VueJS as FrontEnd
https://github.com/willycamps/webapp
docker docker-compose flask flask-api mysql mysql-database nginx python python3 vue vue-components
Last synced: 23 days ago
JSON representation
Web Development - REST API (Python Flask), MySQL and VueJS as FrontEnd
- Host: GitHub
- URL: https://github.com/willycamps/webapp
- Owner: willycamps
- License: mit
- Created: 2020-12-28T14:01:00.000Z (about 4 years ago)
- Default Branch: develop
- Last Pushed: 2022-01-24T22:20:05.000Z (almost 3 years ago)
- Last Synced: 2024-11-06T09:14:41.928Z (2 months ago)
- Topics: docker, docker-compose, flask, flask-api, mysql, mysql-database, nginx, python, python3, vue, vue-components
- Language: Python
- Homepage:
- Size: 422 KB
- Stars: 1
- Watchers: 2
- Forks: 2
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Full Stack Web-Application
This project can be used to run a basic [flask app with MySQL as DB]- BACKEND and VUE.js - [FRONTEND] using docker-compose.
# Description
The "Table" view I see a table with football clubs, sorted by points.
In the "Admin" view I have the possibility to enter a result:
Two clubs can be selected and one can be marked as winner. Each victory is worth three points. If no winner is marked, the match is considered a draw and both teams get one point. Goals are not counted.## Getting Started
**Step 1:** Make sure git is installed on your os. I will be using Ubuntu 20.04.1 for the project in VM.
**Step 2:** Clone the project into your local machine using below command.
```git clone https://github.com/willycamps/Vue-Flask-Webapp.git```
### Prerequisites
**1. Docker**
Make sure you have Docker installed. Please follow the below link for official documentation from Docker to install latest version of docker on your os. For this project I am using Docker CE (18.09).
```https://docs.docker.com/docker-for-mac/install/```
### Installing
**Step 1:** Change to the directory where the project was cloned in previous step.
```
cd flask-vue-mysql-docker
```**Step 2:** Make sure Docker is up and running. You can start the docker engine from command line.
```
sudo docker info
```**Step 3:** Run
```
docker-compose up --build
```Build and run in the background and view logs for all the instances :
```
docker-compose up --build -d && docker-compose logs --tail=all -f
```
**Step 4:** Open up the browser* [The Front-End with Vue.js] (http://localhost:8001/) - Vue.js
```
http://localhost:8001/
```
![alt text](./img/Vue-01.JPG "MySQL Client")* [PhpMyAdmin] (http://localhost:8080/) - MySQL Client
```
http://localhost:8080/
```
![alt text](./img/phpAdmin-01.JPG "MySQL Client")* [The API] (http://localhost:8000/) - API
```
http://localhost:8000/
```
![alt text](./img/API-01.JPG "MySQL Client")## Deployment
## Built With
* [Docker](https://docs.docker.com/compose/install/) - Docker
* [Flask](https://flask.palletsprojects.com/en/1.1.x/quickstart/) - The web framework
* [Python](https://www.python.org/) - Programming language
* [pip](https://pip.pypa.io/en/stable/) - Package and dependency manager
* [MySQL](https://www.mysql.com/) - Database
* [PhpMyAdmin](https://www.phpmyadmin.net/) - MySql Client## Versioning
* GIT
## Authors
* Willy E. Campos
## TODO
* ORM with SQLAlchemy, create the missing Endpoints and make the documentation in READ.me
* Version 1
* Unit Test
* CI/CD - Workflow
* Version 1.2
* Grafana Monitoring
* Boostrap CSS
* Version 1.3
* AWS / Google-Cloud / Azure for Docker ?
## Change Log
* v0.2 - Integrate Authentication.
* v0.1 - Initial release.