I’ve been a SaaS builder for 3 years now, ever since I learned Tailwind CSS, my design iterations have been a joy.
I’ve already designed the same Hero Block a few times:
- Factura.so (built with saasrock)
- Gumcrm.io (built with saasrock)
- Delega.com.mx (built with netcoresaas)
They all have the same structure:
- CTA buttons (primary or secondary)
- An optional top text/link
- An optional bottom text/link
You can understand how this becomes tiring, even with months between each SaaS app development, so it makes sense for me to start abstracting the most common components into a Page Builder.
I always focus on great DX first, so this approach lets you design the Landing page blocks by code, and once it’s in production, it’d let you make changes to your blocks by persisting changes in the database (with Prisma).
Here’s how the Hero block looks:
And here’s what the Hero Block editor looks like:
I decided to make this bit open source to help other Remix developers iterate faster, or at least provide them a simple page builder, give it a star. I can see someone building a full website builder with this project as the base. If you want to check out my other open-source projects, check out my GitHub profile.
If you like what I do, check out my commercial SaaS boilerplate, SaasRock, or watch how I’m using this Page Block builder here: https://www.loom.com/share/eccf927d35cd4ad3b4a1d512257cea53.
Thanks for reading 😃.