todo

The goal of this webapp is to be a very simple example for a 3-tier webapp implementing all "CRUD" operations. This is a pure learning project, where I am trying out different technologies & web development frameworks. Therefore, it is:

1. not configured securely in any fashion.
2. generally full of errors a newbie web developer would make.

Requirements

• The user shall be able to add todo-list items.
• The current todo-list items shall be shown on the / route
• The user shall be able to mark todo-list items as "done"
• The user shall be able to delete todo-list items.

Architecture

┌─────────────────────────────┐
│  Frontend Container         │
│  Framework: React           │
│  Server: nginx              │
│  Serves frontend to user    │
│  Port 80                    │
└─────────────┬───────────────┘
              │
              │ fetch() calls
              ▼
┌─────────────────────────────┐
│  Backend Devcontainer       │
│  Framework: Django          │
│  Exposes REST API           │
│  Port 5001                  │
└─────────────┬───────────────┘
              │
              │ PostgreSQL
              ▼
┌─────────────────────────────┐
│  Database                   │
│  Postgres database          │
│  Exposed on default port    │
└─────────────────────────────┘