Incorporate KoliBri / Public-UI into a basic Vite React TypeScript project

Posted by

Integrate KoliBri / Public-UI in a plain Vite React TypeScript project

Integrating KoliBri / Public-UI in a Vite React TypeScript project

If you are working on a Vite React TypeScript project and want to integrate KoliBri / Public-UI, here are the steps to follow:

Step 1: Install KoliBri / Public-UI

First, you need to install KoliBri / Public-UI into your project. You can do this using npm or yarn:

    
      npm install @kolibri/public-ui
    
  

or

    
      yarn add @kolibri/public-ui
    
  

Step 2: Import and Use KoliBri / Public-UI components

Once you have installed KoliBri / Public-UI, you can import and use its components in your React components like this:

    
      import React from 'react';
import { Button, TextInput } from '@kolibri/public-ui';

function MyComponent() {
  return (
    <div>
      <Button>Click me</Button>
      <TextInput placeholder="Enter text" />
    </div>
  );
}
    
  

Step 3: Enjoy using KoliBri / Public-UI in your project

That’s it! You have successfully integrated KoliBri / Public-UI in your Vite React TypeScript project. You can now enjoy using its components and styles to enhance the user interface of your application.

Make sure to check the KoliBri / Public-UI documentation for more information on how to use its components and customize its styles.