In this tutorial we will setup two containers:
- api-service
- frontend-simple
The following container architecture is what we will implement:
- Have Docker installed
- Have VSCode or editor of choice
In this tutorial we will setup containers to run python code for creating APIs and a container to run HTML web server.
- Clone or download from here
It is important to note that we do not want any secure information in Git. So we will manage these files outside of the git folder. At the same level as the mushroom-app-v1
folder create a folder called secrets
Your folder structure should look like this:
|-mushroom-app-v1
|-images
|-src
|---api-service
|---frontend-simple
|-secrets
|-persistent-folder
We will build a simple frontend app that uses basic HTML & Javascript.
- Open a terminal and go to the location where
mushroom-app-v1/frontend-simple
- Run
sh docker-shell.sh
ordocker-shell.bat
for windows
- To run development web server run
http-server
from the docker shell - Test the web app by going to
http://localhost:8080/
- Open
index.html
in your editor - Add some text using the
<p>
tag in the html
<body>
🍄 Welcome to the mushroom identification App!
<p>
This is a placeholder for the awesome mushroom identification app
</p>
</body>
- Refresh the page
http://localhost:8080/
- You will see your changes in the web page
We will create a basic backend container to run our REST API. The FastAPI framework will be used for this.
- Open a terminal and go to the location where
mushroom-app-v1/api-service
- Run
sh docker-shell.sh
ordocker-shell.bat
for windows
- To run development API service run
uvicorn api.service:app --host 0.0.0.0 --port 9000
from the docker shell - Test the API service by going to
http://localhost:9000/
- Open
api/service.py
in your editor - Add the following code at the end of the file:
@app.get("/square_root/")
async def square_root(x: float = 1, y: float = 2):
z = x**2 + y**2
return z**0.5
- Go to
http://localhost:9000/square_root/
- Do you see the square root computed by a python function displayed in the web browser?
- Go to
http://localhost:9000/square_root/?x=2&y=10
adding parameters to your url - Do you see the new results?
- Run
docker container ls
- Stop any container that is running
- Run
docker system prune
- Run
docker image ls