Getting started
This article explains how to get started with Contza. By end of this page, you will have Contza ready to be used in your React application.
Create Contza website
Let's start things by Creating a Contza account (opens in a new tab). After you have logged in to your account make sure you are on My websites (opens in a new tab) page. Then click "Create website" button on the top right corner. Give the website a name and a slug. Slug is just a human readable identifier for the website.
Install packages
Install Contza React component library (required).
yarn add @contza/react
If you would like to use features such as Static site generation (SSG) or Server-side rendering (SSR), you should also install @contza/client (optional).
yarn add @contza/client
Setup Contza Provider
Wrap you React application with <ContzaProvider />
component. Contza Provider basically shares it's context with all the other Contza components.
Finalize the installation by adding the websiteId
prop for ContzaProvider. You can found it from My Websites -> Your Website -> Settings -> API Access
import React from "react";
import { ContzaProvider } from "@contza/react";
const App = () => {
return (
<ContzaProvider websiteId="your-website-id">
{/* Rest of the app */}
</ContzaProvider>
);
};
export default App;
Congratulations, you now have Contza fully setup to your project.
Now you can start adding Contza components to make your content editable!