10Clouds: Why we moved from Wordpress to Jamstack with Sanity (ssr)

Written by Józef Piecyk

Missing Image!

At 10Clouds, we work with clients all over the world, helping to bring their digital products to life. We understand the huge value that a website has - not only as a tool or platform on which to sell goods and provide services but also as a means of presenting yourself to your clients. So this year, we decided to devote some time to our own website, migrating it from WordPress to Jamstack with the use of Sanity as our CMS.

Our main requirements for the new website

With the new website, we wanted to be able to do the following:

1. Have full editorial access for all Content Managers - on our previous website, only the blog posts were editable in the CMS, whereas changes to all other pages had to be briefed into the development team.
2. Enable Content Managers to create their own pages - the ultimate aim was to give them the autonomy to use content segments to create their own pages.
3. Migrate data - data from the old blog had to be transferred over to the new site, and this included images, authors, blog posts, categories, and relations between them.
4. Retain integrity - URLs to blog posts were to remain unchanged
5. Be SEO ready - with content optimized for search
6. Extend functionality - we needed the ability to introduce new pieces into blog posts like wrapped quote blocks.
7. Refresh content - all blog posts and blog post lists would need to use the refreshed graphical interface
8. Be Performant - sites must load quickly on desktop and mobile
9. Migrate incrementally - we would move the entire website page by page, instead of flipping the switch to transfer everything over at once.

Why Sanity?

When choosing a CMS system, we had several initial contenders. We took into account Contentful and Strapi but ultimately we wanted a CMS solution where we could pay based on use, and where we wouldn’t have to perform the hosting ourselves (as this would likely complicate our site architecture).

Additional things that we liked about Sanity were:

1. Liberty in defining content elements: We have huge liberty in how we want to approach the content structure and we're able to define elements that directly fit to our needs. Below are some of the exemplary content types that we have control over:

• author - name, image, position, bio
• category - name
• blogpost - url, release date, content, author, category, SEO
• customPage - url, sections, SEO

1. Image optimization: What is especially important when considering Gatsby is that the image optimization takes up a large portion of builds. This isn't the case with Sanity as it serves the images using CDN, which means they don't take up any build time!
2. Flexibility in structuring content: Sanity provides us with great flexibility in terms of how we want to structure our content and relations between each content segment. It also provides us with block content (rich text) in which we can define our own structures in the text editor, meaning if we want to define any content type which will be then used in our components.

The reception among developers and editors

Both developers and editors had a very positive reaction to Sanity. There were some initial elements that took some getting used to, but they were efficiently addressed.

Developers: At first, developers found the differences in the GraphQL scheme problematic between different branches, but this was alleviated when each developer had their own dataset.

Editors: Editors loved having the ability to access every area of the website backend themselves, which was something completely new to them. There was much content that had been waiting for a very long time to be released, including many company case studies, and it was amazing for them to be able to publish these independently at the click of a few buttons.

Sanity proved very user-friendly. The only initial challenge was around previewing each page (you have to click build to see the data), but we quickly realized that this could be resolved using Gatsby Preview.

Independent page creation through Storybook

Our top two goals (as mentioned in the list above) were to provide Content Managers with an easy way to both edit website content and create their own new pages. Sounds amazing, right? But how do you set this up for people who are not developers? The answer - Storybook.

Sanity allowed us to use union types - an array of different sections all of which can be used together to form a page. The idea was that once each of these sections had been designed and developed, they could be put into a library, and reused by Content Managers to create new pages. They simply needed to be aligned in a particular order, and populated with the desired content, before publishing and deploying.

The challenge was making this ‘library’ easy to use and understand by Content Managers.

Content managers had a long list of available sections to use. They didn't know what each of the names meant and this could discourage them. Storybook allowed us to show an easy-to-use library of available sections. This allowed our marketing team to quickly see which sections they wanted to use, what variants of sections were available (dark and white for example), and how they wanted to arrange them.

With these in hand we are able to compose various pages with just a few clicks. We could also rapidly prototype and push new pages directly to production.

Achievements so far

As a company, we’ve been very pleased with the migration, and with the use of Sanity, which has made our content management significantly more efficient.

We’ve simplified our architecture, and gained more autonomy both on the developer and marketing side. The website is faster, more customizable, and easier to maintain. Due to performance changes, we also saw a 25% increase in website traffic, which is great news.

Our plans for the future

Our immediate future plans for the 10Clouds website involve further expansion of independent editing and maintenance by content managers. As mentioned previously, it was a great success in terms of speed and efficiency, to enable the marketing team to have editing opportunities, and we want to expand this to allow them to build more pages independently, using the content segments now available in Sanity.

During the process, we created a tool to make moving blog posts easier. We decided to open source so if you want to use it, take a look at the repository here.

Drop us a line

If you’d like to find out more about 10Clouds’ work, or you’re looking to conduct a similar migration project, please feel free to reach out to us via our website. We’d love to hear from you!