Ahmad Extension Pack

A personal collection of useful VS Code extensions curated for enhanced productivity and development experience.

Description

This extension pack includes 111 carefully selected extensions covering:

• PHP Development: Laravel tools, PHP IntelliSense, debugging, and code formatting
• JavaScript/React: Snippets, IntelliSense, JSX support, and React development tools
• Python: Debugging, linting, environment management, and IntelliSense
• HTML/CSS: Class completion, tag suggestions, live preview, and formatting
• Git & Version Control: Enhanced GitLens, history visualization, and collaboration tools
• Productivity: Code formatting, snippets, themes, and general workflow improvements
• Web Development: Live server, API testing, and browser preview tools

Included Extensions

File & Project Management

• 0xtanzim.filetree-pro - Enhanced file tree view
• alefragnani.project-manager - Project management
• alefragnani.bookmarks - Code bookmarks
• angelluisalmaraz.project-colorize - Project color coding

Code Editing & Formatting

• aaron-bond.better-comments - Enhanced comments
• esbenp.prettier-vscode - Code formatting
• formulahendry.auto-close-tag - Auto close tags
• formulahendry.auto-rename-tag - Auto rename tags
• oderwat.indent-rainbow - Indentation visualization
• bracketpaircolordlw.bracket-pair-color-dlw - Bracket pair coloring
• streetsidesoftware.code-spell-checker - Spell checking
• usernamehw.errorlens - Inline error highlighting

PHP Development

• bmewburn.vscode-intelephense-client - PHP IntelliSense
• devsense.intelli-php-vscode - PHP intelligence
• devsense.phptools-vscode - PHP tools
• devsense.profiler-php-vscode - PHP profiling
• junstyle.php-cs-fixer - PHP code formatting
• mehedidracula.php-namespace-resolver - Namespace resolution
• mohamedbenhida.laravel-intellisense - Laravel IntelliSense
• onecentlin.laravel-blade - Blade support
• onecentlin.laravel5-snippets - Laravel snippets
• ryannaddy.laravel-artisan - Laravel artisan commands
• shufo.vscode-blade-formatter - Blade formatting
• tal7aouy.php - PHP support
• vsc-snippets.vsc-php-snippets - PHP snippets
• xdebug.php-debug - PHP debugging
• xdebug.php-pack - XDebug tools
• zobo.php-intellisense - PHP IntelliSense
• austenc.laravel-docs - Laravel documentation
• cjhowe7.laravel-blade - Laravel Blade

JavaScript/React Development

• dsznajder.es7-react-js-snippets - React/Redux snippets
• rodrigovallades.es7-react-js-snippets - ES7+ React snippets
• mgmcdermott.vscode-language-babel - Babel JavaScript support
• ofhumanbondage.react-proptypes-intellisense - React PropTypes
• planbcoding.vscode-react-refactor - React refactoring
• skyran.js-jsx-snippets - JavaScript/JSX snippets
• steoates.autoimport - Auto import
• xabikos.javascriptsnippets - JavaScript snippets
• xabikos.reactsnippets - React snippets
• alduncanson.react-hooks-snippets - React Hooks snippets
• angelorafael.jsx-html-tags - JSX HTML tags
• influrium.haxe-jsx - Haxe JSX support
• wix.vscode-import-cost - Import cost visualization

Python Development

• ms-python.python - Python support
• ms-python.vscode-pylance - Python IntelliSense
• ms-python.debugpy - Python debugging
• ms-python.vscode-python-envs - Python environments
• donjayamanne.python-environment-manager - Python environment management
• donjayamanne.python-extension-pack - Python extension pack
• kevinrose.vsc-python-indent - Python indentation
• nikolapaunovic.tkinter-snippets - Tkinter snippets
• njpwerner.autodocstring - Auto docstring generation
• batisteo.vscode-django - Django support

HTML/CSS & Web Development

• bradlc.vscode-tailwindcss - Tailwind CSS IntelliSense
• ecmel.vscode-html-css - HTML CSS support
• pranaygp.vscode-css-peek - CSS peek definition
• zignd.html-css-class-completion - CSS class completion
• anderseandersen.html-class-suggestions - HTML class suggestions
• anteprimorac.html-end-tag-labels - HTML end tag labels
• bradgashler.htmltagwrap - HTML tag wrapping
• anbuselvanrocky.bootstrap5-vscode - Bootstrap 5 support
• heybourn.headwind - Tailwind CSS class sorting
• ritwickdey.liveserver - Live server
• techer.open-in-browser - Open in browser
• cirlorm.mobileview - Mobile preview
• dheovani.svg-viewer - SVG viewer
• purocean.drawio-preview - Draw.io diagrams
• pomdtr.excalidraw-editor - Excalidraw editor

Git & Version Control

• eamodio.gitlens - Enhanced Git capabilities
• donjayamanne.githistory - Git history
• mhutchie.git-graph - Git graph visualization
• codezombiech.gitignore - Gitignore support
• ms-vsliveshare.vsliveshare - Live collaboration
• vsls-contrib.codetour - Code tours

Productivity & Utilities

• github.copilot - AI pair programmer
• github.copilot-chat - AI chat assistant
• christian-kohler.npm-intellisense - npm IntelliSense
• christian-kohler.path-intellisense - Path IntelliSense
• formulahendry.code-runner - Code runner
• adpyke.codesnap - Code screenshots
• adam-bender.commit-message-editor - Commit message editor
• cmstead.js-codeformer - JavaScript code transformation
• cmstead.jsrefactor - JavaScript refactoring
• dbaeumer.vscode-eslint - ESLint integration
• rvest.vs-code-prettier-eslint - Prettier ESLint
• editorconfig.editorconfig - EditorConfig support
• eriklynd.json-tools - JSON tools
• aykutsarac.jsoncrack-vscode - JSON visualization
• britesnow.vscode-toggle-quotes - Toggle quotes
• jasonlhy.hungry-delete - Enhanced delete
• kisstkondoros.vscode-gutter-preview - Gutter preview
• loczek.next-js-ts-snippets - Next.js snippets
• manishsencha.readme-preview - README preview
• naumovs.color-highlight - Color highlighter
• nucllear.vscode-extension-auto-import - Auto import
• rangav.vscode-thunder-client - API client
• shd101wyy.markdown-preview-enhanced - Enhanced Markdown preview
• shellomo.frontend-power-pack - Frontend power pack
• shellomo.js-snippets-pro - JavaScript snippets
• vitest.explorer - Vitest testing
• wallabyjs.quokka-vscode - Live JavaScript/TypeScript scratchpad
• wware.snippet-creator - Snippet creator
• ms-vscode.js-debug-nightly - JavaScript debugging
• digitalbrainstem.javascript-ejs-support - EJS support
• wholroyd.jinja - Jinja template support
• idleberg.icon-fonts - Icon fonts
• helixquar.randomeverything - Random utilities
• ttoowa.in-your-face-incredible - Fun enhancements
• tonybaloney.vscode-pets - Virtual pets

Themes & Icons

• pkief.material-icon-theme - Material icon theme
• whizkydee.material-palenight-theme - Material Palenight theme

Installation

From VS Code Marketplace

1. Open VS Code
2. Go to Extensions (Ctrl+Shift+X)
3. Search for "My Custom Extension Pack"
4. Click Install

Via VSIX File

1. Download the .vsix file from the Releases page
2. Open VS Code
3. Run the command: Extensions: Install from VSIX...
4. Select the downloaded .vsix file

Via Command Line

code --install-extension your-name.my-custom-extension-pack

Development & Publishing

Prerequisites

• Node.js installed on your system
• Visual Studio Code

Installation of vsce

npm install -g @vscode/vsce

Packaging the Extension

1. Navigate to the extension directory:

cd "path/to/your-extension"

1. Package the extension:

vsce package

This will create a .vsix file in your directory.

Publishing to VS Code Marketplace

1. Login to your Visual Studio Marketplace account:

vsce login your-publisher-name

1. Publish the extension:

vsce publish

Updating the Extension

1. Update the version in package.json
2. Run vsce package to create a new VSIX file
3. Run vsce publish to publish the update

Configuration

Most extensions in this pack work out-of-the-box, but some may require additional configuration:

• GitHub Copilot: Requires GitHub Copilot subscription
• PHP Debugging: Requires XDebug to be installed and configured
• Live Server: Port can be configured in settings
• Tailwind CSS: Requires Tailwind CSS project setup

Contributing

This is a personal extension pack. Feel free to fork and create your own version by modifying the extensionPack array in package.json.

License

This extension pack is distributed under the MIT License. Individual extensions may have their own licenses.

Support

For issues with specific extensions, please refer to their respective repositories. For issues with this extension pack itself, please file an issue in the repository.