The JAMstack architecture for building web apps has a ton of benefits from better speed, to better security, to better flexibility. And, let's be honest, the development experience overall is generally better as well (remember when you had to install a local application server, web server, database server and more?). Popular services like Netlify make the whole experience better too by creating a continuous deployment experience that includes things like form handling, serverless functions and more.
But managing JAMstack sites isn't without its daily frustrations. For instance, when I check in a change or modify the content in the CMS, I am often left refreshing the page until I see the change live. That's not an optimal experience but it gets even worse when the change isn't obvious like a title or image, but instead is something behind the scenes in the HTML, CSS, JavaScript or serverless functions. I end up like...
Monitoring Netlify Builds with the Stackbit Control Center
This week Stackbit released a new feature that can improve this workflow (full disclosure: I am a developer advocate for Stackbit). The Stackbit Control Center actually sits on your web site and is visible only to you, not your users, while offering the following features.
- Automatically detect and notifies you when a Netlify build is triggered - regardless of how it is triggered.
- Monitor the progress of a Netlify build so that you know exactly when a change is live.
- View the live build logs without ever leaving your page, so that you immediately know if there is a build error or delay.
- Quick access to your projects associated services including such as the Netlify project dashboard and GitHub repository (or the associated CMS if the project was created using Stackbit).
Oh, and, by the way, it's free.
Installing the Control Center?
This is usually the point where I'd be telling you that you need 1.5k different npm packages installed and to rewrite your site in React/Angular/Svelte for this to work. Good news - that's not the case. Here's how to add it to any existing site deployed to Netlify:
- Go to https://www.stackbit.com/control-center/.
- Click "Pick any Netlify Project".
- Select which projects you would like to enable the control center on.
- Enjoy!
But will this work on your site?
If your site is deployed to Netlify, yes it will! Whether it uses Gatsby, Jekyll, Hugo, VuePress, any other static site generator or, for that matter, no static site generator at all - it will work.
Behind the scenes this uses Netlify's Snippet Injection and APIs to work. If you want to know more, check the FAQ.
Go Forth and Deploy with Confidence!
Ok, maybe that's a bit over the top, but hopefully this tool can help make the whole experience of deploying JAMstack sites more transparent and save devs some time and frustration.
Top comments (3)
An interesting idea, I'll have to take a look and try it on one of my Netlify sites. Thanks for sharing.
Amazing tool. I have my website in stackbit deployed on netlify and I will try this new feature for sure. Thanks for sharing.
Good post! thanks for sharing this :) i will try it out.