Visual Studio Code

Extensiones
Prettier Code formatter
Using Command Palette(CMD/CTRL + Shit + p)
1- CMD + Shift + P Format Document
2- Select the text you want Prettify
3- CMD + Shift + P FOrmat Selection

Code Runner
To run code
a. Use shortcut Ctrol + Al + N
b. Or press F1 and then select/type Run Code.
c. Or right click the text Editor and then click Run Code
d. Or click Run Code button in editor title menú
e. Or click Run COde button in context menú of file explorer
To stop the running code:
a. Use shortcut Ctrol + Alt + M
b. Or press F1 and then select/type Stop Code Run
c. Or right click the output Channel and then click Stop Code Run in context menu

Prettier ESLint
Running Formatter
Once. Installed, open a JavaScript. Press CTRL + CMD + P (macOS) or CTRL + Shift
+ P (Windows/Linux) to format a file or a selection of code.
You can enable the Format on Save setting to avoid entering the command all the time.
Default Formatter
a) Open the file you want to format
b) Press CTROL + Shift + P (Windows/linux) or CMD + Shift + P (macOS) to
open the command palette
c) Start typing Format Document With and select it
d) Choose the bottom item Configure Default Formatter
e) Choose Prettier ESLint
Rainbow Brackets
Provide rainbow colors for the round brackets, the square brackets and the squiggly
brackets. This is particularly useful for Lisp or Clojure programmers, and of course,
JavaScript, and other programmers.
The isolated right bracket will be highlighted in red.
Proporcione los colores del arco iris para los corchetes redondos, los corchetes y los
corchetes ondulados. Esto es particularmente útil para programadores Lisp o Clojure y,
por supuesto, JavaScript y otros programadores.
El corchete derecho aislado se resaltará en rojo.
Install
Open up VS Code and hit F1 and type ext select install Extension and type rainbow –
Brackets hit enter and reload window to enable

Docker
CTRL + Shift + P (Windows/linux)
Shift + Command + M (Mac)

Generating Docker files

i. Opening the Command Palette F1 and using Docker: Add Docker Files to
Workspace command.
Git Graph
Features
 Git Graph View:
o Display:

 Local & Remote Branches

 Local Refs: Heads, Tags & Remotes
 Uncommitted Changes
o Perform Git Actions (available by right clicking on a commit / branch /
tag):
 Create, Checkout, Delete, Fetch, Merge, Pull, Push, Rebase,
Rename & Reset Branches
 Add, Delete & Push Tags
 Checkout, Cherry Pick, Drop, Merge & Revert Commits
 Clean, Reset & Stash Uncommitted Changes
 Apply, Create Branch From, Drop & Pop Stashes
  View annotated tag details (name, email, date and message)
 Copy commit hashes, and branch, stash & tag names to the
clipboard
o View commit details and file changes by clicking on a commit. On the
Commit Details View you can:
 View the Visual Studio Code Diff of any file change by clicking
on it.
 Open the current version of any file that was affected in the
commit.
 Copy the path of any file that was affected in the commit to the
clipboard.
 Click on any HTTP/HTTPS url in the commit body to open it in
your default web browser.
o Compare any two commits by clicking on a commit, and then
CTRL/CMD clicking on another commit. On the Commit Comparison
View you can:
 View the Visual Studio Code Diff of any file change between the
selected commits by clicking on it.
 Open the current version of any file that was affected between the
selected commits.
 Copy the path of any file that was affected between the selected
commits to the clipboard.
o Code Review - Keep track of which files you have reviewed in the
Commit Details & Comparison Views.
 Code Review's can be performed on any commit, or between any
two commits (not on Uncommitted Changes).
 When a Code Review is started, all files needing to be reviewed
are bolded. When you view the diff / open a file, it will then be
un-bolded.
 Code Reviews persist across Visual Studio Code sessions. They
are automatically closed after 90 days of inactivity.
o View uncommitted changes, and compare the uncommitted changes with
any commit.
o Hover over any commit vertex on the graph to see a tooltip indicating:
 Whether the commit is included in the HEAD.
 Which branches, tags and stashes include the commit.
o Filter the branches shown in Git Graph using the 'Branches' dropdown
menu. The options for filtering the branches are:
 Show All branches
 Select one or more branches to be viewed
 Select from a user predefined array of custom glob patterns (by
setting git-graph.customBranchGlobPatterns)
o Fetch from Remote(s) (available on the top control bar)
o Find Widget allows you to quickly find one or more commits containing
a specific phrase (in the commit message / date / author / hash, branch or
tag names).
o Repository Settings Widget:

 Allows you to view, add, edit, delete, fetch & prune remotes of
the repository.
 Configure "Issue Linking" - Converts issue numbers in commit
messages into hyperlinks, that open the issue in your issue
tracking system.
 Configure "Pull Request Creation" - Automates the opening and
pre-filling of a Pull Request form, directly from a branches
context menu.
 Support for the publicly hosted Bitbucket, GitHub and
GitLab Pull Request providers is built-in.
 Custom Pull Request providers can be configured using
the Extension Setting git-
graph.customPullRequestProviders (e.g. for use with
privately hosted Pull Request providers). Information on
how to configure custom providers is available here.
 Export your Git Graph Repository Configuration to a file that can
be committed in the repository. It allows others working in the
same repository to automatically use the same Git Graph
configuration.
o Keyboard Shortcuts (available in the Git Graph View):
 CTRL/CMD + F: Open the Find Widget.
 CTRL/CMD + H: Scrolls the Git Graph View to be centered on
the commit referenced by HEAD.
 CTRL/CMD + R: Refresh the Git Graph View.
 CTRL/CMD + S: Scrolls the Git Graph View to the first (or next)
stash in the loaded commits.
  CTRL/CMD + SHIFT + S: Scrolls the Git Graph View to the last
(or previous) stash in the loaded commits.
 When the Commit Details View is open on a commit:
 Up / Down: The Commit Details View will be opened on
the commit directly above or below it on the Git Graph
View.
 CTRL/CMD + Up / CTRL/CMD + Down: The Commit
Details View will be opened on its child or parent commit
on the same branch.
 If the Shift Key is also pressed (i.e. CTRL/CMD +
SHIFT + Up / CTRL/CMD + SHIFT + Down),
when branches or merges are encountered the
alternative branch is followed.
 Enter: If a dialog is open, pressing enter submits the dialog,
taking the primary (left) action.
 Escape: Closes the active dialog, context menu or the Commit
Details View.
o Resize the width of each column, and show/hide the Date, Author &
Commit columns.
o Common Emoji Shortcodes are automatically replaced with the
corresponding emoji in commit messages (including all gitmoji). Custom
Emoji Shortcode mappings can be defined in git-
graph.customEmojiShortcodeMappings.
 A broad range of configurable settings (e.g. graph style, branch colours, and
more...). See the 'Extension Settings' section below for more information.
 "Git Graph" launch button in the Status Bar
 "Git Graph: View Git Graph" launch command in the Command Palette

GitLens — Git supercharged

Live server
Shortcuts to Start/Stop Server
[NOTE: In case if you don't have any .html or .htm file in your workspace then you
have to follow method no 4 & 5 to start server.]
1. Open a project and click to Go Live from the status bar to turn the server on/off.
2. Right click on a HTML file from Explorer Window and click on Open with Live
Server.
 3. Open a HTML file and right-click on the editor and click on Open with Live
Server.
4. Hit (alt+L, alt+O) to Open the Server and (alt+L, alt+C) to Stop the server (You
can change the shortcut form keybinding). [On MAC, cmd+L,
cmd+O and cmd+L, cmd+C]
5. Open the Command Pallete by pressing F1 or ctrl+shift+P and type Live Server:
Open With Live Server to start a server or type Live Server: Stop Live Server to
stop a server.
Material icon Theme
Lucy
Monokai pro
Polacode : para captura de pantalla
Dobri Next - Themes and Icons : cambiar temas
Dart
Vim para navegar rápido en el código
Enter multi-cursor mode by:
 On OSX, cmd-d. On Windows, ctrl-d.
 gb, a new shortcut we added which is equivalent to cmd-d (OSX) or ctrl-
d (Windows). It adds another cursor at the next word that matches the
word the cursor is currently on.
 Running "Add Cursor Above/Below" or the shortcut on any platform.

Kite AutoComplete AI Code: Python, Java, Go, PHP, C/C#/C++, Javascript,

HTML/CSS, Typescript, React, Ruby, Scala, Kotlin, Bash, Vue, React