{"id":35319915,"url":"https://github.com/hsiu0308/cloud-sticky-notes","last_synced_at":"2026-04-08T18:01:36.679Z","repository":{"id":325074040,"uuid":"1099621867","full_name":"Hsiu0308/Cloud-Sticky-Notes","owner":"Hsiu0308","description":"A responsive full-stack application for personal notes. Built with Node.js, Express 5, MongoDB, and Google OAuth. Features colorful sticky notes and CRUD functionality.","archived":false,"fork":false,"pushed_at":"2025-11-19T11:29:06.000Z","size":736,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-11-19T13:14:41.073Z","etag":null,"topics":["crud","express","fullstack","mongodb","mongoose","nodejs","oauth2","passport","responsive-design","sticky-notes"],"latest_commit_sha":null,"homepage":"","language":"EJS","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/Hsiu0308.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":"2025-11-19T08:25:07.000Z","updated_at":"2025-11-19T11:29:09.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/Hsiu0308/Cloud-Sticky-Notes","commit_stats":null,"previous_names":["hsiu0308/cloud-sticky-notes"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/Hsiu0308/Cloud-Sticky-Notes","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Hsiu0308%2FCloud-Sticky-Notes","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Hsiu0308%2FCloud-Sticky-Notes/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Hsiu0308%2FCloud-Sticky-Notes/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Hsiu0308%2FCloud-Sticky-Notes/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Hsiu0308","download_url":"https://codeload.github.com/Hsiu0308/Cloud-Sticky-Notes/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Hsiu0308%2FCloud-Sticky-Notes/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31567227,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-08T14:31:17.711Z","status":"ssl_error","status_checked_at":"2026-04-08T14:31:17.202Z","response_time":54,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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":["crud","express","fullstack","mongodb","mongoose","nodejs","oauth2","passport","responsive-design","sticky-notes"],"created_at":"2025-12-30T21:05:37.748Z","updated_at":"2026-04-08T18:01:36.664Z","avatar_url":"https://github.com/Hsiu0308.png","language":"EJS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 📝 Cloud Sticky Notes (雲端便利貼)\n\n\u003e 一個安全、多彩、支援個人與團隊協作的雲端便利貼應用程式。\n\n[![Deploy status](https://img.shields.io/badge/Deployment-Live-success?style=for-the-badge\u0026logo=render)](https://cloud-sticky-notes.onrender.com)\n[![Tech Stack](https://img.shields.io/badge/Stack-MERN-blue?style=for-the-badge)]()\n[![License](https://img.shields.io/badge/License-MIT-green?style=for-the-badge)]()\n\n## 🔗 線上體驗 (Live Demo)\n\n**點擊這裡開始使用：** [https://cloud-sticky-notes.onrender.com](https://cloud-sticky-notes.onrender.com)\n\n_(註：由於使用免費雲端服務，第一次開啟可能需要等待約 30-50 秒喚醒伺服器，請耐心等候。)_\n\n---\n\n## ✨ 功能特色 (Features)\n\n- **🤝 多人協作群組 (New!)**：\n  - 建立專屬群組牆，透過 **通行碼** 邀請朋友加入。\n  - 支援多人同時在同一面牆上張貼便利貼，即時互動。\n  - 自動清理機制：當最後一位成員離開時，群組與資料自動銷毀，不留痕跡。\n- **🎨 多彩便利貼**：支援黃、藍、綠、粉四種顏色，讓牆面更繽紛且易於分類。\n- **📱 完全響應式 (RWD)**：精心設計的介面，在手機、平板、電腦上都能完美操作。\n- **🔐 雙重登入系統**：\n  - **Google 快速登入**：整合 OAuth 2.0，一鍵登入免記憶密碼。\n  - **本地安全註冊**：支援 Email 註冊，密碼經過 bcrypt 加密保護。\n- **⚡️ 完整 CRUD 功能**：\n  - **Create**: 快速新增便利貼，可選擇顏色。\n  - **Read**: 視覺化的便利貼牆面展示，依時間排序。\n  - **Update**: 支援編輯原本的標題、內容與更換顏色。\n  - **Delete**: 刪除前會有確認彈窗，防止誤刪重要記事。\n- **🛡️ 安全性與體驗優化**：\n  - **環境變數保護**：敏感資訊 (API Key, DB URI) 皆透過 `.env` 管理，不外洩。\n  - **404 錯誤頁面**：自訂的可愛錯誤頁面，引導使用者回首頁。\n  - **路由保護**：未登入使用者無法存取個人牆面或操作資料。\n\n---\n\n## 🛠️ 技術堆疊 (Tech Stack)\n\n- **前端 (Frontend)**:\n  - EJS (Embedded JavaScript templates)\n  - Bootstrap 5 (Responsive UI)\n  - Custom CSS (Sticky Note styling \u0026 Animations)\n- **後端 (Backend)**:\n  - Node.js\n  - Express.js (v5.0)\n- **資料庫 (Database)**:\n  - MongoDB Atlas (Cloud Database)\n  - Mongoose ODM\n- **驗證 (Authentication)**:\n  - Passport.js\n  - Passport-Local Strategy\n  - Passport-Google-OAuth20 Strategy\n- **工具 \u0026 部署 (Tools \u0026 DevOps)**:\n  - VS Code, Git\n  - Render (Web Service Hosting)\n\n---\n\n## 📸 畫面截圖 (Screenshots)\n\n|           首頁 (Home)           |          便利貼牆 (Wall)           |\n| :-----------------------------: | :--------------------------------: |\n| ![Home Page](./images/首頁.png) | ![Profile Page](./images/個人.png) |\n\n|   群組大廳 (Group Lobby)    |    群組便利貼牆 (Group Wall)     |\n| :-------------------------: | :------------------------------: |\n| ![Lobby](./images/大廳.png) | ![Group Wall](./images/群組.png) |\n\n|         編輯模式 (Edit)         |\n| :-----------------------------: |\n| ![Edit Mode](./images/編輯.png) |\n\n|            個人手機版 (Mobile)            |          群組手機版 (Mobile)           |\n| :---------------------------------------: | :------------------------------------: |\n| ![Mobile Personal](./images/個人手機.png) | ![Mobile Group](./images/群組手機.png) |\n\n---\n\n## 🚀 本地安裝與執行 (Local Installation)\n\n如果您想在本地端執行此專案，請依照以下步驟：\n\n1.  **Clone 專案**\n\n    ```bash\n    git clone [https://github.com/Hsiu0308/Cloud-Sticky-Notes.git](https://github.com/Hsiu0308/Cloud-Sticky-Notes.git)\n    cd Cloud-Sticky-Notes\n    ```\n\n2.  **安裝依賴套件**\n\n    ```bash\n    npm install\n    ```\n\n3.  **設定環境變數**\n    請在專案根目錄建立一個名為 `.env` 的檔案，並填入以下資訊：\n\n    ```env\n    GOOGLE_CLIENT_ID=您的GoogleClientID\n    GOOGLE_CLIENT_SECRET=您的GoogleClientSecret\n    SESSION_SECRET=您的隨機密鑰(可隨意輸入)\n    MONGODB_URI=mongodb://localhost:27017/GoogleDB\n    ```\n\n4.  **啟動伺服器**\n\n    ```bash\n    npm start\n    ```\n\n    _(或者使用 nodemon index.js)_\n\n5.  **開啟瀏覽器**\n    前往 `http://localhost:8080` 即可看到執行結果。\n\n---\n\n## 👤 Author\n\n**Hensel**\n\n- GitHub: [@Hensel🥸 Hsiu0308](https://github.com/Hsiu0308)\n\n---\n\nMade with ❤️ by Hensel\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhsiu0308%2Fcloud-sticky-notes","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhsiu0308%2Fcloud-sticky-notes","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhsiu0308%2Fcloud-sticky-notes/lists"}