JAMStack is becoming more and more popular because **it's easy to scale and manage** for devops and always offers **optimal performances for end-users**. There are a lot of native options to generate static websites, like [GatsbyJS](https://www.gatsbyjs.org/) or the new features introduced in [NextJS(check out how to create static sites with NextJs)](https://www.contentchef.io/blog/ssg-with-next-and-headless-cms). Today we want to explore how to add headless cms to a Svelte app and how we can generate a static version of it. 

## Setting up

To get started, you need to have nodejs( >= 10), git installed, and an active account of [ContentChef.(You can start a free 30-day trial here)](https://www.contentchef.io)
ContentChef is the headless cms that we are going to use in this example, and of course, the same concepts apply to any headless cms or external API to fetch data.
For this tutorial, we will need the spaceID and the online API key that you can easily find and note down in the dashboard home, as you can see below.

![ContentChef Dashboard - Home](https://res.cloudinary.com/contentchef/image/upload/v1/chefsite-2910/I49Zi00Uf7S/spaceid)

## Starting the example Svelte application

For this mini-tutorial, we'll use the [Svelte Starter](https://github.com/ContentChef/svelte-starter) provided with ContentChef, and we begin by cloning the repo and installing all the dependencies.

```bash
    git clone git@github.com:ContentChef/svelte-starter.git
    cd svelte-starter
    npm install
```

This starter is a Sapper starter app ([learn more about Sapper here](https://sapper.svelte.dev)), where we added a couple of pages.
Let's explore the starter.
Open the `./src/contentChef.js` file to create and configure the ContentChef client ( [from the JS/Typescript SDK](https://github.com/ContentChef/contentchef-node) ) by adding our spaceID and online API key noted down before.

```javascript
import { configure } from '@contentchef/contentchef-node';

const client = configure({
    spaceId: '<YOUR_SPACEID>'
});

export const onlineChannel = client.onlineChannel('<YOUR_ONLINE_API_KEY>', 'example-ch');
```

Let's start it up with:

```bash
npm run dev
```

Now open up your browser at [https://localhost:3000/sites](https://localhost:3000/sites), and you should see something like this:

![Svelte example app](https://res.cloudinary.com/contentchef/image/upload/v1/chefsite-2910/L7ERWwDSvkq/ssg/sapper_site)

Great! It's working correctly!
This is also a server-side rendered svelte app.
Just open up the `src/routes/sites/index.svelte` file to see how simple is the integration with ContentChef.

```html
<script context="module">
	import {onlineChannel} from '../../contentChef.js';
	export async function preload(page, session) {
		const response = await onlineChannel.search({contentDefinition: 'top-site', skip: 0, take: 100});
		return { sites: response.data.items };
	}
</script>

<script>
	import Card from '../../components/Card.svelte';
	import {getImageUrl} from '../../contentChef.js';
	export let sites;
</script>

<style>
	h1, figure {
		text-align: center;
		margin: 0 auto;
	}
	h1 {
		font-size: 2.8em;
		text-transform: uppercase;
		font-weight: 700;
		margin: 0 0 0.5em 0;
	}
	figure {
		margin: 0 0 1em 0;
	}
	@media (min-width: 480px) {
		h1 {
			font-size: 4em;
		}
	}
</style>

<svelte:head>
	<title>Sites from ContentChef</title>
</svelte:head>

<h1>Sites</h1>

<figure>
	{#each sites as site}
		<a rel="prefetch" href="/sites/{site.publicId}">
			<Card thumbnail={getImageUrl(site.payload.image)} title={site.payload.title} url={site.payload.url} description={site.payload.description} />
		</a>
	{/each}
</figure>
```

As you can see, the **list of sites is fetched from the cms delivery API**, and there's also a detail page for each item, and therefore, **the number of pages of this example site is dictated by the cms** contents and not statically configured in the app.

But now **we want to make this static**, not only server side rendered!
How can we staticize it , if we don't know the number and paths of pages upfront?

## Making it static

Here's wehere the magic of Sapper will help us.
What we have to do? Well... **basically nothing!**
**Sapper allows you to export a static site with a single zero-config sapper export command.**
When you run sapper export, Sapper begins with a  build of a production version of your app, as you had run sapper build, and copies the contents of your static folder to the destination. It then starts the server, and navigates to the root of your app. From there, it follows any `<a>` elements it finds, and captures any data served by the app.
**Yes it basically crawl your app and generate static html from it!**

Let's see it in action:

```bash
npx sapper export
```

![Console Output](https://res.cloudinary.com/contentchef/image/upload/v1/chefsite-2910/L7ERWwDSvkq/ssg/sapper_build)

Whoa! That was easy! And as we can see from the console output all the pages and subpages have been crawled and generated.
And then serve it with:

```bash
npx serve __sapper__/export
```

You are done!

We have seen how it's straightforward to generate a static version of your svelte + sapper websites, and it's also effortless to manage content with headless cms like [ContentChef](https://www.contentchef.io).
If you liked the article please share it with some fellow who might enjoy it too!

Learn how easy is to generate a headless cms driven static site with Svelte and Sapper.

Generating static sites with Svelte and a headless cms

Managing data efficiently is becoming increasingly complex. Many businesses offer various products and services to customers and need multiple systems and databases to create and manage the data required. The resulting complexity and lack of transparency can, therefore, affect the success of the company and the satisfaction of teams and customers.

Fortunately, things don't have to be that way. Let's take a look at Product Information Management (PIM), how it works, and how it can help you manage product data more efficiently. We'll also explore how you can further optimize your workflows and become more productive by using a headless CMS for PIM.

## What is product information management?

[Product information management](https://en.wikipedia.org/wiki/PIM)(PIM) describes the process of managing all the data required for marketing and selling products. It helps companies ensure that they can use and share high-quality data and content, both internally and on external channels. This data includes:

* product data, such as names and descriptions
* taxonomy, such as categories and variations
* digital media, such as images, videos, and PDFs
* specifications, such as sizes, ingredients, and materials
* and other data that help you manage, market, and sell products

PIM systems help you optimize the needed processes and unite all related functions in one place. You can manage product data, connect products, add media assets and assembly instructions, create catalogs, and much more.

## How PIM supports your product management

If you offer a vast range of products, you sure feel the need to organize and distribute the corresponding data effectively and fast. But even with a smaller assortment, efficient management can be tedious. PIM systems help you and your team become more productive, to stay in control over product data, and to keep the processes involved transparent.

Let's look at some more benefits to see how a PIM system can help your business:

* consolidate all data in one database/place and avoid faulty duplicates in other databases
* improve time-to-market times
* create efficent workflows that help you get the most out of resources
* distribute tailor-made and rich product content to all your channels
* increase sales and customer loyalty through valuable content and data

Ultimately, the optimization of processes in your company increases the quality of your product data, sales channels, and customer service, which, in turn, increases the satisfaction and loyalty of your customers.

## Leverage a headless CMS for PIM

As mentioned earlier, you can reduce errors and increase productivity by managing all your product data in one place. This also serves the goal of many companies to reduce the number of systems required for their company. But what about the other content related to your products that you cannot manage in PIM systems?

Typically, businesses use content management systems (CMS) to manage their website's content like blog posts, form data, and media files. Many also have dedicated [systems for e-commerce](https://www.contentchef.io/blog/why-choose-a-headless-cms-for-ecommerce). However, what if you also want to supply your mobile app or IoT devices with content? You need to use several different systems again, which can increase the susceptibility to errors and reduce your teams’ productivity.

More and more companies are using headless CMSs to address these problems. With these systems, you can create any type of content and distribute it to any channel using APIs. Read our blog post "[What is a headless CMS, and how can it help you](https://www.contentchef.io/blog/what-is-a-headless-cms)" to learn more.

Of course, due to its flexibility and scalability, you can also use a headless CMS for PIM. Having all of your product data and content in one place can improve your internal workflows, content quality, customer service, and customer satisfaction.

![A headless CMS helps you bring all of your different content types together in one place.](https://res.cloudinary.com/contentchef/image/upload/v1/chefsite-2910/L7ERWwDSvkq/28042020_grafico "A headless CMS helps you bring all of your different content types together in one place.")

With ContentChef you can take full advantage of PIM with a headless CMS:

## Create tailored product structures

Your products and other content types are all different, and some require fairly complex structured data, others less. With ContentChef, you can create tailor-made architectures for any kind of data you want to use, regardless of its complexity. You can either use our JSON-based schema language or the visual editor. This makes it easier for your teams to create and manage products and content because they only need to work with data fields that are required for certain types of content.

## Leverage push & pull content distribution

With ContentChef, you have full control over your data and can determine when and where you want to send it. Thanks to our user-friendly publishing workflow, your teams always know what content is online and on which channels they are visible. Preview products and other content in staging mode and push them to live mode as soon as everything looks good. Your developers can quickly build and deploy content delivery APIs that they can use to pull content and populate your channel's UI.

## Feed data to any distribution channel

Modern businesses often offer their product data on more than one channel. With ContentChef, you can distribute your content wherever you need it – be it on your website, e-commerce site, native app, or IoT device. Since you use a content delivery API to retrieve your custom structured data, you have full control over your channel's look and feel. Let your designers create tailor-made digital experiences for any channel and endpoint. Then, let developers build UIs with their favorite and proven front-end stack. As a result, design and development teams can fully enjoy their work and provide customers with intuitive user interfaces, they'll love.

## Straightforward asset management

Naturally, you have a variety of assets that are needed for your products and other content types. Manage your images, videos, PDFs, and other documents in one place and organize them neatly inside folders. This way, your teams can quickly find the assets they need and connect them to your products. Additionally, ContentChef has some built-in image and video manipulation features that allow you to auto-resize and format digital content precisely as needed. By doing so, your product and content managers can optimize media resources without the help of designers, who then, in turn, can focus on their craft.

## Get started with a headless CMS for PIM

If you need a system for PIM processes and content management, a headless CMS is a perfect choice. Save time and reduce complexity by uniting all your product data and other content in one place and distributing them to the appropriate channels.

As a headless CMS for PIM, ContentChef can help you reap the benefits of both worlds! [Sign up for a 30-day trial](https://app.contentchef.io/registration) and give our headless CMS a try.

Let's take a look at Product Information Management (PIM), how it works, and how it can help you manage product data more efficiently. We'll also explore how you can further optimize your workflows and become more productive by using a headless CMS for PIM.

Reaping the benefits of PIM with a headless CMS

The e-commerce industry is booming and growing steadily. According to forecasts, [95% of shopping](https://https://letstalkaboutmoney.com/ecommerce-statistics/) will be facilitated by e-commerce by 2040. What does this mean for you and your online shop? First of all, you should look for a future-proof e-commerce management solution that lets you keep up with the market – or maybe even be one step ahead!

Many companies have already replaced their older shop software with newer solutions known as headless e-commerce systems. In this blog post, we're going to talk more about these systems, how they complement each other, and how they can help you remain flexible and scalable in the long term.
## What is headless e-commerce?
Many online stores have a monolithic e-commerce system in place that consists of a back-end and a connected front-end. In general, the back-end serves as an administration interface through which you can create and manage the content and data of your shop. When a user visits your online shop, they see the front-end of the system used – also known as the presentation layer.

However, the connection between these two parts has one significant disadvantage, namely if you want to supply IoT devices, native apps, and other endpoints with your product data. And this is where headless systems come in to save your day!

In short, headless e-commerce, also called decoupled e-commerce, consists only of the back-end part. This means that you can freely build UIs for any device and endpoint without being limited by a system's front-end requirements. Then, you can feed your channels with data from a RESTful API.

![Multichannel Ecommerce](https://res.cloudinary.com/contentchef/image/upload/v1/chefsite-2910/L7ERWwDSvkq/21042020_articolo-02)

## Why combine headless e-commerce with a headless CMS?
You probably also have heard about headless content management systems and may be wondering how they differ from headless e-commerce solutions. Let's get this question out of the way.

What is a headless CMS anyway? Just like a headless e-commerce system, this type of content management system isn't coupled to a front-end. Here, too, you can develop tailored UIs for your native apps, websites, and IoT devices and provide them with data from the CMS via an API. 

Now, this sounds exactly like a headless e-commerce system, doesn't it? Well, not necessarily – the differences mainly depend on the solution used. Usually, decoupled e-commerce solutions are developed for one purpose: managing products and trade-related things like orders, shipping, inventory, etc. With headless CMSs, on the other hand, you can create and manage any kind of content and its structure.

While there are still some dedicated headless e-commerce systems today, many headless CMSs also offer e-commerce functions. By combining the two types, you can leverage the features required for your online shop and manage all other content for any other platform that you operate. Let’s find out how you can benefit from this combo! 
## What are the benefits of a headless CMS for e-commerce?
In this digital age in which we live, we use many different apps and services every day. Businesses strive to use as few applications as possible to reduce costs and keep workflows transparent and straightforward. Instead of having three different content management systems for your blog, e-commerce site, and native app, you can combine them with a headless CMS in a central content hub.

Therefore, you only have to create content once in your central content hub and can then deliver it to any channel and endpoint. Additionally, most headless CMSs let you define the structure of content types to your liking. So, for example, a blog post requires different data than a product, and a headless CMS ensures that you can build effective content structures for these types. With our headless CMS ContentChef, you can define the structure and fields of any content type by creating rich product and content models in JSON or using the visual editor. As a result, your developers can retrieve tailored content through a RESTful API and provide data to the channel's user interface.

Ultimately, a headless CMS can help you reduce your product's time-to-market by shortening development and content management times. Additionally, your designers and developers can focus on their craft instead of dealing with the operational burdens of a more traditional CMS. We wrote a blog post about the benefits of a headless CMS for business owners, developers, and designers – go and check it out to learn more!
How ContentChef simplifies e-commerce and digital content management
ContentChef helps you create and manage your e-commerce products and other content types effectively. As mentioned above, developers can create tailor-made content structures using our intuitive schema language or visual editor. In this way, you can create and structure content precisely as required, be it products for your shop, blog posts for your website, or other data for IoT devices. 

Additionally, you can use ContentChef for Product Information Management (PIM). This means you can create and manage your product information and catalogs in a single place, and then deliver it to the channels you want.

Provide your customers with unique and tailor-made experiences, regardless of the device or channel on which they browse your goods and content. One way to do this is to connect different types of content with your products. For example, you can display assembly instructions next to your products or display fitting recipes for a particular food. As a result, you can save your users valuable time by offering them further relevant content in the right places.
## Conclusion
A headless CMS can help you improve your content management efforts, whether you're running an online store, blog, native app, or everything together. Save time and money by managing content in one place, building rich product models, and distributing content to any channel using an API. At the end of the day, your customers and company will enjoy the flexibility and scalability that comes with a headless CMS like ContentChef for headless e-commerce.

Why don't you give ContentChef a try and see for yourself how it can help you create and manage products for your online store? [Sign up for a 30-day trial](https://www.contentchef.io/register) – no credit card required! 


Many companies have already replaced their older shop software with newer solutions known as headless e-commerce systems. In this blog post, we're going to talk more about these systems, how they complement each other, and how they can help you remain flexible and scalable in the long term.

Why choose a headless CMS for e-commerce?

Are you planning to leverage a new system for managing your digital content in 2020? If so, be sure to check out headless CMSs! These systems are a great help for your content management efforts and aid you in distributing quality content across all of your digital channels effortlessly. Let's find out what benefits you can expect from the best headless CMSs for 2020.
## What is a headless CMS?
Before we delve into the advantages of using a headless CMS, let's first talk about what headless or decoupled content management is.
If you look at more traditional CMS like WordPress, you can see that its back-end is directly connected with the front-end of your website. With a headless CMS, you are usually free to choose how you want to build your UI since the front-end is decoupled from the back-end. You enter content in a secured admin interface and store it in a central content repository from which developers access content via an API. This allows you to display content on any channel, be it your website, e-commerce site, or native app. 
![How a traditional CMS differs from a headless CMS](https://res.cloudinary.com/contentchef/image/upload/v1/chefsite-2910/L7ERWwDSvkq/CC_advantages_01)
Now that we've clarified what a headless CMS is, we can discover its benefits – especially for 2020 and the years to come!
How can your business benefit from a headless CMS?
### Shorten time-to-market
A headless CMS enables you to release new features or entirely new apps and websites in less time. One reason is that you typically use APIs to retrieve content from your CMS, saving you the time of building things within the restrictions of a more traditional system. Besides, you can quickly redesign and add new features to your products the way you see fit. 
In 2020, the market for digital products will continue to grow, and companies will strive to be more innovative and progressive than the competition. A decoupled CMS lets you act fast in this ever-changing technical landscape and offer high-quality digital experiences to your customers.
### Create multi-channel experiences
With all the different devices that users can use to experience your digital product, it is becoming increasingly important to deliver customized experiences of the same content. Using a headless CMS, you only need to create content once and then distribute it to all your connected channels. These channels can be anything, be it your blog, e-commerce site, native app, or IoT device. 
So if you plan to offer your service or product on new devices in 2020, a headless CMS will help you lay the perfect foundation. Simply connect a new channel to your content management system and start building!
### Provide users with tailor-made products
Naturally, every device and type of digital product has different requirements regarding looks and functionality. Hence, it's of utmost importance to provide your users and customers with UIs that fit the medium perfectly, increasing satisfaction and trust in your brand. As you already know, trends come and go quickly – especially in the technology industry. With a headless CMS, you stay flexible enough to react to changes, experiment with new tech, and make your business keep pace. 
## What advantages can developers expect from headless CMSs in 2020?
### Focus on programming
You probably have a pretty solid idea of what a perfect day as a front-end developer should look like. Working on an app's UI and then being disrupted by some CMS problems is most likely not part of this vision. Fortunately, with a headless CMS, you can spend your valuable time creating UIs hassle-free, without worrying about the limitations of a content management system. 
When you switch to a headless CMS in 2020, you can finally try out all the new technologies and experiment in a safe and open environment. Program as you see fit, and always work with real and accurate data from your headless CMS.
### Create UIs using your favorite front-end stack
Since you use APIs to retrieve content from a headless CMS, you can usually work with your beloved and proven front-end stack. Many headless CMSs also offer SDKs for various programming languages, which make working with the system even more straightforward. As a result, you don't need to learn a CMS-specific template language or use frameworks that you don't know or like. Also, if you want to try a new front-end framework or library in 2020, a headless CMS won't stop you! 
### Get things done faster
Continually releasing new features and bug fixes is essential for your business to stay relevant to the market. As discussed above, a headless CMS can help you reduce time-to-market times by stripping away the complexity of more traditional content management systems. Another great advantage of headless CMSs is that you and your entire team can work with real and accurate data in all development environments right from the start. As a result, you don't have to rely on hardcoded dummy data during development and always see what your user interface will look like for your users.
## Advantages of a headless CMS for designers in 2020
### Focus on designing
Designers shouldn't have to worry about the CMS used and its restrictions. Therefore, a headless CMS is a perfect opportunity to take that burden off the shoulders of design experts. Get creative and think outside the box to come up with new and innovative ways to provide users with great experiences. In this way, your company can take a leading role in the market and deliver valuable products and services to your customers in 2020 – and in the years to come.
### Improve collaboration with developers
The digital products we develop today require designers and developers to work closely together. Only then can companies publish the best digital solutions in terms of appearance and functionality. Both parties have valuable insights and expertise to share with one another that can take your products to the next level. A headless CMS relieves most of the operational burdens of conventional systems and gives you more time and freedom to innovate, design, and build with new technologies in 2020.
### ContentChef helps you achieve your content goals in 2020
A headless CMS can help you in several ways, whether you are a business owner, developer, or designer. With our CMS ContentChef, you benefit from all the advantages discussed – and more! If you want to distribute content to multiple channels and release tailored digital experiences, our headless CMS may just be what you're looking for. 
Why not give ContentChef a try? We invite you to [sign up for a 30-day trial](https://contentchef.io) and see for yourself how you can benefit from a headless CMS.

Are you planning to leverage a new system for managing your digital content in 2020? If so, be sure to check out headless CMSs! These systems are a great help for your content management efforts and aid you in distributing quality content across all of your digital channels effortlessly.

The Advantages of a Headless CMS for 2020

Since 2015, static sites had become more and more popular. Developers and businesses started to see the advantages of using static site generators such as Jekyll instead of relying on coupled CMS. A community that has grown considerably in recent years due to these developments is the JAMStack community. In this blog post, we're going to take a closer look at the JAMStack, and why it's a perfect match for your headless CMS!

## What is the JAMStack, and why does everyone talk about it?

JAMStack doesn't define the tools you use but instead describes a modern and efficient way to build websites. So, let's first learn about the concepts behind JAMStack:

* J, as in JavaScript – you handle every dynamic functionality on your website with JavaScript – you can use any framework or library you want.
* A, as in APIs – you use JavaScript to access data through APIs (over HTTPS). These can either be your own APIs or third-party services.
* M, as in Markup – your entire website consists of static HTML files that you can generate from Markdown or with static site generators like Gatsby.js.

![The JAMStack courtesy of our friends at Cloudinary.com](https://res.cloudinary.com/cloudinary-marketing/image/upload/c_fill,w_770/dpr_2.0,f_auto,fl_lossy,q_auto/v1/Web_Assets/blog/JAMstack-Delivers-v1.png)

Static site concepts like the JAMstack show us where the future of websites and apps will lead us. Instead of having a CMS coupled to your website's front-end, which is restrictive and slow, the JAMstack offers developers new freedom.

We are sure that this trend will continue. More and more developers will say goodbye to the times of server-side applications and welcome client-side stacks into their lives.

## How can you benefit from using the JAMStack?

If you're wondering why you should give JAMStack a chance, let's take a look at the benefits companies, and developers can enjoy.

When working with monolithic content management systems, such as WordPress, front-end developers often need to work around the system's limitations and probably also have to work on the back-end side. Naturally, this isn't the optimal solution and can frustrate engineers. With JAMStack, front-end developers can devote their time to what they do best – to build intuitive user interfaces. As a result, you can ship your products to the market faster and increase your front-end developers' satisfaction!

Due to the decoupled architecture, you can use the JAMStack to provide safer, more scalable and faster web apps. It has become a best-practice to deliver the static HTML files and assets through a content delivery network (CDN). As a result, you can scale up or down resources as needed, and serve files more quickly.

Eager to learn more about JAMStack and its best-practices? Then make sure to check out this website about [JAMStack](https://jamstack.wtf/).

## Managing content with JAMStack and a headless CMS

Headless CMSs (also known as a decoupled CMS) are also a relatively new technology that has emerged in recent years. Typically, these systems offer you a secured admin interface, through which you can manage all your content. You then use APIs to get the content and display it on any channel.

The main benefit you can enjoy with a headless CMS is that you only have to create content once and then deliver it wherever you want. Thus, displaying your content on your e-commerce site, web app, native app, or IoT device becomes a straightforward process. If you want to learn more about how headless CMSs work, read our blog post, "[What is a headless CMS, and how can it help you?](https://www.contentchef.io/blog/what-is-a-headless-cms)."

Since the JAMStack relies on APIs to retrieve content from a database or a third-party service, a headless CMS is perfect for supplying your web app with content. If you combine the two technologies, you can still work with any front-end framework or library you want. Headless content management systems give you the freedom to create tailor-made user interfaces that your users will love.

## Why ContentChef is a perfect match for the JAMStack

ContentChef is a headless CMS developed for delivering customized multi-channel experiences. You can manage your content on the ContentChef dashboard, determine when and where you want to display content, and finally access the data using content delivery APIs. Let's see why we believe ContentChef is an excellent addition to your JAMStack web apps!

## Use powerful APIs and SDKs

As discussed earlier, APIs are a fundamental part of every JAMStack and headless CMS. ContentChef allows you to build and deploy content delivery APIs to quickly and securely deliver the content you want to your web app. We also offer Typescript-compatible SDKs so that you can integrate ContentChef's functions tightly into your JavaScript project.

This makes retrieving data a hassle-free experience, and you can spend more time creating the perfect user interface for your web application.

## Create tailor-made content structures

With ContentChef, you can create content structures using our intuitive schema language based on JSON. As a result, you can define what the architecture of each content type looks like and make things easier when you feed the data to your app. For example, a product for your e-commerce site certainly requires different data than a blog post. And it would be a real hassle if the content structure for blog posts included data fields for prices and product descriptions, right? Thus, being able to create tailor-made content structures helps you stay organized, responsive, and fast.

## Leverage push and pull distribution

Once your content editors created content in the ContentChef dashboard, they can leverage the user-friendly publishing workflow to ensure that everything works as expected.

First, publish content in staging to preview your content. If everything looks good, post it in live mode. Additionally, you can specify the channel in which you want to display your content. This way, you no longer have to worry about accidentally showing products on your blog or vice versa. 

Pulling content is also straightforward as a headless CMS gives you control over where you send what data to. Using content delivery APIs, you can get the content you need, where you need it, and provide your user interfaces with perfectly structured data.

## Conclusion

The rise of static site generators, headless CMSs, and the JAMStack already let us guess what the future will bring. More and more web developers will move away from server-side applications and take advantage of the freedom that comes from client-side stacks like JAMStack.

What do you think about the JAMStack? If you want to give it a try, we recommend that you connect your JAMStack project to our headless CMS ContentChef to feed your UI with data via APIs. [Sign up for a 30-day trial](https://app.contentchef.io/registration) and get started right away.


In this blog post, we're going to take a closer look at the JAMStack. What is it and why it's a perfect match for headless CMS like Content Chef.

Why work with JAMStack and a headless CMS in 2020?

I started developing web solutions in early 2000, and I've seen a vast amount of technologies raise and fizzle out in a few years. However, CMS is still around and one major component of many web architectures. Today with all the emerging digital touchpoints like websites, mobile apps, chatbots, and connected IoT devices, it's even more critical to choose the right CMS and presentation layer technology for all our channels.
I want to point out that there's no single best CMS that will work in any scenario, and the very first step of every project is to define what matters to us. What are we trying to achieve? What goals do we need to support with our technical solution? What are the constraints in terms of budget, timing, and skills of our team? To make a sound choice is critical to have clear answers to all those questions.
 
## Headless CMS or traditional monolithic CMS?
Headless CMS (if you need a swift intro to what a Headless or decoupled CMS  is, you can read our article here) shines when you need to manage multiple digital touchpoints. If your CMS has to support different websites or apps or event IoT devices(like an in-store kiosk or smartwatch, for example), having everything in one single content hub is a huge advantage. Your editors can manage them all from a single dashboard without worrying about replicating and synchronizing the content on different systems, and your developers and designer take care of displaying them most properly on every device. Instead, if you are creating a single website and your content will be shown just there, maybe a traditional CMS as a single content repository will work just fine, but even in those use cases, you might want to consider other aspects both from the technical and business side.

## What technology to use for the presentation layer? 
Traditional monolithic CMS also imposes a specific technology for the presentation layer, and that may fit your project or not. In choosing a technology for your UI, there are many aspects to consider. At least you must take into account: skillset of your development team and the ability of this specific technology to meet the technical and design requirements of your project. It's no surprise that mastering a language/platform is crucial to the success of the project because you need to create a secure, scalable solution that matches your goals. What happens if your Javascript and React developers are suddenly forced to write JSP or PHP? You probably know the answers.
Designing and crafting the perfect UI/UX for optimal content delivery is not an easy task, and coupled cms may impose further restrictions on the choices of designers and coders.

## Opensoucre or commercial?
There are a lot of good choices in the opensource community of both headless & traditional cms, so why choosing something different? 
Why choosing opensource in the first place? Maybe you want opensource for budget reasons, and that's it's perfectible reasonable even, of course, you should consider all the costs of setting up and running your infrastructure(more on this later).
Another reason is that you may want to keep control of your CMS code. That was particularly true in a traditional CMS where the code developed is strictly tied to the underlying CMS system, but in a headless architecture, that's not true anymore because you develop separate frontend code that consumes content via REST API.
It will be much easier to migrate or change the CMS API without rewriting all the frontend code( for example, you may first develop a compatibility layer that adapts the new CMS API to the old one). A headless CMS is much more microservice oriented and fits much better in this kind of architecture as the content provider component.

## Self-hosted or SaaS? 
Another critical choice is between self-hosting the solution or having a SaaS provider manage all the delivery infrastructure.
Self-hosting a solution requires nontrivial skills in managing the specific solution and all the burden of setting up, tuning, and keeping in good health the delivery stack. Plus, of course, the costs of servers or cloud services consumed.
In today's world, you have to guarantee consistent performance under heavy loads, manage sudden spikes, and also take care of security and compliance with many privacy regulations (GDPR, for example).
Having a team of specialists that manage all these issues for you may prove to be more cost-effective than hosting the solution on your own, especially if you do not already have a dedicated ops team.

## What is your overall architecture?
It's not a new trend for enterprises to lean towards microservices architectures because there are numerous business and technical advantages ( and a few challenges, of course!). If you already have or are moving towards a microservices-based architecture, fitting a traditional CMS may be harder because there's no strict separation between frontend and backend code. Even more, your content data will probably be stuck in a silo in an unstructured way lacking proper content modeling, which makes it very hard for other systems to use them properly.
That's why headless CMS is adopted more easily in modern architectures as a component that manages the creation and the delivery of structured content for all the frontends ( or even others backend as well!) of your technology ecosystem.
![ContentChef fits right in!](https://res.cloudinary.com/contentchef/image/upload/v1/chefsite-2910/L7ERWwDSvkq/CC_articolo02-02)
## So, what's the best headless CMS?
By now, you should have a good idea if a SaaS Headless CMS may be the right choice for your project. In that case, the best headless CMS is [ContentChef](https://www.contentchef.it)! No doubt about it! :)
Of course, I'm just joking, as for any product, there's no "best," and it really boils down on how each product fits in your specific use case. Nonetheless, I will be delighted if you give [ContentChef](https://www.contentchef.it) a try and see if it's the perfect match for your needs. 


How to choose the right CMS component for you next project, that fits your budget, architecture and skillsets.

Choosing the right (Headless) CMS for your project

Check out the latest news from ContentChef