{"id":29618833,"url":"https://github.com/nutanmishra/note-taker-electron-app","last_synced_at":"2026-05-04T13:31:52.056Z","repository":{"id":304172031,"uuid":"1017961720","full_name":"nutanmishra/note-taker-electron-app","owner":"nutanmishra","description":"NoteTaker - A Cross-Platform Desktop Note-Taking App","archived":false,"fork":false,"pushed_at":"2025-07-11T12:38:26.000Z","size":103,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-08-06T11:02:24.469Z","etag":null,"topics":["cross-platform","desktop-app","electron","javascript","node-js","tailwindcss","ui-ux"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/nutanmishra.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","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}},"created_at":"2025-07-11T11:25:24.000Z","updated_at":"2025-07-11T12:38:29.000Z","dependencies_parsed_at":"2025-07-11T15:05:05.257Z","dependency_job_id":"bdfd566c-f6f6-4a1f-a7b7-8052763a3489","html_url":"https://github.com/nutanmishra/note-taker-electron-app","commit_stats":null,"previous_names":["nutanmishra/note-taker-electron-app"],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/nutanmishra/note-taker-electron-app","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nutanmishra%2Fnote-taker-electron-app","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nutanmishra%2Fnote-taker-electron-app/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nutanmishra%2Fnote-taker-electron-app/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nutanmishra%2Fnote-taker-electron-app/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/nutanmishra","download_url":"https://codeload.github.com/nutanmishra/note-taker-electron-app/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nutanmishra%2Fnote-taker-electron-app/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32609439,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-04T10:08:07.713Z","status":"ssl_error","status_checked_at":"2026-05-04T10:08:02.005Z","response_time":58,"last_error":"SSL_read: 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":["cross-platform","desktop-app","electron","javascript","node-js","tailwindcss","ui-ux"],"created_at":"2025-07-21T03:00:34.284Z","updated_at":"2026-05-04T13:31:52.040Z","avatar_url":"https://github.com/nutanmishra.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# NoteTaker - A Cross-Platform Desktop Note-Taking App\n\n![NoteTaker Screenshot](screenshot.png)\n\nNoteTaker is a modern, cross-platform desktop application built with **Electron JS** and styled with **Tailwind CSS**. It allows users to create and delete notes with a sleek, responsive user interface. Notes are stored locally in a JSON file for persistence. This project showcases secure Electron development practices, a beautiful UI, and robust file system integration, making it a strong portfolio piece for showcasing desktop app development and UI/UX design.\n\n## Features\n\n- **Create and Edit Notes**: Add or modify notes with a title, content, and category.\n- **Note Categories**: Assign categories (e.g., Work, Personal) to organize notes.\n- **Search Notes**: Filter notes by title or content using a search bar.\n- **Dark Mode**: Toggle between light and dark themes, with preferences saved locally.\n- **Markdown Support**: Format note content with Markdown, rendered as HTML.\n- **Persistent Storage**: Save notes in a `notes.json` file in the user's data directory.\n- **Responsive UI**: A modern, card-based interface with hover effects and animations.\n- **Secure Design**: Implements Content Security Policy (CSP), `contextIsolation`, and `nodeIntegration: false`.\n- **Cross-Platform**: Runs on Windows, macOS, and Linux.\n- **Debugging Support**: Includes console logging and DevTools for troubleshooting.\n\n## Technologies Used\n\n- **Electron JS**: Framework for cross-platform desktop applications.\n- **Tailwind CSS**: Utility-first CSS framework for a modern, responsive UI.\n- **fs-extra**: Node.js module for file system operations.\n- **JavaScript**: Core logic for renderer and main processes.\n- **HTML/CSS**: Structure and styling for the UI.\n\n## Project Structure\n\n```markdown\nnote-taker/\n├── .github/\n│ └── ISSUE_TEMPLATE/\n│ ├── bug_report.md # Template for bug reports\n│ └── feature_request.md # Template for feature requests\n├── index.html # Main HTML file with UI structure\n├── main.js # Electron main process (app logic, file system, IPC)\n├── preload.js # Preload script for secure IPC communication\n├── renderer.js # Renderer process for UI interactions\n├── styles.css # Custom CSS for animations and hover effects\n├── package.json # Project metadata and dependencies\n├── notes.json # (Generated) Stores notes in userData directory\n├── README.md # Project overview and instructions\n├── CONTRIBUTING.md # Guidelines for contributing\n├── LICENSE # MIT License\n└── .gitignore # Git ignore rules\n```\n\n## Setup Instructions\n\n### Prerequisites\n\n- **Node.js** (v16 or higher): [Download](https://nodejs.org/)\n- **npm**: Included with Node.js\n- A code editor (e.g., VS Code)\n\n### Installation\n\n1.  **Clone the Repository**:\n\n    ```bash\n    git clone https://github.com/nutanmishra/note-taker.git\n    cd note-taker\n    ```\n\n2.  **Install Dependencies**:\n\n    ```bash\n    npm install\n    ```\n\n    This installs Electron, `fs-extra`, and `electron-builder`.\n\n3.  **Run the Application**:\n\n    ```bash\n    npm start\n    ```\n\n    This launches NoteTaker in development mode with DevTools open for debugging.\n\n4.  **Build for Distribution** (Optional):\n    ```bash\n    npm run build\n    ```\n    Generates installers for Windows (NSIS), macOS (DMG), or Linux (AppImage) in the `dist/` folder.\n\n### File System Notes\n\n- Notes are saved in `notes.json` in the Electron `userData` directory:\n  - **Windows**: `C:\\Users\\\u003cYourUser\u003e\\AppData\\Roaming\\note-taker`\n  - **macOS**: `~/Library/Application Support/note-taker`\n  - **Linux**: `~/.config/note-taker`\n- Ensure the app has write permissions in this directory.\n\n## Usage\n\n1.  **Launch the App**:\n    Run `npm start` to open the NoteTaker window.\n\n2.  **Create a Note**:\n\n    - Enter a title and content in the input form.\n    - Click **Save Note**.\n    - The note appears in the grid as a styled card.\n\n3.  **Delete a Note**:\n\n    - Click **Delete** on a note card to remove it from the UI and `notes.json`.\n\n4.  **Debugging**:\n    - Open DevTools (Ctrl+Shift+I or Cmd+Opt+I) to view console logs.\n    - Check logs for messages like “Note saved successfully” or errors.\n    - Inspect `notes.json` to verify saved notes.\n\n## Example `notes.json`\n\n```json\n[\n  {\n    \"title\": \"Meeting Notes\",\n    \"content\": \"Discuss project timeline and deliverables.\",\n    \"id\": 1623456789012\n  }\n]\n```\n\n## Versioning\n\nNoteTaker uses semantic versioning (e.g., `v1.0.0`). Version history is tracked via Git tags and GitHub releases. Check the [Releases](https://github.com/nutanmishra/note-taker/releases) page for details and downloadable installers.\n\n- **Current Version**: v1.0.0\n- **Changelog**:\n  - `v1.0.0`: Initial release with note creation and deletion, Tailwind CSS UI, and secure Electron setup.\n\n## Security Features\n\n- **Content Security Policy (CSP)**:\n  - Restricts scripts and styles to `'self'` and `https://cdn.jsdelivr.net`.\n  - Prevents `unsafe-eval` to mitigate XSS risks.\n- **Context Isolation**: Uses `contextIsolation: true` to isolate renderer and main processes.\n- **Node Integration Disabled**: Sets `nodeIntegration: false` to prevent direct Node.js access.\n- **Preload Script**: Uses `preload.js` with `contextBridge` for secure IPC.\n\n## Contributing\n\nContributions are welcome! Please read the [CONTRIBUTING.md](CONTRIBUTING.md) file for guidelines. Use the [Bug Report](.github/ISSUE_TEMPLATE/bug_report.md) or [Feature Request](.github/ISSUE_TEMPLATE/feature_request.md) templates in the [Issues](https://github.com/nutanmishra/note-taker/issues) tab.\n\n## Troubleshooting\n\n- **Error: `require is not defined`**:\n  - Ensure `main.js` references `preload.js` in `webPreferences.preload`.\n  - Verify `renderer.js` uses `window.electronAPI`.\n- **CSP Warning**:\n  - Confirm the CSP meta tag in `index.html`:\n    ```html\n    \u003cmeta\n      http-equiv=\"Content-Security-Policy\"\n      content=\"default-src 'self'; style-src 'self' https://cdn.jsdelivr.net; script-src 'self';\"\n    /\u003e\n    ```\n- **Notes Not Saving/Deleting**:\n  - Check DevTools console for errors (e.g., “Error saving note”).\n  - Verify write permissions in the `userData` directory.\n  - Delete `notes.json` if corrupted.\n- **UI Issues**:\n  - Ensure Tailwind CSS CDN (`https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css`) is accessible.\n  - Check `styles.css` for custom styles.\n\n## License\n\nThis project is licensed under the MIT License. See the [LICENSE](LICENSE) file for details.\n\n## Author\n\nNutan Mishra  \ndev.nutanmishra@gmail.com\n\n---\n\nBuilt with ❤️ using Electron JS and Tailwind CSS.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnutanmishra%2Fnote-taker-electron-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnutanmishra%2Fnote-taker-electron-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnutanmishra%2Fnote-taker-electron-app/lists"}