Visual Studio Code Tips and Tricks (Part - 01)

Visual Studio Code Shortcut

Visual studio code extensions which I use most

1. Markdown Preview Enhanced
2. Code Spell Checker
3. ES7 React/Redux/GraphQL/React-Native snippets
4. html to JSX
5. :emojisense:
6. Auto Markdown TOC
7. Markdown PDF
8. C#
9. Java Extension Pack
10. Kubernetes
11. YAML
12. Angular Language Service
13. Angular Snippets
14. HTML CSS Support
15. VS Code Live Server
16. ESLint
17. Prettier - Code formatter

Java Spring boot

1. Extension Pack for Java
2. Lombok Annotations Support for VS Code
3. Maven for Java
4. Spring Boot Dashboard
5. Spring Boot Extension Pack
6. Spring Initializr Java Support

VS Code to open starting at the current folder.

code .

How to add a project to a solution using VS Code

Open VS Code terminal and navigate to the directory where you want to create solution folder. Use following commands

dotnet new sln -o MyApiApp

The -o parameter lets you specify the output directory

Navigate to solution direction

Cd .\MyApiApp\

Create new projects under root solution folder

dotnet new console -o MyApiApp.ConsoleApp
dotnet new webapi -o MyApiApp.WebApi
dotnet new classlib -o MyApiApp.Repository
dotnet new xunit -o MyApiApp.Tests

Add projects to solution (use tab to navigate path).

dotnet sln MyApiApp.sln add .\MyApiApp.ConsoleApp\MyApiApp.ConsoleApp.csproj .\MyApiApp.WebApi\MyApiApp.WebApi.csproj .\MyApiApp.Repository\MyApiApp.Repository.csproj .\MyApiApp.Tests\MyApiApp.Tests.csproj

Add project references

dotnet add .\MyApiApp.WebApi\MyApiApp.WebApi.csproj reference .\MyApiApp.Repository\MyApiApp.Repository.csproj
dotnet add .\MyApiApp.ConsoleApp\MyApiApp.ConsoleApp.csproj reference .\MyApiApp.Repository\MyApiApp.Repository.csproj
dotnet add .\MyApiApp.Tests\MyApiApp.Tests.csproj reference .\MyApiApp.WebApi\MyApiApp.WebApi.csproj .\MyApiApp.Repository\MyApiApp.Repository.csproj

Shortcut for Visual Studio Code

VS Code

• Ctrl + Shift + P = will bring you directly to the editor commands
• Alt + Shift + f = Format portion of the code
• Ctrl+Shift+I = Format the entire active file
• Ctrl+K Ctrl+F = Format the selected text
• Ctrl + P = Search file in Visual Studio Code
• Ctrl + Shift + F = Search text in all files

For React.js

• rfc + tab = React function component
• rcc + tab = React class component
• rfce + tab = React function export component
• rafce + tab = React arrow function export component