Daily Task Manager

A full-stack todo application with a Go/Fiber backend and a React/TypeScript frontend. The UI uses a retro pixel-art aesthetic with Press Start 2P and VT323 fonts.

Tech Stack

Backend

• Go 1.26
• Fiber v2 (web framework)
• MongoDB (official Go driver)
• MongoDB Atlas (cloud database)

Frontend

• React 19 + TypeScript
• Vite 8
• Chakra UI v3
• TanStack React Query v5
• next-themes (dark/light mode)

Project Structure

.
├── main.go            # Go server entry point, API routes, MongoDB connection
├── go.mod             # Go module dependencies
├── go.sum
├── air.toml           # Air configuration for Go hot-reload
├── .env               # Environment variables (local development)
├── .env.example       # Example environment file
│
├── client/            # React frontend
│   ├── src/
│   │   ├── App.tsx             # Root component, API base URL
│   │   ├── main.tsx            # Entry point, QueryClient + Provider setup
│   │   ├── index.css
│   │   └── components/
│   │       ├── Navbar.tsx       # Header with dark/light toggle
│   │       ├── TodoForm.tsx     # Input form for new tasks
│   │       ├── TodoList.tsx     # Task list with loading/empty/error states
│   │       ├── TodoItem.tsx     # Individual task row with complete/delete
│   │       └── ui/             # Chakra UI component wrappers
│   ├── index.html
│   ├── package.json
│   ├── vite.config.ts
│   ├── tsconfig.json
│   └── tsconfig.app.json
│
└── tmp/               # Air build output

API Endpoints

Method	Path	Description
GET	/api/todos	List all todos
POST	/api/todos	Create a new todo
PATCH	/api/todos/:id	Mark a todo as completed
DELETE	/api/todos/:id	Delete a todo

Todo Schema

{
  "id": "64a1b2c3d4e5f6a7b8c9d0e1",
  "body": "Buy groceries",
  "completed": false
}

Getting Started

Prerequisites

• Go 1.26 or later
• Node.js 20 or later
• pnpm (or npm/yarn)
• A MongoDB Atlas cluster (or local MongoDB instance)

Setup

1. Clone the repository.

2. Create a .env file in the root directory (use .env.example as a template):

PORT=5000
MONGODB_URI=mongodb+srv://<username>:<password>@<cluster>.mongodb.net/golang_db?appName=Cluster0
ENV=development

3. Start the Go backend:

go run main.go

Or with Air for hot-reload:

air

The server runs on http://localhost:5000.

4. In a separate terminal, start the React frontend:

cd client
pnpm install
pnpm dev

The dev server runs on http://localhost:5173.

Production Build

Build the frontend:

cd client
pnpm build

Set ENV=production in .env. The Go server will serve the built static files from client/dist/ at the root path.

Features

• Create, complete, and delete tasks
• Dark and light mode toggle
• Retro pixel-art UI theme
• Persistent storage via MongoDB Atlas
• Responsive design