🎺 Remix Bebop Stack

Learn more about Remix Stacks.

npx create-remix --template epeterson320/bebop-stack

🔑 Motivation

The main idea behind the authorization model (and the starting data model) is that nearly every B2B app has organizations which in turn have resources. For example, Github orgs have repos, Slack orgs have channels, Office 365 orgs have all sorts of documents and spreadsheets, Figma orgs have graphics files, and the list goes on. In every case, if you create a resource within your org, you own it and control its permissions, with the exception that your organization's admins can access all resources within the org. App admins (i.e. customer support agents for the SaaS) can access resources across any organization.

That authorization model is what you get out of the box, powered by Oso, and the rules can be modified and expanded by editing the .polar files inside auth/. See their docs for help. If you don't know much about authorization, prepare to have your mind blown.

🎁 What's in the stack

• Bulletproof authentication with Auth0.
• Authorization (declarative attribute-based access control) with Oso
• Database ORM, migrations, and seeding with MikroORM (using PostgreSQL by default).
• Testing with Jest.
• Some handy VSCode settings: recommended extensions and full-stack debug config.
• Linting with ESLint.
• Code formatting with Prettier.
• Git hooks with Husky.
• UI kit with MUI.
• Typescript, with Typescript.

You know your own situation better than I do, so if you want to change some of this stack, feel free to fork this and then npx create-remix --template your/repo for the win.

🚫 What's not in the stack

• Prisma
• Storybook
• Breejs, queues, or anything in the background
• Cypress
• Deployment, because you probably have opinions, but the app is Dockerized.

Develoment

• npm run dev runs the app.
• npm run db:push resets the database to the schema snapshot and seeds it.

FAQ

Why MikroORM and not Prisma?

Because Prisma doesn't support GIS types or geospatial queries, which means if you use Prisma, you're going to have a hard time getting your app to do anything useful that deals with real-world space and distance.

Why can't I use Storybook?

Because you're building an app, not a component library. You need to value your time enough to pick a solid UI kit that lets you work at different levels of abstraction (components, theme parameters, utility classes, raw CSS or CSS-in-JS) and already has all the major components you're going to need. That's why MUI comes with this project.

Why is Cypress not included?

Because ugh. Every project I've ever worked on using Cypress has like five e2e tests, four of them failing and one false positive.

Bundle size?

I don't care about bundle size. Hopefully we can still be friends.

Known Issues

I haven't written any of the code yet, so there's that.

Contributing

Please contribute if you feel led.