Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/manuelgil/vscode-next-pack

Essential extensions for NextJS development in Visual Studio Code (VS Code). This extension pack includes tools for NextJS, React, TypeScript, GraphQL, Prettier, ESLint, Jest, Git, CSS, HTML, Markdown, and more.
https://github.com/manuelgil/vscode-next-pack

extension-pack extensions next next-auth next-js nextauth nextjs nextjs13 vscode vscode-extension vscode-extension-pack vscode-extensions

Last synced: about 1 month ago
JSON representation

Essential extensions for NextJS development in Visual Studio Code (VS Code). This extension pack includes tools for NextJS, React, TypeScript, GraphQL, Prettier, ESLint, Jest, Git, CSS, HTML, Markdown, and more.

Awesome Lists containing this project

README

        

# NextJS Essential Extension Pack

[![Visual Studio Marketplace Version](https://img.shields.io/visual-studio-marketplace/v/imgildev.vscode-next-pack?style=for-the-badge&label=VS%20Marketplace&logo=visual-studio-code)](https://marketplace.visualstudio.com/items?itemName=imgildev.vscode-next-pack)
[![Visual Studio Marketplace Installs](https://img.shields.io/visual-studio-marketplace/i/imgildev.vscode-next-pack?style=for-the-badge&logo=visual-studio-code)](https://marketplace.visualstudio.com/items?itemName=imgildev.vscode-next-pack)
[![Visual Studio Marketplace Downloads](https://img.shields.io/visual-studio-marketplace/d/imgildev.vscode-next-pack?style=for-the-badge&logo=visual-studio-code)](https://marketplace.visualstudio.com/items?itemName=imgildev.vscode-next-pack)
[![Visual Studio Marketplace Rating](https://img.shields.io/visual-studio-marketplace/r/imgildev.vscode-next-pack?style=for-the-badge&logo=visual-studio-code)](https://marketplace.visualstudio.com/items?itemName=imgildev.vscode-next-pack&ssr=false#review-details)
[![GitHub Repo stars](https://img.shields.io/github/stars/ManuelGil/vscode-next-pack?style=for-the-badge&logo=github)](https://github.com/ManuelGil/vscode-next-pack)
[![GitHub license](https://img.shields.io/github/license/ManuelGil/vscode-next-pack?style=for-the-badge&logo=github)](https://github.com/ManuelGil/vscode-next-pack/blob/main/LICENSE)

This extension pack for Visual Studio Code adds extensions that are amazingly useful for Next, React, TypeScript, and JavaScript development.

## Requirements

- VSCode 1.46.0 or later

## Extensions included

### Next / React / Styled / GraphQL / Tailwind

- [ES7 React snippets](https://marketplace.visualstudio.com/items?itemName=dsznajder.es7-react-js-snippets)
- [Vercel for VS Code](https://marketplace.visualstudio.com/items?itemName=HaydenBleasel.vercel-vscode)
- [styled-jsx](https://marketplace.visualstudio.com/items?itemName=blanu.vscode-styled-jsx)
- [Prisma NextJS](https://marketplace.visualstudio.com/items?itemName=WillLuke.nextjs)
- [Nextjs snippets](https://marketplace.visualstudio.com/items?itemName=pulkitgangwar.nextjs-snippets)
- [NextJS File Generator](https://marketplace.visualstudio.com/items?itemName=imgildev.vscode-nextjs-generator)
- [GraphQL: Language Feature Support](https://marketplace.visualstudio.com/items?itemName=GraphQL.vscode-graphql)
- [Tailwind CSS IntelliSense](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss)
- [vscode-styled-components](https://marketplace.visualstudio.com/items?itemName=styled-components.vscode-styled-components)

### TypeScript

- [TypeScript Importer](https://marketplace.visualstudio.com/items?itemName=pmneo.tsimporter)
- [Auto Import](https://marketplace.visualstudio.com/items?itemName=steoates.autoimport)
- [Move TS](https://marketplace.visualstudio.com/items?itemName=stringham.move-ts)
- [Import Cost](https://marketplace.visualstudio.com/items?itemName=wix.vscode-import-cost)
- [Pretty TypeScript Errors](https://marketplace.visualstudio.com/items?itemName=yoavbls.pretty-ts-errors)
- [JavaScript and TypeScript Nightly](https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-typescript-next)
- [JSON to TS](https://marketplace.visualstudio.com/items?itemName=MariusAlchimavicius.json-to-ts)

### Markdown

- [Markdown All in One](https://marketplace.visualstudio.com/items?itemName=yzhang.markdown-all-in-one)
- [Markdown Lint](https://marketplace.visualstudio.com/items?itemName=davidanson.vscode-markdownlint)
- [Paste Image](https://marketplace.visualstudio.com/items?itemName=mushan.vscode-paste-image)
- [Markdown Preview Enhanced](https://marketplace.visualstudio.com/items?itemName=shd101wyy.markdown-preview-enhanced)

### Git

- [Conventional Commits](https://marketplace.visualstudio.com/items?itemName=vivaxy.vscode-conventional-commits)
- [Git Graph](https://marketplace.visualstudio.com/items?itemName=mhutchie.git-graph)
- [Gitignore](https://marketplace.visualstudio.com/items?itemName=codezombiech.gitignore)
- [GitLab Workflow](https://marketplace.visualstudio.com/items?itemName=gitlab.gitlab-workflow)
- [GitLens](https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens)

### Code Style

- [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
- [Prettier - Code formatter](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)
- [Auto Close Tag](https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-close-tag)
- [Auto Rename Tag](https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag)
- [Better Comments](https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments)
- [Highlight Matching Tag](https://marketplace.visualstudio.com/items?itemName=vincaslt.highlight-matching-tag)
- [Indent Rainbow](https://marketplace.visualstudio.com/items?itemName=oderwat.indent-rainbow)
- [Rainbow CSV](https://marketplace.visualstudio.com/items?itemName=mechatroner.rainbow-csv)
- [Trailing Spaces](https://marketplace.visualstudio.com/items?itemName=shardulm94.trailing-spaces)

### Other

- [Auto Barrel](https://marketplace.visualstudio.com/items?itemName=imgildev.vscode-auto-barrel)
- [Error Lens](https://marketplace.visualstudio.com/items?itemName=usernamehw.errorlens)
- [DotENV](https://marketplace.visualstudio.com/items?itemName=mikestead.dotenv)
- [Draw Folder Structure](https://marketplace.visualstudio.com/items?itemName=jmkrivocapich.drawfolderstructure)
- [EditorConfig for VS Code](https://marketplace.visualstudio.com/items?itemName=editorconfig.editorconfig)
- [Image preview](https://marketplace.visualstudio.com/items?itemName=kisstkondoros.vscode-gutter-preview)
- [JSON Flow](https://marketplace.visualstudio.com/items?itemName=imgildev.vscode-json-flow)
- [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.liveserver)
- [Path Intellisense](https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense)
- [Color Highlight](https://marketplace.visualstudio.com/items?itemName=naumovs.color-highlight)
- [Todo Tree](https://marketplace.visualstudio.com/items?itemName=Gruntfuggly.todo-tree)

## Authors

- **Manuel Gil** - _Owner_ - [ManuelGil](https://github.com/ManuelGil)

See also the list of [contributors](https://github.com/ManuelGil/vscode-next-pack/contributors) who participated in this project.

## License

NextJS Essential Extension Pack is licensed under the MIT License - see the [MIT License](https://opensource.org/licenses/MIT) for details.