Getting started

Install DevNotes+, open the panel, and write a note that knows which line of code it is about. Two minutes, no configuration.

Install

DevNotes+ is published to both extension registries, so it installs the same way whichever editor you use.

From inside VS Code

  1. Open the Extensions view with Ctrl+Shift+X (Cmd+Shift+X on macOS).
  2. Search for DevNotes+.
  3. Choose the one published by HibaChaabnia and click Install.
Note

There is more than one extension with a similar name. The identifier you want is HibaChaabnia.devnotes-plus.

From a registry page

From the command line

code --install-extension HibaChaabnia.devnotes-plus

Open a project

DevNotes+ stores notes inside the project they describe, so it needs a workspace folder to work with. Open one with File → Open Folder before you start. If you launch VS Code with no folder open, the DevNotes+ panel will tell you so rather than showing an empty note list.

The first time you create a note in a project, DevNotes+ creates a .devnotes/ folder at the workspace root, along with a .gitignore inside it that ignores everything. That means your notes are private from the very first keystroke — nothing reaches git until you deliberately share a note.

Open the sidebar

Click the DevNotes+ icon in the activity bar — the vertical strip of icons down the side of the window. If you would rather not hunt for it, run DevNotes: Open DevNotes Sidebar from the Command Palette (Ctrl+Shift+P).

Tip

The Notes section starts collapsed the first time you open the panel. Click its header to expand it.

Write your first note

The fastest route is the keyboard shortcut, because it captures the context along with the note.

  1. Open any source file and put your cursor on a line you have an opinion about.
  2. Press Ctrl+Alt+Q (Cmd+Alt+Q on macOS).
  3. Type a title and press Enter.

Because an editor was focused, the note is automatically linked to that file:line. You will see a small note icon appear in the gutter beside the line, and a notes here counter in the status bar. That linkage is the whole point of DevNotes+ — see anchoring notes to code for what it buys you.

You can also right-click in the editor and choose Add DevNote Here, or create an unlinked note with the + New button at the top of the sidebar.

Write the body

Click the body of a card in the sidebar to edit it in place. This is the right mode for a sentence or two.

For anything longer, open the full editor from the card. It is a rich block editor with headings, bold and italic, inline code, bullet, numbered and task lists, tables you can add and remove rows and columns from, code blocks, blockquotes, horizontal rules, clickable links, and images you can paste or drag in. Images are copied into .devnotes/assets/ and referenced from the note, so they travel with the project.

Everything is stored as Markdown underneath. If you would rather write in your own editor, or want to know exactly what lands on disk, read the file format reference.

Where to go next

You now have a working note. The three things most worth learning next, in the order most people need them: