My Minimal and Beautiful VSCode Setup

Summary

In this video, the creator discusses their preferred tools for development work, emphasizing simplicity, functionality, and aesthetics. They share their setup for Visual Studio Code (VS Code) and Warp Terminal, highlighting the use of Caleb Porio's 'Make VS Code Awesome' tutorial for customization. The creator uses the Catppuccin Frappe theme for a uniform look and mentions the Dank Mono font for readability. They also discuss the use of APC Customize UI++ plugin for a cleaner UI and various VS Code extensions that enhance their coding experience, including Tailwind CSS support and Laravel integration. The focus is on optimizing for simplicity, functionality, and beauty.

Takeaways

• 💻 The speaker prioritizes practical, functional, simple, and aesthetically pleasing tools for development work, particularly in their terminal and code editor.
• 🛠️ Caleb Porio's 'Make VS Code Awesome' tutorial is highly recommended for setting up VS Code, with around 80% or more of the speaker's setup influenced by it.
• 🎨 The speaker uses a consistent theme across both Warp terminal and VS Code for a uniform look, currently the 'Catppuccin Frappe' theme.
• 🔠 The 'Dank Mono' font is used in both VS Code and Warp terminal with similar font sizes and line heights for consistency.
• 📝 The 'APC Customize UI+' plugin is essential for customizing the UI of VS Code, allowing for styling similar to a web browser using CSS.
• 🖥️ The speaker has made personal modifications to the APC settings for the background, frame, title bar, and editor styling in VS Code.
• 🌐 The use of 'Catppuccin Frappe' icons is mentioned for a cohesive look across the development environment.
• 📝 The speaker has switched to using 'Super Maven' for AI assistance over 'GitHub Copilot', finding it faster and more accurate.
• 📦 The 'Tall Stack' plugin collection is used for managing Laravel, Livewire, and Tailwind within VS Code.
• 📝 The 'Laravel Pint' plugin is used for formatting Blade files, with automatic formatting on save for adherence to Laravel coding standards.

Q & A

What does the speaker prioritize in their choice of development tools?

The speaker prioritizes practicality, functionality, and aesthetics in their choice of development tools, valuing simplicity and a clean, beautiful look.

Why does the speaker recommend Caleb Porio's 'Make VS Code Awesome' tutorial?

The speaker recommends Caleb Porio's tutorial because it covers a significant portion of the setup they use in their VS Code and terminal, which is beneficial for optimizing the development environment.

What theme does the speaker use to maintain consistency between VS Code and their terminal?

The speaker uses the Catppuccin Frappe theme to maintain a consistent look and feel across both VS Code and their terminal.

What font and settings does the speaker use in their terminal and VS Code?

The speaker uses the Dank Mono font with a similar font size and line height in both their terminal and VS Code, with a slightly larger size in the terminal.

What plugin does the speaker use to customize the appearance of VS Code?

The speaker uses the 'APC Customize UI++' plugin to customize the appearance of VS Code, allowing them to style it with CSS.

What changes has the speaker made to the default settings of the 'APC Customize UI++' plugin?

The speaker has modified the background, frame, title bar, and editor styling of the 'APC Customize UI++' plugin to suit their preferences.

Why did the speaker switch the font for everything in VS Code to Dink Mono?

The speaker switched to Dink Mono for a unified font across all elements in VS Code, which they find aesthetically pleasing and consistent.

What are some of the key settings and plugins mentioned in Caleb Porio's course that the speaker uses?

Key settings and plugins mentioned include having the sidebar on the right, using Command K and B for shortcuts, and the use of the 'Tall Stack' plugin for Laravel, Livewire, and Tailwind.

How does the speaker enhance their code editing experience in VS Code?

The speaker enhances their code editing experience by using settings that increase font size and line spacing when creating code, as well as using plugins like 'Laravel Blade Formatter' and 'Tailwind Fold'.

What AI coding assistance tool has the speaker switched to, and why?

The speaker has switched to 'Super Maven' from GitHub Copilot because they find it faster and more accurate, especially as it takes the entire code repository into account for suggestions.

What is the speaker's approach to optimizing their VS Code setup for both functionality and aesthetics?

The speaker optimizes their VS Code setup by using a consistent theme and font, customizing the UI with plugins like 'APC Customize UI++', and utilizing various plugins and settings to enhance functionality and simplify their workflow.