matheusallvarenga avatar

vs-code-for-beginners

This skill provides comprehensive guidance for mastering VS Code as a code editor and markdown edito

作者 matheusallvarenga|オープンソース

VS Code for Beginners Skill

Master VS Code for code editing and markdown writing with this comprehensive learning resource.

What's Inside

Reference Files (references/)

  1. vs-code-basics.md - Foundational concepts

    • What VS Code is and isn't
    • Why it's so popular
    • How editors work
    • Core philosophy
  2. interface-guide.md - Complete UI walkthrough

    • Every panel explained
    • File explorer, editor, sidebar
    • Status bar and command palette
    • Customization overview
  3. keyboard-shortcuts.md - Essential shortcuts

    • Most useful shortcuts by frequency
    • macOS commands
    • Customizing shortcuts
    • Practicing efficiency
  4. extensions-guide.md - Recommended extensions

    • What extensions do
    • Essential extensions for your workflow
    • Nice-to-have extensions
    • Managing your setup
  5. markdown-editing.md - Markdown in VS Code

    • Writing markdown effectively
    • Preview features
    • Extensions for markdown
    • Workflows for documentation
  6. terminal-integration.md - VS Code + Warp

    • Integrated terminal basics
    • Using Warp with VS Code
    • Keyboard navigation
    • Pro tips for efficiency
  7. workflows.md - Step-by-step procedures

    • Opening projects
    • Creating files and folders
    • Editing markdown documents
    • Working with code projects
    • Git integration basics
  8. troubleshooting.md - Common issues and fixes

    • Performance problems
    • Extension conflicts
    • Keyboard shortcut issues
    • Terminal problems
    • General troubleshooting

Quick Reference (assets/)

  • keyboard-shortcuts-cheatsheet.md - Quick reference for shortcuts
  • recommended-extensions-list.md - Extensions to install
  • daily-checklist.md - Tips for productive workflows

How to Use This Skill

For Learning Concepts

Want to understand how something works?

  • Start with vs-code-basics.md
  • Read relevant section in interface-guide.md
  • Understand the philosophy

For Practical Help

Want to do something specific?

  • Check quick-reference for quick answers
  • Read step-by-step in workflows.md
  • Follow instructions exactly

For Keyboard Efficiency

Want to work faster?

  • Check keyboard-shortcuts-cheatsheet.md
  • Read keyboard-shortcuts.md for more context
  • Practice until automatic

When Something Goes Wrong

Stuck or confused?

  • Check troubleshooting.md
  • Find your problem
  • Follow the solution

For Markdown Editing

Writing documentation?

  • Read markdown-editing.md
  • Check extensions that help
  • Follow workflows for best practices

Progressive Learning Path

Week 1: Getting Started

  1. Read vs-code-basics.md (understand what it is)
  2. Learn interface-guide.md (tour the UI)
  3. Practice opening files and projects
  4. Customize colors/theme to your preference

Week 2: Efficiency

  1. Read keyboard-shortcuts.md
  2. Practice 3-5 shortcuts daily
  3. Reference keyboard-shortcuts-cheatsheet.md
  4. Notice yourself using shortcuts automatically

Week 3: Extensions

  1. Read extensions-guide.md
  2. Install recommended extensions from list
  3. Explore theme options
  4. Customize based on preferences

Week 4: Markdown

  1. Read markdown-editing.md
  2. Practice writing markdown document
  3. Use preview features
  4. Install helpful extensions

Month 2: Integration

  1. Get comfortable with Warp in terminal-integration.md
  2. Practice switching between editor and terminal
  3. Use Git features in VS Code
  4. Build your ideal workflow

Month 3: Mastery

  1. Customize further based on needs
  2. Optimize for your specific projects
  3. Help teammates with VS Code
  4. Explore advanced features

Quick Start

Never used VS Code?

  1. Read vs-code-basics.md first (20 minutes)
  2. Take tour in interface-guide.md
  3. Start with any file or project

Want keyboard shortcuts?

  1. Read keyboard-shortcuts-cheatsheet.md
  2. Practice 3 shortcuts today
  3. Reference when needed

Setting up extensions?

  1. Read extensions-guide.md
  2. Check recommended-extensions-list.md
  3. Install what matches your workflow

Stuck on something?

  1. Check troubleshooting.md
  2. Find your issue
  3. Follow solution steps

Writing markdown?

  1. Read markdown-editing.md
  2. Practice side-by-side preview
  3. Try recommended extensions

Key Concepts

VS Code vs Cursor vs Other Editors

  • VS Code: General-purpose, massive ecosystem, free
  • Cursor: VS Code with AI built-in (redundant if you have Claude Code)
  • Sublime: Fast but fewer extensions
  • Others: Special purposes

You chose VS Code - right choice! 🎯

Warp Terminal

  • Modern terminal with AI suggestions
  • Integrates with VS Code
  • Much better than default Terminal app
  • Learn it alongside VS Code

Extensions

  • Plugins that add functionality
  • Thousands available
  • Start with essentials, add as needed
  • Can slow down editor if you install too many

Your Specific Setup

This skill is customized for:

  • VS Code as your main editor
  • Warp as your terminal
  • Markdown writing and editing
  • Code projects (with Git integration)
  • Claude Code for AI assistance (via GitHub)

Everything here is relevant to your exact workflow.

Tips for Success

  1. Use Keyboard Shortcuts - They're faster than clicking
  2. One Extension at a Time - Understand what each does
  3. Customize Gradually - Don't change everything at once
  4. Learn Your Workflow - Develop habits and patterns
  5. Practice Daily - Small improvements compound
  6. Read Error Messages - They're usually helpful
  7. Explore Settings - VS Code is highly customizable
  8. Keep It Simple - You don't need every extension

Files in This Skill

vs-code-for-beginners/
├── SKILL.md                              (Skill metadata)
├── README.md                             (This file)
├── references/
│   ├── vs-code-basics.md                (Fundamental concepts)
│   ├── interface-guide.md                (UI walkthrough)
│   ├── keyboard-shortcuts.md             (Shortcuts mastery)
│   ├── extensions-guide.md               (Extension ecosystem)
│   ├── markdown-editing.md               (Writing in VS Code)
│   ├── terminal-integration.md           (VS Code + Warp)
│   ├── workflows.md                      (Step-by-step procedures)
│   └── troubleshooting.md                (Problems and solutions)
└── assets/
    ├── keyboard-shortcuts-cheatsheet.md (Quick reference)
    ├── recommended-extensions-list.md   (Extension recommendations)
    └── daily-checklist.md                (Daily tips)

Getting the Most from This Skill

Ask Questions

Tell me what you're trying to do in VS Code, and I'll guide you to the right section.

Learn Concepts

When you want to understand why something works, read the reference files.

Practice Workflows

Follow the step-by-step instructions in workflows.md exactly.

Build Habits

Use the daily checklist to build productive habits.

Next Steps

  1. Start Learning: Open vs-code-basics.md if you're brand new
  2. Tour the Interface: Follow interface-guide.md with editor open
  3. Learn Shortcuts: Start with keyboard-shortcuts-cheatsheet.md
  4. Install Extensions: Use recommended-extensions-list.md
  5. Practice: Open a project and start working

Remember

VS Code is a tool that adapts to YOU, not the other way around. Start simple, learn gradually, and customize as you discover what helps you work better.

You've got this! 💪