Add a new intermediate-level project for managing code snippets. This project helps developers: - Store and organize commonly used code fragments - Search through their snippet collection - Copy snippets to clipboard with syntax highlighting - Categorize and tag snippets for better organization The project teaches important concepts like: - Browser APIs (LocalStorage, Clipboard API) - Search functionality implementation - Data persistence - UI/UX considerationspull/959/head
parent
08b771c863
commit
a1a24a1f05
@ -0,0 +1,45 @@
|
|||||||
|
# Code Snippet Manager
|
||||||
|
|
||||||
|
**Tier:** 2-Intermediate
|
||||||
|
|
||||||
|
A Code Snippet Manager is a practical tool designed for developers to store, organize, and quickly access commonly used code snippets. This application helps developers maintain a personal library of reusable code fragments, making it easier to reference and reuse code across different projects.
|
||||||
|
|
||||||
|
## User Stories
|
||||||
|
|
||||||
|
- [ ] User can create a new code snippet with a title, description, and code content
|
||||||
|
- [ ] User can specify the programming language for syntax highlighting
|
||||||
|
- [ ] User can create custom categories/tags to organize snippets
|
||||||
|
- [ ] User can search through their snippets by title, description, or content
|
||||||
|
- [ ] User can copy snippet content to clipboard with a single click
|
||||||
|
- [ ] User can view snippets in a list or grid layout
|
||||||
|
- [ ] User can edit existing snippets
|
||||||
|
- [ ] User can delete snippets they no longer need
|
||||||
|
- [ ] User can see a preview of how their snippet will look with syntax highlighting
|
||||||
|
- [ ] User's snippets are preserved between sessions using local storage
|
||||||
|
|
||||||
|
## Bonus features
|
||||||
|
|
||||||
|
- [ ] User can export all snippets to a JSON file for backup
|
||||||
|
- [ ] User can import snippets from a JSON file
|
||||||
|
- [ ] User can share snippets via unique URLs
|
||||||
|
- [ ] User can set snippets as public or private
|
||||||
|
- [ ] User can see a history of their most frequently used snippets
|
||||||
|
- [ ] User can create folders to organize snippets hierarchically
|
||||||
|
- [ ] User can set keyboard shortcuts for frequently used snippets
|
||||||
|
- [ ] User can see the character/line count of their snippets
|
||||||
|
- [ ] User can toggle between light and dark themes
|
||||||
|
- [ ] User can authenticate using GitHub to sync snippets across devices
|
||||||
|
|
||||||
|
## Useful links and resources
|
||||||
|
|
||||||
|
- [Local Storage MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage)
|
||||||
|
- [Highlight.js](https://highlightjs.org/) - For syntax highlighting
|
||||||
|
- [Clipboard API](https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API)
|
||||||
|
- [IndexedDB](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API) - For storing larger amounts of data
|
||||||
|
- [GitHub Gist API](https://docs.github.com/en/rest/gists) - For snippet syncing feature
|
||||||
|
|
||||||
|
## Example projects
|
||||||
|
|
||||||
|
- [Bootsnipp - Code Snippet Manager](https://bootsnipp.com/snippets/1nm0V)
|
||||||
|
- [Gist Box](https://app.gistboxapp.com/)
|
||||||
|
- [Snipper](https://snipper.app/) - A commercial code snippet manager
|
||||||
Loading…
Reference in new issue