Headless - The Future of CMS Is Here

Hello there, and welcome to this lightning session about the headless world, content management systems, Jamstack, and all the decoupled out there in the web.

So my name is Samuel Snapko and I'm the head of the developer relations at Storyblock, which is one of the headless CMSs out there, of course, and also the proud sponsor of the React Advance. And I'm very happy that you find time to watch this video and has to invest this five, six minutes to find out more about the future of the content management system.

So what is all the headless hype about? It's about building your own custom backend without needing to really code a lot. So you can build the Atomic system as you want, set up the different components, all that stuff. But on the other side, you can use the framework of your choice.

So if I would jump here to getting started, you could see you can go through all of that stuff. I don't have any of the slides, I just show you the website where you can find it. Then, of course, you will set up and create the component according to Atomic design and all your approaches that you would like to as similar as you do in your favorite framework, and then you can use that with the framework of your choice. So here, for example, in this samples, we have different samples for NexGIS, Next, Gatsby, React. Of course, Remix and all that stuff is already supported, so all the major React frameworks out there. You can simply use the same setup at the backend with multiple frames in the future, in the frontend, and choose your favorite one. And that's all the headless about. Of course, additionally to that, the nice backend gives you like all the workflows, workflows, translations, approvals system, versioning, and more stuff that you need for your content teams and for your marketers, that they can easily work with all of that. Find out at storyblock.com.

But what is exactly all about? So if you go and sign up, and you will log in, you will get to the Storyblock app, where you will choose your favorite, where you can choose your favorite spaces. You can like put them, you can like manage them, but you can also easily create here a new demo, like React advanced. I created right now. And in this demo, then you can like play with all that stuff. So what is possible with this? So why? And how? And why should you do that? So, and I say you, you will get a visual editor with all the cool stuff of real-time visual editing in React. So basically, as soon as you will do the type, then you will see the change. So yes, this is all the parts. This is the blog library, where you can define all the components. And then we have, of course, the content, where you have a folder based system in which you will create different stuff. Here we can see right now, of course, a sample project. And in the sample project, you have like different folders, you can like tag stuff, you have an asset library with image service, which you can like change this type of images. You can also have an image editor, where you can like Photoshop your images already directly in system. So you don't need to have extra tool. You have of course getting started here, you have a dashboard which you will see an overview of all of what's happening in your system, where you see all your last edits, the task pending to you and other stuff. Of course, you have a settings where you will set up different tokens, how to get content from draft for draft or for public website.

You can have multiple environments, multiple preview links, and even redesign your website directly in Storyblock. The visual content feature allows you to see a real-time preview of your website connected to platforms like Versal, Netlify, AWS, or your own server. You can define the components and their rules, and even build custom plugins using React or Vue. With visual editing, you can make changes and see the preview update in real time. You can scroll, click on different parts of the website, move components around, and change styles quickly. As developers, you have the power to configure all of this and make changes easily. You can also access the content in JSON format through the API and use JavaScript bridges to build the components in your final product.