{"id":51160994,"url":"https://github.com/happyloa/next-todolist","last_synced_at":"2026-06-26T13:30:53.748Z","repository":{"id":330697549,"uuid":"850769042","full_name":"happyloa/next-todolist","owner":"happyloa","description":"以 Next.js 16 來重構的六角學院 Vue 3 To-Do List API 串接練習作業","archived":false,"fork":false,"pushed_at":"2026-04-20T04:54:55.000Z","size":401,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2026-04-20T06:35:13.063Z","etag":null,"topics":["authentication","cssmodules-react","javascript","jsx","jwt","nextjs16","sweetalert2"],"latest_commit_sha":null,"homepage":"https://next-todolist-eight.vercel.app","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/happyloa.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2024-09-01T18:14:33.000Z","updated_at":"2026-04-20T06:24:52.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/happyloa/next-todolist","commit_stats":null,"previous_names":["happyloa/next-todolist"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/happyloa/next-todolist","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/happyloa%2Fnext-todolist","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/happyloa%2Fnext-todolist/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/happyloa%2Fnext-todolist/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/happyloa%2Fnext-todolist/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/happyloa","download_url":"https://codeload.github.com/happyloa/next-todolist/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/happyloa%2Fnext-todolist/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34819597,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-26T02:00:06.560Z","response_time":106,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["authentication","cssmodules-react","javascript","jsx","jwt","nextjs16","sweetalert2"],"created_at":"2026-06-26T13:30:53.261Z","updated_at":"2026-06-26T13:30:53.743Z","avatar_url":"https://github.com/happyloa.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"![](https://i.imgur.com/0wgSHAE.png)\n\n# 六角 Todolist API 重構為 Next.js 16\n\n此專案為六角學院 2024 Vue 前端新手營最終挑戰之成品，經由 Antigravity AI 重構並優化架構為 Next.js 16 最佳實踐版本。\n\n- [線上部署連結](https://next-todolist.worksbyaaron.com/login)\n- [設計稿](https://www.figma.com/design/MFSk8P5jmmC2ns9V9YeCzM/TodoList?node-id=0-1\u0026t=hgswJMZPd4ttA8R8-0)\n- [API 文件](https://todolist-api.hexschool.io/doc/#/)\n- [完整過程錄影](https://www.youtube.com/watch?v=w0xcsgtnoFA)\n\n## 重構重點 (Next.js 16 Best Practices)\n\n- **目錄結構優化**：所有原始碼皆移至 `src` 目錄，落實邏輯與設定分離。\n- **命名規範化**：元件與檔案統一採用 `kebab-case.jsx` 命名規範。\n- **樣式管理整合**：將卷軸與全域樣式整合至 `globals.css`。\n- **安全漏洞修復**：已將 Next.js 升級至 16.2.4，解決已知的高風險安全漏洞。\n\n## 使用技術\n\n- [Next.js 16](https://nextjs.org/)（React 19，加強版 React 框架）\n\n## 開發環境設置\n\n建議使用 [VSCode](https://code.visualstudio.com/) 搭配 [ES7+ React/Redux/React-Native snippets](https://marketplace.visualstudio.com/items?itemName=dsznajder.es7-react-js-snippets)\n\n- Node.js 20.9 以上版本（Next.js 16.2 需符合的新最低版本要求）\n\n## 快速開始\n\n**專案設置（Project setup）**\n\n將專案複製到本地端\n\n```sh\n$ git clone https://github.com/happyloa/next-todolist.git\n```\n\n套件安裝\n\n```sh\n$ cd next-todolist\n$ npm install\n```\n\n**執行專案（Start the server）**\n\n```sh\n$ npm run dev\n```\n\n在瀏覽器上輸入\n\n```\nhttp://localhost:3000/\n```\n\n即可在本地端預覽專案\n\n## 專案結構 (src)\n\n位於 `src` 目錄下：\n\n### 頁面路徑 (App Router)\n\n位於 `src/app`\n\n```\nsrc/app\n├── (auth)\n│   ├── login/page.jsx                   豋入頁面（/login）\n│   └── register/page.jsx                註冊頁面（/register）\n├── todos/page.jsx                       待辦事項清單列表頁面（/todos）\n├── favicon.ico                          網站圖示\n├── globals.css                          網站整體樣式（包含卷軸樣式）\n└── layout.jsx                           網站整體架構設定，包含 Google Fonts 與 Metadata\n```\n\n### 元件檔案 (Components)\n\n位於 `src/components`\n\n```\nsrc/components\n├── forms\n│   ├── login-form.jsx                   登入表單元件\n│   ├── register-form.jsx                註冊表單元件\n│   └── form-style.module.css            表單共用樣式\n├── todos\n│   ├── todo-input.jsx                   新增待辦事項 input\n│   ├── todo-list-content.jsx            待辦清單主容器\n│   ├── todo-list-item.jsx               待辦事項列表項\n│   └── todo-no-item.jsx                 無事項時的裝飾元件\n├── logo-and-deco-image.jsx              頁面裝飾圖片元件\n└── logo-and-deco-image.module.css       裝飾元件樣式\n```\n\n### 工具與邏輯 (Lib)\n\n位於 `src/lib`\n\n```\nsrc/lib\n├── api.js                               API 請求封裝 (Fetch API)\n├── utils.js                             通用工具函式 (Cookie 管理等)\n└── show-alert.js                        自定義 Sweet Alert 2 提示工具\n```\n\n### 其他\n\n- `src/proxy.js`: 路徑守衛與認證邏輯 (Middleware)\n\n## 使用的套件 \u0026 工具\n\n- [Next.js 16.2.4](https://nextjs.org/) with [React 19.2.5](https://react.dev/)\n- [sweetalert2 11.26.24](https://sweetalert2.github.io/)\n- [Antigravity AI](https://google.com) (Restructuring \u0026 Optimization)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhappyloa%2Fnext-todolist","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhappyloa%2Fnext-todolist","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhappyloa%2Fnext-todolist/lists"}