Impact's Snippets for React

Useful React & TypeScript snippets for faster development.

Designed for React + TypeScript projects using modern React patterns. Don't hate me if you find it a little weird to use, I made it primarily for myself..

Features

Components

Prefix	Description
`eafc`	Export Arrow Function Component
`efc`	Export Function Component
`efp`	Export Function Page

Comments

Prefix	Output
`/r`	`// React`
`/n`	`// Render`
`/o`	`// Routers`
`/r`	`// Types`
`/c`	`// Components`
`/u`	`// Utils`
`/h`	`// Hooks`
`/s`	`// Styles`
`/f`	`// Features`
`/p`	`// Pages`
`/x`	`// Redux`

Boilerplate

Prefix	Description
`!x`	React main TSX boilerplate

Supported Languages

TypeScript React (typescriptreact)
.tsx files

Example

Type:

efp

Then press Tab or Enter to generate:

export function TodoPage() {
    return (
        <main className="page-todo">
            
        </main>
    );
}

The component name is automatically taken from the filename.

Installation

Install Impact's Snippets for React from the VS Code Marketplace.

Or install the .vsix package manually:

Extensions → ⋯ → Install from VSIX...

License

MIT

Made by Impact

Impact's Snippets for React

Asmin Gautam

Impact's Snippets for React

Features

Components

Comments

Boilerplate

Supported Languages

Example

Installation

License