ankr-ui

A React UI library of common components we use in the projects we build for our tutorials at Ankr.

Click here to check out the library's Storybook and all the components

Usage guide

1. Install the package from npm

# using npm
npm install ankr-ui

# using yarn
yarn add ankr-ui

2. Import the CSS at the root of your project (_app.tsx in Next.js, main.tsx in Vite, index.tsx in CRA)

import 'ankr-ui/dist/tailwind.css';
import '../styles/globals.css';
import type { AppProps } from 'next/app';

function MyApp({ Component, pageProps }: AppProps) {
  return <Component {...pageProps} />
}

export default MyApp;

3. Import the component you want to use

import { Button } from 'ankr-ui';

const Page = () => {
  return <Button>gm</Button>;
};

export default Page;

Local development

1. Clone the repo

git clone https://github.com/dhaiwat10/ankr-ui.git

2. cd into the directory and install the dependencies

cd ankr-ui && yarn

3. Run the development server

yarn dev

4. Run the Storybook

yarn storybook