Skip to main content

Introduction

🤔 What is this?

Biblo helps you create your very own "library" of components. It is basically a list of all the components you have developed for your app, each with a list of examples of the component with different properties.

Biblo was inspired by StoryBook, and the easily manageable workflow it provides in creating a component library. So if that is something you know and love, you might also like this.

However, since Biblo is meant to exist inside your app (and not as a separate thing like StoryBook), you have the possibility to 💅 style every part of it or even exchange most of the parts with your own components, truly making it a part of your app.

🤷 How does it work?

Using require.context, it is possible import to all the exports from a bunch of files using a regular expression.

Just like with StoryBook, these files (usually ending in .biblo.tsx) must be set up with a default export containing the basic information about the component and a number of named exports all representing different versions of the component (different properties).

👷 What do you need?

You'll need support for require.context, which was introduced in Metro version 0.72.1.

So...

  • Make sure React Native is version 0.70.0 or newer.
  • Or if you're using Expo, you'll need version 47.0.0 or newer.