Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/fabohax/todo
Minimal To-Do App
https://github.com/fabohax/todo
json nextjs todo
Last synced: 17 days ago
JSON representation
Minimal To-Do App
- Host: GitHub
- URL: https://github.com/fabohax/todo
- Owner: fabohax
- Created: 2025-01-05T08:49:49.000Z (about 1 month ago)
- Default Branch: main
- Last Pushed: 2025-01-17T02:05:37.000Z (23 days ago)
- Last Synced: 2025-01-17T02:29:41.128Z (23 days ago)
- Topics: json, nextjs, todo
- Language: TypeScript
- Homepage: https://mitodo.vercel.app/
- Size: 314 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Minimal TODO App
A simple and minimalistic TODO application built with **Next.js** and **TypeScript**. The app allows users to add tasks, mark them as completed, undo completed tasks, and delete tasks. Completed tasks are shown in a separate list. All tasks are persisted in a local `tasks.json` file.
## Features
- **Add Tasks**: Input tasks and add them to the list.
- **Mark as Completed**: Move tasks to a "Completed" list.
- **Undo Completed**: Move tasks back to the pending list.
- **Delete Tasks**: Remove tasks from either list.
- **Persistent Storage**: Tasks are saved locally in `tasks.json`.
- **Exportable Static App**: Package the app as a standalone static site for local use.
## Technologies Used
- [Next.js](https://nextjs.org/) (React Framework)
- TypeScript (for type safety)
- Tailwind CSS (for styling)
- Node.js (`fs` module for file handling)
## Installation
1. Clone the repository:
```bash
git clone https://github.com/fabohax/todo.git
cd todo
```
2. Install dependencies:
```bash
npm install
```
3. Run the development server:
```bash
npm run dev
```
4. Open your browser and navigate to:
```
http://localhost:3000
```
## Export as a Static App
You can export this app as a fully static application that can run locally without a server.
### Steps to Export
1. Build and Export the App:
Run the following commands to build the app and export it as static files:
```bash
npm run build
```
This will generate an `out` directory in the root of your project, containing all the static files.
2. Open the Exported App:
- Navigate to the `out` directory:
```bash
cd out
```
- Open the `index.html` file in your browser to use the app locally.
## How It Works
1. **Add Tasks**:
- Enter a task in the input field and press the `+` button or hit `Enter`.
- The task appears in the "Pending Tasks" list.
2. **Mark as Completed**:
- Click the "Complete" button next to a task.
- The task moves to the "Completed Tasks" list.
3. **Undo Completed Tasks**:
- Click the "Undo" button next to a completed task.
- The task moves back to the "Pending Tasks" list.
4. **Delete Tasks**:
- Click the "Delete" button next to a task to remove it permanently.
5. **Persistent Storage**:
- Tasks are saved in a `tasks.json` file.
- The app reads this file when it starts to reload tasks.
6. **Static Export**:
- The app can be exported as static files for offline or local use.
---
## Future Improvements
- Add due dates and priority levels for tasks.
- Implement search and filtering functionality.
## License
This project is open-source.