Service Innovation Labs
- Web Development, Consulting, Project Management
When it came to the point that we needed a new Website at Service Innovation Labs, we had the requirement to make it extremely flexible, but still maintainable by non-technical users. I'll sum up some tech choices I made, since I was mostly busy developing, while others took care of visual design and content.
A conventional CMS like Wordpress or Kirby cannot fulfil this, because it mostly works page-based, what we needed was content editing on a component level. So I proposed storyblok.com, a headless CMS with a visual editor, making the editing experience similar to page-builder tools like Wix or Sqarespace, but without being trapped in their front-end. My wish was to work with Nuxt.js and luckily storyblok turned out to be the perfect match. The killer feature for me was the built in image processing API of storyblok.
For CSS I chose Tailwind. Before that I haven't used it extensively, but really wanted to try it in a bigger Project. Combined with PurgeCSS, that treeshakes your CSS tree (removes all unused code) there's really no drawback in working with hundreds of utility classes. Now I can confirm: Tailwind allows for such a fast and joyful developer experience, I don't want to miss it ever again (coming from someone who actually likes CSS).
The best option for hosting statically generated content is (IMHO by far) netlify.com, it not only provides the best dev experience and speed I could wish for, but also has an extremely generous free plan as well as built-in form handling, usable by just adding
data-netlify="true" to any
The only caveat I have is that the storyblok live preview does not work out of the box and requires a second build of the website on now.sh that took quite some time to setup before it worked (still slow and unreliable). In retrospect I'd do a lot of things differently, but the overall set of tools and plugins Nuxt provides, combined with Storyblok, Tailwind and Netlify is incredibly pwerful and just a pleasure to work with.