Beyond Formatting & Linting: Adopting a Culture of Excellence with Biome
Web development world is crazy to say the least, toolings needed here can sometimes feel like a necessary evil—a complex web of configurations and plugins to wrestle with just to maintain order. We've become accustomed to the traditional duo of ESLint and Prettier, but what if there was a better way? What if a tool could be less of a chore and more of a philosophy?
Enter Biome. It's not just another linter or formatter; it's a tremendously powerful tool that the development community has, until recently, left entirely untapped. Biome offers a unified, incredibly fast, and simple approach to code quality. I need a better way to access my notes that I have been jaughting down, hence this article created to serve myself and hopefully others as guide to not just using Biome, but embracing its philosophy of action to elevate our projects (and yours too :)...
The Old World vs. The New Vision
Let's juxtapose the conventional setup with Biome's vision. The traditional approach often involves baton twirling with ESLint, Prettier, and, uhh shall I say?, multitude of plugins, each with its own configuration. It can feel isolating, forcing you to tame a hostile system before you can even write code. This is where Biome steps in to shake things up.
Biome’s proposition is simple but empowering: one tool for linting, formatting, and more, built in Rust for blazing-fast performance (although I am more into Go, but people say these things these days a lot). It’s designed to be a pillar of your project, not a stumbling block. It says, "Fix your code so you can save the world... or at least, save yourself a massive headache."
Getting Started: A Call to Action
Embracing Biome is refreshingly straightforward. There's no elaborate scheme here; the core habits of code quality can be adopted for free. First, add Biome to your project as a development dependency using pnpm. The --save-exact flag ensures that your team stays on the exact same version, providing stability.
pnpm add -D --save-exact @biomejs/biome
With Biome installed, it's time to initialize it. This single command creates a biome.json file, laying the foundation for your new, streamlined workflow.
pnpm biome init
This file is the control center for your entire configuration. It's clean, simple, and ready to go.
Deeds, Not Words: Putting Biome to Work
Biome is fundamentally about being results-oriented. It centers around three key commands:
biome format: Styles your code.
biome lint: Analyzes your code for errors and potential issues.
biome check: A powerful command that does both, plus organizes imports and applies safe fixes.
To make this a core part of your process, add a script to your package.json. This isn't just for convenience; it's a commitment to a culture of excellence in your codebase.
// package.json
"scripts": {
"lint:check": "pnpm biome check --apply ./"
}
Now, running pnpm lint:check will inspect and fix every file in your project. This is your first step toward demanding more from your tooling and yourself.
Editor Integration: Achieving Self-Mastery
To truly integrate Biome into your workflow, you need it in your editor. This isn't about becoming a more efficient cog in the machine; it's about achieving self-mastery over your development environment.
Visual Studio Code
For VS Code users, start by installing the official Biome extension. Then, to make its power seamless, open your .vscode/settings.json and add the following configuration:
// .vscode/settings.json
{
// Set Biome as the default formatter for all relevant files
"editor.defaultFormatter": "biomejs.biome",
"editor.formatOnSave": true,
// Automatically apply fixes and organize imports on save
"editor.codeActionsOnSave": {
"source.fixAll.biome": "explicit",
"source.organizeImports.biome": "explicit"
}
}
Neovim
Neovim Nvchad users, like myself, can attain this similar effect by harnessing the power of the built-in LSP client. The recommended approach is to use nvim-lspconfig, the de facto standard for configuring language servers.
-- lua/config/lspconfig.lua
require("nvchad.configs.lspconfig").defaults()
local nvlsp = require "nvchad.configs.lspconfig"
local servers = { "html", "cssls", "gopls", "svelte", "ts_ls", "biome" }
....
....
Neovim conform plugin just makes it easy
-- lua/configs/conform.lua
local options = {
formatters_by_ft = {
ts = { "biome" },
...
...
With this configuration, every time you save a file, Biome will format it, fix what it can, and organize your imports. These are the core habits that lead to a cleaner, more legible, and more professional codebase.
Reshaping Your Project with Configuration
The biome.json file is where you can truly take control. One of the most powerful features is its built-in support for version control. Biome rightly recognizes that you shouldn't be linting files that are already ignored by Git.
You can enable this with a simple configuration:
// biome.json
{
"vcs": {
"enabled": true,
"clientKind": "git",
"useIgnoreFile": true
}
}
This tells Biome to respect your .gitignore file, preventing it from analyzing node_modules, build outputs, or other ignored files. It’s a smart, communal way of holding ourselves accountable to what matters.
From here, you can customize formatter rules (like semicolon usage) or dive deep into the linter's vast array of rules, which are broken down into logical categories like "correctness" and "complexity." This is how you reshape the tool to fit your project's needs perfectly.
Conclusion
Biome isn't just a tool; it's a statement. It challenges the passive worldview that accepts slow, complicated tooling. It’s a faster, simpler, and more cohesive alternative that lets you focus on what you're building. While it may be a newer tool with fewer plugins than the old guard, it offers something you can hang your hat on: a purposeful, streamlined, and empowering development experience. It's time to steal their thunder and build a better world—or at the very least, a better codebase.