Skip to content
| Marketplace
Sign in
Visual Studio Code>Snippets>Create React Component and ContextNew to Visual Studio Code? Get it now.
Create React Component and Context

Create React Component and Context

canducci

|
559 installs
| (0) | Free
Create React Component and Context
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Create React Component

Create React Component for VS Code

Version Install Downloads Ratings Rating(Star)

Installation

Visual Studio Marketplace

Paste the following command and press Enter:

ext install canducci.create-reactjs-components

Supported languages (file extensions)

  • JavaScript (.js)
  • JavaScript React (.jsx)
  • Javascript Typescript (.tsx)

Usage

In the Context Menu choose:

  • React Function Component (js)
  • React Function Component (jsx)
  • React Function Component (tsx)
  • React Function Context (js)
  • React Function Context (jsx)
  • React Function Context (tsx)
  • React Stateless Function Component (js)
  • React Stateless Function Component (jsx)
  • React Stateless Function Component (tsx)
  • React Stateless Function Context (js)
  • React Stateless Function Context (jsx)
  • React Stateless Function Context (tsx)

Note:

  • Where a component is created in the components folder.
  • Where a context api is created in the contexts folder.

Menu:

Image


Image

Usage:

In the box provided, type the name of the component, which may vary as follows:

  1. A simple name, example: counter

    A component or context is created respectively, the name entered is the folder and within that folder an index.js|jsx|tsx.

  2. Several names separated by commas, example: counter, header, footer

    A component or context is created respectively, the names entered are separated into folders and within each folder an index.js|jsx|tsx.

  3. Names separated by periods are compound words, example: app.web, header.counter, etc.

    If the name (s) are a period separating it means that your initials will be in uppercase, example: AppWeb, HeaderCounter and the others name follows the same PascalCase nomenclature, exemplo: Counter, App, etc.

  4. Name with numeric initials will not be accepted Example names: 1Header, 2Web are not accepted

Example:

Image


Image

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft