<- Blog Home

VSCode tips and tricks

VS Code settings

  • How to edit/access settings.json in vscode - Go to command pallete and search for settings
  • How to edit/change color theme in vscode - Go to command pallete and search for "theme"
  • How to change font in vscode - How to increase font size in vscode - Font settings of editor can be done via settings panel of vscode. To zoom in and out vscode, you need to press control and = sign key (or - key)
  • How to collapse all in vscode - There is a button - in the explorer that you need to press
  • How to close workspace in vscode
  • How to create/delete a new workspace
  • How to export settings in vscode
  • How to edit keybindings.json in vscode
  • How to generate launch.json in vscode
  • How to lint in vscode
  • How to change language in vscode

Emmets - html boilerplate in vscode - https://docs.emmet.io/cheat-sheet/

  • ! to add html5 boilerplate
  • link:css or link:favicon or meta:vp
  • lorem - get paragraph
  • a:blank, a:mail
  • ul>li*5
  • ul>li.box$*5
  • div#id1 and div.c1
  • form:get or form:post
  • select+
  • input:number or input:checkbox or button:submit
  • div+p+span

formatting and linting

  • use prettier extension - right click on document -> format document
  • Keyboard shortcut key - shift+alt+F

searching and replacing

  • Search file names in command palette
  • Search text in files by right clicking on folder

Settings

  • Open user settings - User settings json - settings.json
  • Open Workspace settings json - custom-workspace.json
  • Open Default keyboard shortcuts - built-in JSON - can't be edited
  • Open keyboard shortcuts - Keybindings settings json - keybindings.json
  • Configure user snippets - We can have global snippet JSON file or separate JSON file for each language
  • You can also insert snippet using "insert snippet command"

Keyboard shortcuts

  • Navigation on windows - Alt + ← ... navigate back and Alt + → ... navigate forward
  • Navigation on Mac - Ctrl + - ... navigate back and Ctrl + Shift + - ... navigate forward

Top extensions for vs code

  • Python
  • Jupyter
  • C/C++
  • Live Server
  • Eslint
  • IntelliCode
  • Language support for Java and debugger for Java, Maven for Java, Test Runner for Java, Extension pack for Java
  • Docker
  • C#
  • gitlens
  • Remote WSL
  • Code Runner
  • Remote containers
  • Remote SSH
  • HTML CSS Support
  • Live share
  • JavaScript (ES6) code snippets
  • YAML
  • go
  • dart
  • tabnine
  • Snippets for react - ES7+ React/Redux/React-Native snippets - https://github.com/chillios-ts/vscode-react-javascript-snippets/blob/HEAD/docs/Snippets.md
  • Angular - Angular Language Service
  • Markdownlint
  • xml tools
  • Auto import
  • Vue3 Snippets
  • Rest client
  • TODO highlight
  • React Native tools

GUI and Editing and extensions

  • How to install extension in vscode

  • extension to know who wrote the code in vscode

  • How to hide explorer in vscode

  • How to auto format in vscode

  • How to indent multiple lines in vscode

  • How to fix indentation in vscode

  • How to format on save in vscode

  • How to highlight same words in vscode

  • How to go back in vscode - How to go back to previous file in vscode

  • How to format json in vscode

  • How to go to definition in vscode

  • How to format code in vscode

  • How to fold code in vscode

  • How to auto indent in vscode

  • How to open html in browser in vscode

  • How to add include path in vscode

  • How to add snippets in vscode

  • How to sHow hidden files in vscode

  • hex editor in vscode

  • How to go to end of line in vscode - How to jump to end of line in vscode - Use home and end keys.

  • How to jump to line in vscode

  • How to move line up in vscode

  • How to jump to definition in vscode

  • hotkeys in vscode

  • How to bookmark/pin in vscode

  • How to beautify JSON/XML in vscode

  • How to cut and paste line

  • How to add/remove block comment in vscode - How to comment out multiple lines in vscode

  • How to copy line and duplicate line

  • How to compare two files in vscode - How to diff two files in vscode

  • How to enable/disable prettier in vscode

  • How to edit multiple lines in vscode

  • How to exit full screen in vscode

  • How to exit zen mode in vscode

  • How to find a file in vscode

  • How to search text in vscode

  • How to find and replace in vscode

  • How to ignore error in vscode

  • How to move terminal to bottom in vscode

  • How to make snippets in vscode

  • How to move terminal in vscode

  • How to name workspace in vscode

  • How to navigate back in vscode

  • How to open terminal in vscode

  • How to open command palette in vscode

  • How to open file in new tab in vscode

  • How to split code editor

  • How to open multiple folders in vscode

  • How to open file from terminal in vscode

  • How to open file in new window in vscode - disable preview mode

  • How to open multiple files in vscode

  • How to preview markdown in vscode - How to view markdown in vscode

  • How to format yaml in vscode

  • How to preview html in vscode

  • How to prettify json in vscode

  • How to print code in vscode

  • How to replace all in vscode

  • How to search for a file in vscode

  • How to search in all files in vscode

  • How to select multiple words in vscode

  • How to set environment variables in vscode

  • How to trust workspace in vscode

  • How to open terminal in vscode

  • How to change tab size in vscode

  • How to wrap text in vscode

Build, Execution and debugging

  • How to create new project in vscode
  • How to install packages in vscode
  • How to import pandas in vscode
  • How to include library in vscode
  • How to attach debugger in vscode
  • How to add breakpoint in vscode
  • How to build C# in vscode
  • How to build/debug c++ in vscode
  • How to build/debug python
  • How to build project in vscode
  • How to build cmake in vscode
  • How to debug typescript in vscode
  • How to clear terminal in vscode
  • How to stop terminal in vscode

Python in VS Code

  • How to activate venv in vscode
  • How to change python interpreter in vscode
  • How to install python modules in vscode
  • How to install python in vscode
  • connecting to kernel python in vscode
  • How to import numpy in vscode
  • How to pip install in vscode
  • How to run python in vscode
  • How to select python interpreter in vscode

Java in VSCode

  • How to run java in vscode
  • How to compile java in vscode
  • How to create java project in vscode

JavaScript and Typescript in VSCode

  • How to run javascript in vscode
  • How to format json in vscode
  • How to prettify json in vscode
  • How to debug javascript in vscode
  • How to npm in vscode
  • How to node in vscode
  • How to debug node js in vscode
  • How to debug typescript in vscode
  • How to use eslint in vscode
  • react, ts, js snippet extensions

git in VS Code

  • How to create a branch
  • How to accept all incoming changes
  • How to clone repository in vscode
  • How to delete local branch in vscode
  • How to git clone in vscode
  • How to git commit in vscode
  • How to git blame in vscode
  • How to git pull in vscode
  • How to login to github in vscode
  • How to merge branches in vscode
  • How to merge conflicts in vscode - How to resolve conflicts in vscode
  • How to sign into github in vscode
  • How to pull from gitlab in vscode
  • How to push to github in vscode
  • How to pull from github in vscode

Misc

  • bridge to kubernetes in vscode
  • connect to kubernetes pod in vscode
  • kotlin in vscode
  • How to live share in vscode
  • How to make a theme in vscode
  • How to make extension in vscode
  • How to install nuget package in vscode
  • How to publish extension in vscode
  • qt in vscode
  • How to zoom in in vscode
  • How to exit zen mode in vscode
  • scroll to zoom in vscode
  • zoom text only in vscode
  • zsh command not found in vscode

Web development and Automation testing

solutions delivered!!