[VSCode]: Settings
05/19/2020
VS Code Tips
Enable code . inside terminal
- Open command pallette with (cmd + shift + P)
- Type in shell command to find Shell Command: Install 'code' command in PATH
Shortcuts
- Navigation- Cmd + shift + E: Open Explorer
- Ctrl + shift + G: Open GitHub GUI
- Cmd + B: Open/close sidebar
- Ctrl + Shift + ->/<- Expand selection
- Creating a new file: Open explorer with cmd + shirt + E. Select folder. Open pallet with cmd + shift + p. Type New file or New folder
- Cmd + J: Open/close bottom navigation panel
- Cmd + `: Open/close terminal & focus
- Cmd + 1: Focus on Editor
- Cmd + 2: Focus on 2nd Editor (or open it)
 
- Moving around- Jumpy: need to set shortcut. Shift + Enter to start jumpy mode. Space bar to exit jumpy mode
- command + d to select other words
- Multi Line Tricks plugin- Cmd + shift + L
 
- Cmd + X to delete the whole line
 
- Shortcuts- type clgto show auto complete forconsole.log
- command pallet: cmd + shift + p. Type Fold level 2to display function names only
 
- type 
Plugins
- Auto Close Tag
- Babel JavaScript
- Bittersweet Theme
- Code Spell Checker
- Color Highlight
- Community Material Theme
- ES7 React/Redux/Graphql Snippets
- ESLint
- Highlight Matching Tag
- Live Server
- Lorem ipsum
- Markdown Preview Enhanced
- Material Icon Theme
- Material Theme
- Material Theme Icons
- Path Intellisense
- Prettier - Code formatter
- pug formatter
- Python
- Rainbow Brackets
- Reactjs code snippets
- Snazzy Operaotr (theme)
- Spirited Away Color Theme
- TODO Highlight
- vscode-styled-components
- Git lens
- Project manager
Setting
To change the setting, open the vs code setting with cmd + , then search for json. Click edit in setting.json under Launch panel.
Enable emmet
JSON
"emmet.includeLanguages": {    "javascript": "javascriptreact"  },Changing colors of terminal
When using snazzy operator theme, undefined keyword doesn't show unless you tweak the terminal color with
JSON
"workbench.colorCustomizations": {    "terminal.ansiBrightBlack": "#b57575"  },Personal setting
JSON
{  "update.mode": "none",  "editor.minimap.enabled": false,  "breadcrumbs.enabled": true,  "workbench.editor.enablePreview": false,  "[markdown]": {    "editor.defaultFormatter": "esbenp.prettier-vscode"  },  "[javascript]": {    "editor.defaultFormatter": "esbenp.prettier-vscode"  },  "workbench.colorCustomizations": {    "terminal.ansiBrightBlack": "#b57575"    // "terminal.background":"#000",    // "terminal.foreground":"#E0E0E0",    // "terminalCursor.background":"#E0E0E0",    // "terminalCursor.foreground":"#E0E0E0",    // "terminal.ansiBlack":"#000000",    // "terminal.ansiBlue":"#6FB3D2",    // "terminal.ansiBrightBlue":"#6FB3D2",    // "terminal.ansiBrightCyan":"#76C7B7",    // "terminal.ansiBrightGreen":"#A1C659",    // "terminal.ansiBrightMagenta":"#D381C3",    // "terminal.ansiBrightRed":"#FB0120",    // "terminal.ansiBrightWhite":"#FFFFFF",    // "terminal.ansiBrightYellow":"#FDA331",    // "terminal.ansiCyan":"#76C7B7",    // "terminal.ansiGreen":"#A1C659",    // "terminal.ansiMagenta":"#D381C3",    // "terminal.ansiRed":"#FB0120",    // "terminal.ansiWhite":"#E0E0E0",    // "terminal.ansiYellow":"#FDA331"  },  "[html]": {    "editor.defaultFormatter": "esbenp.prettier-vscode"  },  "cSpell.userWords": [    "add",    "afterbegin",    "beforeend",    "boxshadow",    "btns",    "btwn",    "captcha",    "cart",    "chmod",    "codepen",    "collapsable",    "component",    "csrf",    "deauthenticate",    "destructured",    "dmin",    "dropdown",    "droppable",    "ellismin",    "elmt",    "emin",    "frontmatter",    "geoip",    "graphiql",    "hacky",    "ingred",    "iphone",    "kakao",    "launchd",    "linkedin",    "mern",    "metastring",    "middlewares",    "minimalistic",    "mkdir",    "mult",    "noopener",    "noreferrer",    "nums",    "originalname",    "page",    "pageview",    "personalizations",    "polyfill",    "predeploy",    "ramenkid",    "recaptcha",    "resave",    "result",    "sendgrid",    "signin",    "signup",    "sitekey",    "staatliches",    "steelblue",    "templating",    "uncategorized",    "uniqid",    "unmount",    "unmounting",    "unsubscription",    "upsert",    "will"  ],  "window.zoomLevel": 1,  "liveServer.settings.donotShowInfoMsg": true,  "terminal.integrated.shell.osx": "/bin/zsh",  "[jsonc]": {    "editor.defaultFormatter": "esbenp.prettier-vscode"  },  "workbench.iconTheme": "material-icon-theme",
  "emmet.includeLanguages": {    "javascript": "javascriptreact"  },  "[json]": {    "editor.defaultFormatter": "esbenp.prettier-vscode"  },  "liveServer.settings.donotVerifyTags": true,  "workbench.colorTheme": "Snazzy Operator",  "javascript.updateImportsOnFileMove.enabled": "always",  "files.associations": {    // "*.ejs": "html"    // "*.md": "mdx"    "*.mdx": "markdown"  }}Secondary vscode setting
JSON
{  "workbench.colorTheme": "Snazzy Operator",  "workbench.colorCustomizations": {    "terminal.ansiBrightBlack": "#b57575"  },  "editor.formatOnSave": true,  "[typescript]": {    "editor.defaultFormatter": "esbenp.prettier-vscode"  },  "[typescriptreact]": {    "editor.defaultFormatter": "esbenp.prettier-vscode"  },  "window.zoomLevel": 0,  "[html]": {    "editor.defaultFormatter": "esbenp.prettier-vscode"  },  "[javascript]": {    "editor.defaultFormatter": "esbenp.prettier-vscode"  },  "workbench.iconTheme": "material-icon-theme",  "[json]": {    "editor.defaultFormatter": "esbenp.prettier-vscode"  },  "editor.tabSize": 2,  "launch": {    "configurations": [],    "compounds": []  }}- [Next.js]: Implementing infinite scroll in Next.js
- [SSH]: Remote SSH to a Raspberry Pi without password (macOS, Linux)