# Get Started with Your Component Library Platform

This is the start point for your component library.

Before you start working ...

1. Create your project and author name if you haven't done so already but editing your root-level `package.json`.
`{
"name": "my-component-lib-platform",
...
"author": "",
...
}`
2. Also change the `name` property in the `/stencil-web-components/package.json` and `/stencil-react-wrappers/package.json` to something that fits your component library convention.
3. Finally, make sure the `componentCorePackage` property in the `/stencil-web-components/stencil.config.ts` matches the `name` property in `/stencil-web-components/package.json`.

You can start learning how to develop the component library platform by editing this page (`/stencil-web-components/src/index.html`). The following assets will help:

- Storybook for StencilJS Component Library
- React Pattern Demo
- TailwindCSS
- Building a Micro Frontend

## Storybook for StencilJS Component Library

Description Description Description Description Description Description Description

View Storybook - this will run automatically on initial install.

To start Storybook again in the future, `cd` into `/stencil-web-components/` and run `npm i && npm start`.

## React Pattern Demo

Description Description Description Description Description Description Description

View React Pattern Demo - this will run automatically on initial install.

To start the React Pattern Demo again in the future, `cd` into `/apps/react-demo/` and run `npm i && npm start`.

### React Component Wrappers for Web Components

Description Description Description Description Description Description Description. The web components can then be utilized as React components.

## TailwindCSS

Description Description Description Description Description Description Description. The component library platform utilizes a utility-first CSS framework. There is a great resource for the classes at nerdcave.com/tailwind-cheat-sheet.

## Building a Micro Frontend

The platform also can be used to generate a Micro Frontend, a more complex web component that is esentially its own micro-application and can be shared across other frontend applications. There is an example of a web component being used as a mirco frontend in the React Pattern Demo.