Install the VSCode extension

The React Bricks VSCode extension provides useful snippets and improves your development workflow.

Open Extensions in VSCode

Open VSCode and go to:

• View → Extensions

Search for the extension

Search for "React Bricks".

Install

Click Install on the official React Bricks extension: React Bricks Snippets.

Use snippets

After installation, you can create a new brick simply typing brick on an empty tsx file, and use many other snippets (see below).

Available snippets

Prefix	Description
brick	Scaffolds a new Brick. Use it in a new file
Text	Adds a React Bricks <Text> component
RichText	Adds a React Bricks <RichText> component
Image	Adds a React Bricks <Image> component
Repeater	Adds a React Bricks <Repeater> component
File	Adds a React Bricks <File> component
sideEditProp	Creates a new SideEditProp
selectOptions	Creates the selectOptions for a select SideEditProp

Why this helps

• Faster brick creation
• Consistent structure
• Less boilerplate code