Skip to main content

Getting started

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

info

You need NodeJS to run the Vev CLI.

Install CLI​

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

npm install -g @vev/cli

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.

my-component.js
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:

Run you components in the Vev Editor​

Now you are ready to run your component.

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.