Welcome

Introduce vsCode interface briefly. Discuss some of my screen reader customizations. How to explore debug console/terminal and terminal tree. Some keys discussed.


settings, cmd palette, file explorer

Review how to change/modify settings from search and the JSON file. Discuss the command palate how it works and searching it.


Typical Coding and Navigating

A typical session of coding using vsCode. Here I outline how I utilize the various techniques for shortcuts, navigation, and picklists to do my job. All this done using a screen reader.

I walk through a recent mod. I use multiple editing groups, multiple points in a single file. Use a basic search and an object/symbol search. Checking for errors. The typescript app is displaying a dialog modal and giving out screen reader help messages.


Outline and brace Navigation

How to navigate large amounts of code use Outline navigation and matching braces navigation. This can be parenthesis, brackets as well. Using the keys ctrl + shift + o and ctrl + shift + backslash.


Split Editor Groups Anchor Selection

Explain how to perform split editing. This is where a file is editing in 2 windows/groups. Explain editor groups and perform a snippet, then block copy a folded code from one group to the newly created snippet code.

Lastly I demonstrate anchor selection, where you drop an anchor selection. Move somewhere else in the code and select to the cursor from the anchor point.

ctrl + backslash to split. ctrl + k ctrl + l to fold as well.

ctrl+k ctrl+b drop anchor, ctrl+k+ctrl+k to select from anchor to cursor.


find replace text selection

How to use the find and replace and what to watch for as a blind coder (behavior). Practices I use when selecting text and pasting code as a blind coder.


New project emmet html doc label inputHtml Emmet label input

Use Emmet to create HTML 5.0 compliant Doc.

Create a div label input from Emmet.

Discuss the great advantages to the blind utilizing Emmet vs typing it all in manually.


combobox

Use Emmet to generate a Select with 3 options. ComboBox.


List items

Use Emmet to generate List with 3 items containing links each.


Emmet Table with Column Row Headings

Use Emmet to create multi column tables with accessibility in mind. Also Row headers are created.


Emmet Table ColSpan Headings

Use Emmet to create group type headers above the other hears. Totally accessible multi-layered tables with headings


Snippet Creation Prep Work

Use Emmet to do the creation beginnings. Prep work prior to putting snippet file.

We change quotes to apostrophes. Add snippet variables in appropriate places with initial values for prompts.


Snippet File creation test

Create a snippet file in the workspace. Then create the initial snippet in the file for testing everything.

Once tested, copy the single input line snippet we created in the previous video.

Then we add outer quotes and commas, and verify test.

Next audio we will make it a multi-line snippet.


Snippet multi input block reusability demoed

I perform the final steps to convert the single line input into a multi line input snippet. I then demo it buy creating 2 snippet blocks with different prompts and colors and borders each.

Next video I will demonstrate how to create snippets in 2 ways and assign keys.


Snippets Inline Choices and variables assigning key

Demo and show how I created a signature snippet with a stopping end point to fill in description.

Show a fun snippet assigned to a key where you choose from a choice list of languages.

I also assign signature snippet to key that automatically imports any selected text when invoked by the hotkey. You can add more if desired from there.



Resources

Here are some resources for you to consider:

YouTube Vs Code Intro Playlist


Microsoft Accessibility Trust Center