Visual Studio Code Configuration
We recommend using Visual Studio Code (VS Code) as the main code editor at Terra. It’s lightweight, fast, and highly customizable with a huge library of extensions — perfect for the variety of technologies we use across projects (Astro, WordPress, Vue, Nuxt, PHP, etc).
Also: 👉 if you’re using some cool extension or trick that helps your workflow, share it with the team in Slack! We’re always up for improving our setup. 😄
Indentation Settings
Section titled “Indentation Settings”To ensure consistency across projects, we use 4 spaces for indentation.
You can configure this in VS Code by following these steps:
- Open Code > Preferences > Settings
- Search for
Editor: Tab Size - Set the value to
4 - Make sure “Insert Spaces” is enabled
Recommended Extensions
Section titled “Recommended Extensions”We suggest installing the following extensions to improve your development experience:
| Extension | Purpose | Link |
|---|---|---|
| Better Comments | Highlight different types of comments | 🔗 |
| Auto Close Tag | Automatically closes HTML/XML tags | 🔗 |
| Auto Rename Tag | Renames paired HTML/XML tags simultaneously | 🔗 |
| Prettier - Code formatter | Auto-formats code on save | 🔗 |
| Console Ninja | Helps with console.log management and debugging | 🔗 |
| Astro | Syntax highlighting and language support for Astro | 🔗 |
| Git Blame | Shows git blame information inline | 🔗 |
| Nuxt Extension Pack | Collection of helpful Nuxt.js extensions | 🔗 |
| Nuxtr | Snippets and helpers for Nuxt 3 | 🔗 |
| PHP Intelephense | PHP language server for better autocompletion and linting | 🔗 |
| Vue - Official | Official Vue language tools (recommended for Vue 3) | 🔗 |