A multi-color bookmark plugin for your code
Tags: vscode, productivity, hacktoberfest
Published: 2020-10-21 18:56:53

We, being coder/programmer, spend most of our time in searching a piece of code in the entire codebase, navigating from one file to another tracing the functionality. To solve this problem (only for vscode editor), I have developed a plugin.

[Multi Color Bookmark](https://marketplace.visualstudio.com/items?itemName=DeepakPahawa.flowbookmark&ssr=false#overview)

This is a simple yet powerful vscode plugin to mark code and trace it back whenever required with a lot many functionalities to add, edit, or delete a bookmark or entire flow.

It provides the below feature:

1. Add a bookmark with or without a flow name.
2. Add quick bookmarks by just pressing ctrl+k (windows) or cmd+k (mac)
3. Edit a bookmark like moving to another flow by changing flow name, changing index, or even bookmark name.
4. Edit flow name.
5. All bookmarks are sorted as per their index, makes it easy to navigate through the flow anytime. The index is editable.
6. Clear a bookmark from the sidebar and command both.
7. Clear All bookmarks at once from command only.
8. Multi-color support. one of the 10 different colors will be assigned to each flow.
9. All bookmarks for a flow will use a single color, which makes it easy to identify in the file.
10. A sidebar to navigate through the bookmarks and files.
11. Import all the bookmarks from the Bookmarks plugin


## Add a Bookmark

1. Open a file, click on any line where you want to add bookmark
2. Press ctrl+shift+p (windows) or cmd+shift+p (mac)
3. Type "add bookmark"
4. Select "MCB: Add Bookmark"
5. Enter bookmarkName, FlowName (optional), index(optional)
- Press ctrl+alt+k (windows) or cmd+alt+k (mac)  for key shortcut

![AddBookmark](https://github.com/deepakpahwa19/flow-bookmarks/blob/master/images/addbookmark.gif?raw=true)

## Add a quick Bookmark
1. Open a file, click on any line where you want to add bookmark
2. Press ctrl+k (windows) or cmd+k (mac) to add new bookmark in the last created/updated flow

![AddQuickBookmark](https://github.com/deepakpahwa19/flow-bookmarks/blob/master/images/addQuickBookmark.gif?raw=true)


## Edit a Bookmark or Flow

1. Go to Bookmark sidebar
2. Click on pencil while hovering on any bookmark or any flow
3. Change anything, bookmarkName, FlowName and/or index


![EditBookmark](https://github.com/deepakpahwa19/flow-bookmarks/blob/master/images/RenamingFlowName%26Bookmark.gif?raw=true)

## Clear a Bookmark

1. Select a line which has bookmark
2. Press ctrl+shift+p (windows) or cmd+shift+p (mac) 
3. Type "clear bookmark"
4. Select "MCB: Clear Bookmark"
Or
1. Clear the bookmark from the sidebar by clicking on close icon on the bookmark


![ClearBookmark](https://github.com/deepakpahwa19/flow-bookmarks/blob/master/images/Clear-this-Bookmark-min.gif?raw=true)


## Import from Bookmarks plugin

1. Open settings.json by ctrl+p (windows) or cmd+p (mac)
2. Add this statement in the settings.json.
    "bookmarks.saveBookmarksInProject": true
3. It will create a bookmarks.json file in .vscode folder.
4. Press ctrl+shift+p (windows) or cmd+shift+p (mac) 
5. Type "Import from bookmark"
6. Select "MCB: Import from Bookmarks" and it will create the bookmarks in the sidebar.
7. Edit the bookmarks as required.


![EditBookmark](https://github.com/deepakpahwa19/flow-bookmarks/blob/master/images/ImportFromBookmark.gif?raw=true)

Thank you for reading. I hope it will help you.

Please let me know your thoughts in the comments below. Do you find it useful?