Hello everybody out there using React

#react #microfrontend #componentlibrary #softwareengineering

I always wanted to write a post like Linus Torvald's famous Linux announcement, so here goes...

I'm doing a (free) component library for micro frontends (just a hobby, won't be big and professional like Material-UI or Ant Design) for React 18+. This has been brewing since August, and is starting to get ready. I'd like any feedback on things people like/dislike in component libraries, as my library resembles existing ones somewhat (same basic philosophy of atomic design, among other things).

I've currently ported most of the components I need, and a few utilities, but it's still very much a work in progress. This means it's not fully tested in all scenarios yet, but I'm getting there. It should be ready for broader use in a few weeks (or months - who knows). I'd like to know what features most people would want. Any suggestions are welcome, but I won't promise I'll implement them :-)

What I've got so far

@jonmatum/react-mfe-shell - because naming things is hard.

// This works right now:
import { SettingsProvider, Button, FormField, Input } from '@jonmatum/react-mfe-shell';

function App() {
  return (
    <SettingsProvider>
      <FormField label="Email" required>
        <Input type="email" placeholder="Enter email" />
      </FormField>
      <Button variant="primary">Submit</Button>
    </SettingsProvider>
  );
}

Basic stats: 24 components, TypeScript support, multiple integration paths (zero-config or Tailwind), and a theme system that actually works.

The real test: axisight.io

Because you have to eat your own dog food, I built axisight.io using this library. It's a tool I'm working on, and everything you see there runs on the component library. If it works for a real application, it should work for you too.

Why I built this

I was working on micro frontend projects and kept thinking "there has to be a better way to share components between apps." Most libraries assume you're building one big SPA, but what if you're not?

So I built something that works, integrates with existing setups, and actually has the components you use daily.

You’re welcome to try it if you’d like.

This is very much a work in progress, so expect some rough edges:

npm install @jonmatum/react-mfe-shell

What I'd like to know

What components do you rebuild constantly?
What annoys you about existing libraries?
Any micro frontend pain points?

Will this become the next big thing? Probably not. But it's free, it's open source, and it solves some problems I was having.

Plus, I finally got to write a post like Linus's Linux announcement. Always wanted to do that! 😄

echo "Pura Vida & Happy Coding!";

PS: This post format is inspired by Linus Torvalds' famous Linux announcement in 1991.

DEV Community