Show HN: Blocks by Cosmic – React components for headless CMS
Cosmic is a headless content management system (CMS). We provide a dashboard to create content and API tools to deliver content to any website or app.
Blocks are pre-built website components that you can drop into your project. Choose from landing pages, blogs, image galleries, product pages, and more. With Blocks you can build these features with Cosmic faster than ever.
It's our goal to empower your team to create the best content powered websites and apps. Blocks can be considered the missing "head" to connect with the Cosmic headless CMS. It is our opinionated component frontend for building highly scalable and performant web applications built with tools we think offer a development experience and performance advantage (React Server Components, Next.js, and Tailwind CSS).
React Server Components (RSCs) have unlocked a new paradigm in building data-driven web applications. By safely encapsulating data-fetching inside components, we can use RSCs as building blocks to enable faster and more scalable application development. We are excited for the potential of RSCs and Blocks. This is just the beginning.
To get started, go to the Blocks website (https://blocks.cosmicjs.com/) and follow the steps for installation. View the Blocks demo (Agency Template) (https://cosmic-agency-template.vercel.app/) to see all of the Blocks in action.
Blocks are built to give developers a head start with features that are:
- Performance optimized - Draft preview ready - Mobile responsive - Localization ready - Dark mode ready - Customizable - Accessible - Type safe
Blocks not only provide a fast development experience, they have been optimized for speed and performance by default, so you can ship production-ready faster. Check out the Blocks demo (Agency Template) (https://cosmic-agency-template.vercel.app/) to see how building with Blocks can give you high scores across the board for performance, SEO, and accessibility.
Blocks are open source (https://github.com/cosmicjs/blocks) and built with React Server Components, Next.js, TypeScript, Tailwind CSS, and powered by the Cosmic content management system. You can install Blocks into any new or existing Next.js (v13+) codebase using the Blocks CLI (https://www.npmjs.com/package/@cosmicjs/blocks).
Check it out on the Blocks website (https://blocks.cosmicjs.com/) and let us know what you think in the comments.
Tony