Cover photo

VS Code Setup: Because a Plain Text Editor Is for Mere Mortals

Fabian Owuor

Fabian Owuor

Welcome to the magical world of Visual Studio Code, where bugs fear to tread (mostly) and developers spend more time customizing their editor than actually coding. If you’re looking to pimp your VS Code setup for Solidity, Rust, Laravel, and AI-powered Copilot vibes, this is your ultimate guide. Oh, and we threw in Emmet, the hyperactive sibling of "tab" who makes writing HTML ridiculously fast.


Step 1: Install VS Code Like a Pro

First, download VS Code. If you haven’t already, welcome to the club! We’ve got extensions, themes, and a persistent case of “I’ll fix that tomorrow.”

Once installed, stare at the default blue theme for 30 seconds. Then immediately switch to a custom one because that blue will haunt your dreams.


Step 2: Install Extensions – The Magic Wands for Your Code

Every good sorcerer needs their tools. These are the essential VS Code extensions for your preferred coding rituals.


For Solidity Sorcery

  • Solidity by Juan Blanco:
    Turn your messy .sol files into masterpieces that look like they belong in the Louvre (but really just hold your crypto bugs).
    It’s like Grammarly, but for your smart contracts.

  • Solidity Visual Developer:
    Need to visualize that spaghetti inheritance diagram? Boom, it’s done. Bonus points if it makes your code look less cursed.

  • Hardhat:
    For when you want to actually test your Solidity code. No judgment—we all deploy to mainnet at least once by accident.


For Rust-tastic Code

  • rust-analyzer:
    IntelliSense for Rust. Or, as I like to call it, therapy for Rustaceans.

  • Better TOML:
    Because editing Cargo.toml files without syntax highlighting is a crime against humanity.

  • Crates:
    Keeps your dependencies fresh and conflict-free. Think of it as the “relationship therapist” for your Rust crates.


For Laravel Legends

  • Laravel Blade Snippets:
    Don’t write Blade templates from scratch. Ain’t nobody got time for that.

  • PHP Intelephense:
    It’s like having a personal assistant who reminds you that $variable doesn’t exist in your controller.

  • Laravel Artisan:
    Stop alt-tabbing to your terminal. Run Artisan commands without leaving VS Code like the boss you are.


For GitHub Copilot (The AI Overlord)

  • GitHub Copilot:
    Let an AI write half your code while you nod approvingly like you understand it. Just don’t ask it for life advice—it’s all 0s and 1s to it.


For Emmet, the Hyperactive Sidekick

  • Emmet (built-in):
    Who needs to write <div></div> when you can type div and hit tab? Emmet’s your speed demon for HTML and CSS. It’s like coding on steroids, but without the scandals.


Step 3: General Extensions for Everyone

  • GitLens:
    Let’s you stalk your code’s history and blame Jeff from three sprints ago.

  • Bracket Pair Colorizer 2:
    Turns your parentheses into a rainbow. Is it necessary? No. Is it satisfying? Absolutely.

  • Prettier:
    Formats your code like a neat-freak roommate. Just don’t argue with its choices.


Step 4: Make It Fancy

You deserve a setup that looks as cool as it feels to use. Install:

  • Material Theme: Pick a dark theme and convince yourself it’s better for your eyes.

  • Material Icon Theme: Because who doesn’t want folders with icons that scream “I’m a serious developer”?


Step 5: Configuration – The Developer’s Oath

Your settings.json is where the real magic happens. Copy-paste this and act like you wrote it from scratch:

json
{
  "editor.formatOnSave": true,
  "editor.tabSize": 4,
  "editor.detectIndentation": false,
  "files.autoSave": "onFocusChange",
  "[solidity]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[rust]": {
    "editor.defaultFormatter": "rust-lang.rust-analyzer"
  },
  "[php]": {
    "editor.defaultFormatter": "bmewburn.vscode-intelephense-client"
  },
  "emmet.includeLanguages": {
    "blade": "html"
  }
}


Step 6: Profit

Congratulations, your VS Code is now the Batcave of code editors. You’ve got tools for Solidity, Rust, Laravel, and even Emmet, the Usain Bolt of typing. Go forth and write code that (hopefully) doesn’t crash production.

And there you have it—proof that the only thing Windows truly got right is VS Code. Sarcastic laugh… I mean, really, everything else is just there to test your patience.

VS Code Setup: Because a Plain Text Editor Is for Mere Mortals