7.8 KiB
Online Booking Application
Cliff Hill's Coding Project
This is a full-stack application simulating an online booking system for conference rooms.
Backend decisions
I decided to push to Python 3.13, because there are always language improvements as they are advanced, some of them help make the code more readable (like the use of pipe syntax for type hinting) others are the improved error messages and better interactive interpreter in 3.13, both of which help with debugging.
The structure I picked for the backend is what I have found from research to be the preferred way to structure the code. When a file gets too large, I split it into multiple files under a subdirectory - like with services, where it simply was unweildly to manage.
Frontend Decisions
I wanted clear, concise separations of concerns whenever possible. I believe that components should be separated out and then pages should combine whatever components they have. I believe that tests should be made, but not directly in the paths of the code, cluttering up the directories. The more minimal I can make things, the better because there is less maintenence required then.
Security concerns
There is no login or security in place with this project. However if set up with zero trust, an example scenario could use OpenID or similar login security, encrypted JWTs, secure connections could be established to the database as well as all traffic being moved to https rather than http, locking everything down to ensure that those who communicate with any part of this system are authenticated and have only the access that they are authorized. Each endpoint would need to be able to check that the user is authenticated and has a valid token that has not expired in order to be used.
There already is several pieces for helping secure the application on the backend, using the HyperModern Python cookiecutter and the tools it brings into play, however additional systems could be tied into github to help check things further (like New Relic).
Typically, the database username/password/etc would not be stored in the repo but in a secrets component and loaded separately. This was bypassed this time as that was outside of the scope of this project and was additional overhead to work with.
AI Use
I used AI to stub out a couple of files:
- The backend/Dockerfile and frontend/Dockerfile - to speed up the process of getting docker loaded efficiently for the project.
- The compose.yml file - getting the different images gathered together quickly.
- The compose.dev.yml file - used to get a further understanding of how to hook up an extension to the previous file.
- The mermaid diagrams used in this file.
- I have the CodeGPT plugin in VSCode, and it has helped with docstrings, logging messages, and sometimes reducing the time it takes me to write out the code.
- I used AI to rapidly set up tests for each users component (router, service), then adapted it to the others independently. I believe AI is great for getting reasonable tests written quickly, and then I simply refined it, and replicated the kinds of tests across the different components.
- I was experimenting with some AI edits for debugging the tests.
- My frontend skills are less polished than my backend skills. I've been using AI along the lines of how I would use StackOverflow, answering questions to help me get the code written.
- I used AI to help clean up and better structure the CSS for the frontend project, as well as get some code documentation in place.
Running for production
The standard docker compose file is used to set up the project in the production environment, and can be run from the following command:
docker compose up
In this mode, only one port is exposed in docker - the port 3000, which is the frontend. Postgres and the backend ports are hidden.
Local running
There is an alternative compose file specifically designed for running this project locally which allows for real-time editing and updating of either the frontend or backend components. The command ro tun everything locally is:
docker compose -f compose.dev.yml up
This compose file extends the standard compose file, adding in the necessary pieces to make the application usable in a local dev environment. In this configuration, the frontend is accessable from port 3000 like normal, the backend is accessable from port 8000, and postgres DB from 5432. The way this is set up, that command can easily be run in a separate terminal window during development for rapid testing of the piece(s) being worked on. Logging is at Debug level, and SQLAlchemy is set to echo mode, so queries are also logged. Realtime changes are reflected in the application as the code is run, and commands can be run locally from your terminal (like alembic) without needing to shell into the docker image.
For development builds, running "pre-commit install" inside the backend folder will install the pre-commit components for ensuring the code is good and clean before it gets commited to the repo.
The .env.sample can be copied to .env as well in order to get basic environment variables configured. As this is a system that usually has no external means to reach the database (in the production environment) I have left the actual username/password/etc for the database intact in the files in the repo.
Testing
The project was implemented with testing in the forefront.
Backend
Tests can be run from the nox command in the root backend directory. This will validate the backend with a wide range of tools, to ensure that everything is correct.
Code coverage was lowered to 90 percent because 100 percent was not required for this demo, and some pieces were proving too painful to get tested right and would have taken additional time to finish. As it wasn't mandated that everything is tested, I left those parts alone.
Frontend
Tests can be run from yarn run jest in the frontend root directory. This validates that the components and pages work as intended.
Further improvements
Integration testing, and end-to-end tests really would make this robust. Having all of the tests run in CICD before allowing code to be merged/commited to the main branch would be a mechanism to help ensure code quality. I would have set up the github project to have "feature branches" be made, to add whatever feature that a work item/issue had, and then Peer Reviews - typically set up with 2 peers reviewing 1 PR and approving it, aswell as all CICD checks/tests needing to pass before allowing the branch to be merged.
I would have templates in place for creating a PR, with a set of instructions that would give the "definition of done" - a checklist that would need to be completed before the issue could be marked as completed and a PR could then be reviewed.
Diagrams
Docker Compose Components:
graph TD
subgraph Docker_Network
B[Frontend] -->|HTTP/REST: Port 8000| C[Backend]
C -->|SQL: Port 5432| D[PostgreSQL]
end
A[World] -->|HTTP: Port 3000| B
Backend Request Data Path:
sequenceDiagram
participant Frontend
participant FastAPI_Router as FastAPI Router
participant API_Endpoint as API Endpoint
participant Pydantic_Schema as Pydantic Schema
participant Service_Layer as Service Layer
participant Model
participant Database
Frontend->>FastAPI_Router: HTTP Request
FastAPI_Router->>API_Endpoint: Matches Route
API_Endpoint->>Pydantic_Schema: Validate Input
Pydantic_Schema-->>API_Endpoint: Validated Data
API_Endpoint->>Service_Layer: Pass Validated Data
Service_Layer->>Model: Apply Business Logic
Model->>Database: Perform DB Operations
Database-->>Model: Return Query Result
Model-->>Service_Layer: Return Processed Data
Service_Layer-->>API_Endpoint: Return Response Data
API_Endpoint-->>Frontend: HTTP Response