Getting started

How to get started with Vev using the command-line interface (CLI), and local development of custom React components in Vev.

Install CLI

First you need to install the CLI from NPM (or Yarn).

npm install -g @vev/cli

• Available CLI commands

Authorize the CLI

After that you need a Vev account, and then authorize the CLI:

vev login

Bootstrap your project

It is not needed to add your components to a specific Vev project, it can be determined later if you want your component to be available for only a specific project or for a whole account.

To create a new project:

vev create [my-project]

You can also use the CLI in an existing React project. Then you just need to add the @vev/react package.

In your project directory run:

cd [my-project]
vev init

Create your first component

The registerVevComponent function can be used everywhere inside a ./src directory. But all components needs to be exported.

import React from 'react';
import { registerVevComponent } from '@vev/react';
 
const MyComponent = () => {
  return <div>Hello, VeV</div>;
}
 
registerVevComponent(MyComponent, {
  name: "My awesome component",
});
 
export default MyComponent;

Further reads:

• Register component
• Vev props
• Vev components
• Vev hooks

Run you components

Now you are ready to run your components in the Vev Editor.

vev start

Now you can open the Vev design editor and your components will be available in all your projects as long as the CLI is running.