VSCode (Visual Studio Code)

• You may use VSCode to code your Java & Springboot programs in coming weeks!
• Visual Studio Code is a lightweight but powerful source code editor which runs on your desktop and is available for Windows, macOS and Linux.
• If you have programming background and want to use "IntelliJ IDEA" instead of VSCode, it's fine, just an IDE. But I would still recommend you to try VSCode, and feel how lightweight it is.

4.1 Install VSCode from Official Site

• VScode Download - Mac OS 10.11 +

• Be aware of "apple" or "intel" chip
  

• After downloading and install it.

• Move to Application.
  

4.2 Install 'code' shell command (Optional)

• Launch VScode.app, shift+command+p, type "install code" to execute the shell command
  

[Result check] Then, you will find "code" is placed in /usr/local/bin

Next time you want launch the VSCode, just simply type "code ." in terminal (iTerm). (i.e. There is a space between code and .)

4.3 Extensions

• Explorer / Search / Extensions are common functions in VScode. Put it in the menu bar on the left hand side of VSCode. (right click and select)
  

• Extensions in VSCode help it become an integrated IDE with powerful functions, like color themes/ syntax management/ icon setting/ text color for different file types. All of those features enable you to code much more easily in VSCode.
  

You can install all of the extensions below:

• Auto Import
• Auto Rename Tag
• Console Ninja
• ES7 React/Redux/Styled-components snippets
• ESLint
• Language Support for Java™ by Red Hat
• Extension Pack for Java (Install this, the other 4 Java extensions will be installed automatically)
• Maven for Java
• HTML to CSS autocompletion
• JSON Crack
• Debugger for Java
• Project Manager for Java
• Test Runner for Java
• Ayu - file/folder logo
• One Dark Pro - themes (One Dark Pro Darker)
• Spring Initializr Java Support
• Spring Boot Tools
• Spring Boot Dashboard
• Lombok Annotations Support for VS Code
• XML
• YAML
• SQL Beautify
• Dependency Analytics
• Markdown Preview Enhanced
• Prettier - Code formatter

---

4.4 Code Formatter/ settings.json/ key shortcut

Step 1: VSCode general setting - settings.json

• In VSCode, press shift+command+p, type "open settings json" and select "Open Settings(JSON)".
• Overwrite your settings.json by
  settings.json - Windows
  settings.json - MacOS

[Result]

Step 2: VSCode Code Formatter - googlestyle.xml

CodeFormatter helps you auto-format your code to align maven checkstyle/pmd plugin.

• From github laptop-setup, download the googlestyle.xml into the folder ~/.vscode

• In VSCode, shift+command+p, type "open settings json" and select "Open Settings(JSON)".

• As you have downloaded it to ~/.vscode/googlestyle.xml, just update this path to java.format.settings.url
  

• Double Check "lineSplit" to 80 and "comment.line_length" to 200.
  

Step 3: VSCode keyboard shortcut - keybindings.json

• In VSCode, shift+command+p, type "keyboard shortcuts json" & select "Open Keyboard Shortcut(JSON)"

• You can find the setup file for "Keyboard Shortcuts (JSON)" in github
  keybindings.json - MacOS
  keybindings.json - Windows

• Copy the file content to the above keybindings.json file.
  These are the shortcuts that you would frequently use:

  • shift+cmd+f: Auto format the code
  • shift+cmd+o : Organize java Imports, remove unused Imports
  • shift+cmd+k : Restart VSCode

[Result]

• To let the above configurations take effect, you have to restart the VSCode (you can just shift+cmd+k)