VS Code | Visual Stdio Code

# VS Code - Extensions
Prettier - Code formatter (Javascript, HTML, CSS)
Material Icon Theme(Philipp Kief) 
Highlight Matching Tag(vincaslt): Highlights matching closing and opening tags
HTML CSS Support(ecmel): Auto Complete css class in HTML markup | https://prnt.sc/J9i5PsLERdxR
CSS Peek (Pranay Prakash): Click HTML Markup and it link to css class rule in css file | https://prnt.sc/YIFcnZfVR_LN
lucy Theme: vscodethemes.com/e/juliettepretot.lucy-vscode/lucy?language=javascript
Live Server: Do not need to refresh browser for any change
GitLens — Git supercharged: (GitKraken)
Quokka.js: Live JS variable output dey
Code Snippet: snippet-creator (vincentkos)
Auto Rename Tag: Rename tag Atuo
Snipped: Take Screenshot HD

React: ES7+ React/Redux/React-Native snippets  (dsznajder)
VSCode React Refactor: refactor is so easy

PHP Intelephense & PHP IntelliSense: PHP autocomplete and Function Defination move easy, Only for php
Code Runner: PHP er live output dey
phpfmt - PHP formatter

Tailwind CSS IntelliSense (tailwindcss.com)
            ----
            
# Keyboard ShortCuts
Command palette: Ctrl + Shift + P
Search & Open File(Go to file): Ctrl + P
SideBar show/hide: Ctrl+b
Move Line UP/Move Line Down: Alt + ↑ // See from Command Pallet: Ctrl+Shift+P
Setting: Ctrl + ,
Terminal Show/Hide: Ctrl + `
New Terminal: Ctrl + Shift + `
Copy line down: Shift + Alt + ↓ -> Ctrl + d | Add Selection To Next Find Match (Ctrl + d) -> Ctrl + Shift + d
HTML Block Selection: Shift + Alt + →   | <div className="bigBlock">Big Code</div> Select entire Block
Delete line: Ctrl + x
Insert line above: Ctrl + Shift + Enter
Jump to matching brackets: Ctrl + Shift + \
Go to line: Ctrl + G
Starting character of a line: "cursorHome" in shortcut and set it like. Ctrl + Left Arrow | "cursorHomeSelect" set it Ctrl + Shift ←   

# Mouse Wheel Zoom: 
Setting and Search "Mouse Wheel Zoom"

# Adding Code Snippets
# clg -> console.log("") with cursor inside quote
Command Palette(Ctrl + Shift + P) -> Type "Preferences: Configure User Snippets" -> Choose language JavaScript or TypeScript -> https://prnt.sc/KgHHD2_ft1Mv
"Console log with quotes": {
            "prefix": "clg", // Trigger for the snippet
            "body": [
                        "console.log(\"$1\");"
            ],
            "description": "Log to the console with quotes"
},
"React Arrow Function Component Export": {
            "prefix": "rafce",
            "body": [
            "const ${1:${TM_FILENAME_BASE}} = () => {",
            "  return (",
            "    <div>",
            "      ${1:${TM_FILENAME_BASE}}",
            "    </div>",
            "  );",
            "};",
            "",
            "export default ${1:${TM_FILENAME_BASE}};"
            ],
            "description": "rafce: Create a React functional component with export using arrow function"
},

"Node Required": {
            "prefix": "req", // Trigger for the snippet
            "body": [
                        "const $2 = require(\"$1\");"
            ],
            "description": "Node Required method"
},
            ---
            
# Stop being formatting a certain file type--- setting.json ------
"editor.formatOnSave": true,
"[markdown]": {
"editor.formatOnSave": false
}, // https://prnt.sc/6l7SSNw0q9b3
            ----

# Line Number Show/Hide: Install Extension: Settings Cycler (Cody Hoover)
// settings.json: https://prnt.sc/OnHjHR5Gx3Bx
"settings.cycle": [{
    "id": "lineNumbers",
    "values":[
        {
            "editor.lineNumbers": "off",
            "editor.folding": false,
            "editor.glyphMargin": false
        },
        {
            "editor.lineNumbers": "on",
            "editor.folding": true,
            "editor.glyphMargin": true

        }
    ]
}],
Open Keyboard Shortcuts & and Change Shortcut ie. (Ctrl + L) : CTRL + SHIFT + P  //https://prnt.sc/drGcFEsqOAJV