OpenAI
, Beautiful DND
을 이용해 Next.js 13 App Router
로 구현한 TODO 앱
A comprehensive to-do board application built with modern web technologies.
generateSummary/route.ts
: Handles the route for generating summaries.
globals.css
: Contains global styles for the application.
layout.tsx
: Defines the main layout structure of the application.page.tsx
: Represents the main page component.
Board.tsx
: Represents the main board where tasks are displayed.Column.tsx
: Represents individual columns on the board.Footer.tsx
: Component for the footer section.Header.tsx
: Component for the header section.Modal.tsx
: A generic modal component.TaskTypeRadioGroup.tsx
: A radio group component to select task types.TodoCard.tsx
: Represents individual to-do cards on the board.
fetchSuggestion.ts
: Fetches suggestions.formatTodosForAI.ts
: Formats to-do items for AI processing.getTodosGroupedByColumn.ts
: Groups to-do items by their respective columns.getUrl.ts
: Utility to get URLs.uploadImage.ts
: Handles image uploads.
BoardStore.ts
: Manages the state of the board.ModalStore.ts
: Manages the state of modals.
This project provides a structured way to manage and visualize tasks on a board, with various components and utilities to enhance the user experience. The application is modular, with clear separation of concerns, making it scalable and maintainable.
📦 soom-todo-board
├─ app
│ ├─ api
│ │ └─ generateSummary
│ │ └─ route.ts
│ ├─ favicon.ico
│ ├─ globals.css
│ ├─ layout.tsx
│ └─ page.tsx
├─ appwrite.ts
├─ assets
│ └─ soom_todo_logo.png
├─ components
│ ├─ Board.tsx
│ ├─ Column.tsx
│ ├─ Footer.tsx
│ ├─ Header.tsx
│ ├─ Modal.tsx
│ ├─ TaskTypeRadioGroup.tsx
│ └─ TodoCard.tsx
├─ lib
│ ├─ fetchSuggestion.ts
│ ├─ formatTodosForAI.ts
│ ├─ getTodosGroupedByColumn.ts
│ ├─ getUrl.ts
│ └─ uploadImage.ts
├─ openai.ts
├─ store
│ ├─ BoardStore.ts
│ └─ ModalStore.ts
└─ typings.d.ts