Create React App
This guide uses Create React App (CRA) (opens in a new tab) to setup a basic frontend. CRA is a popular set of tools used to setup and maintain a React project.
1. Setup the CRA project with Vizzly.
npx create-react-app my-vizzly-app && \
cd my-vizzly-app && \
yarn add @vizzly/dashboard
2. Adding the react component
Replace the src/App.js
file with;
import React from "react";
import Vizzly from "@vizzly/dashboard";
function App() {
return (
<Vizzly.Dashboard
queryEngineEndpoint={"<< Your query engine endpoint >>"}
identity={async () => {
throw new Vizzly.NewVizzlyImplementation();
}}
/>
);
}
export default App;
3. Run it
To run the project, execute the following CLI command in your shell
yarn start
Once done, a page in your web browser will open, where you will see a welcome message from us, and details on the next steps.