Discover the latest features of Slice Machine that provide a simplified experience that makes creating and managing websites more intuitive than ever.

Simplify How You Build Websites with the Latest Slice Machine Features

We've always believed that the power of Prismic lies in its ability to facilitate the way we approach website building. We've listened, observed, and engaged with your thoughts and ideas. You told us things could be simpler, more intuitive. 

 And we agree. We've always championed the power of simplicity, and now we've applied that same philosophy to Prismic itself.  

Websites, at their core, are simple. They are a collection of URLs, pages, navigations, and sections. But amidst the chaos of creating and managing, this simple truth can get lost. This begs the question: if websites are simple, shouldn’t the process of creating and managing them also be simple? Our team at Prismic believes so, which is why we’re taking a step forward by going back to basics.  

We make websites, and we believe that our tools, including Slice Machine, should be as simple as that. We centered our focus on website essentials to provide you with a simplified experience that makes creating and managing websites more intuitive than ever.  

We understand the importance of minimizing pain points and maximizing efficiency for our users, and we are excited to dive into some of the latest features of Slice Machine that do just that!

To be able to enjoy all the new features discussed in this article, please make sure you have updated Slice Machine to the latest version by running:

Additionally, you will need to make sure you have updated your Slice Machine adapter by running:

Next: npm install --save-dev @slicemachine/adapter-next@latest
Nuxt2: npm install --save-dev @slicemachine/adapter-nuxt2@latest
Nuxt3: npm install --save-dev @slicemachine/adapter-nuxt@latest

You may have noticed a new 'page types' option in the Slice Machine menu that was added at the end of May.  

With page types we're putting the power back in your hands. Building your page types will be a breeze. —Slices, Slice Templates, SEO & Metadata management—you name it!

Users now have the option to use page types as the new entry point for creating page models in Slice Machine. The introduction of page types offers a more streamlined approach for creating specific page layouts with predefined metadata. They are designed to simplify creating pages with consistent metadata, such as UID and SEO settings. This can be particularly useful for improving SEO optimization and ensuring a standardized structure across your website.

Page types are just the beginning of a series of initiatives to reflect the simplicity of website creation and even further simplify it. 🙂 

This last quarter was dedicated to releasing the first versions of the page type initiative. Our team is committed to continue improving page types with the goal of making it the place to quickly and seamlessly create pages for your website.

Custom types have not gone away. They can still be used for creating models for non-page components such as product items, authors, and more.

Want to turn your old custom types into pages to be sure you don’t miss the awesome new features of page types? No problem! You can just click on the three dots on your custom type and select ‘Convert to page type.’ This will not impact your data model or how you retrieve content from Prismic.

In addition to the page type initiatives, the team has recently added a few nice features to improve your workflow.  

Create Slices directly from your page type

Previously, creating a new Slice required navigating to the Slices section in the menu and then going back to the page types to make it available to use. This process was found to be quite tedious. With the most recent release, you can now create Slices directly from the Slice Zone within a page type and automatically add newly created Slices to it.  

Cut down on development time with Page Snippet

Users can now copy a code snippet and use it as a boilerplate for their page component. This makes it easier to get started with building both single and repeatable pages. 

If you’re using Next.js, the Page Snippet feature offers support for both the App and Pages Router and allows you to toggle between them so you can easily grab the snippet of code you need.   You can also check out some other improvements for our Next.js support that were shipped recently.

Prismic Academy is our brand-new learning platform for users who are just getting started with Prismic and Next.js. The lessons will give you an in-depth understanding of Prismic’s core concepts and features, with practice activities and fun quizzes to help test your knowledge.

Prismic Academy is accessible directly through Slice Machine by clicking the 'Tutorial' link in the navigation on the left.

As we look toward the future, the team will keep working on two fronts.

Continue simplifying our concepts to let any new developer have an easy and enjoyable experience creating their website with Prismic and Slice Machine. Our goal is to continue to improve our page types feature in addition to adding similar capabilities for building common website elements such as pages, sections, navigations, and URLs. We increasingly want custom types to be used for the really custom use cases.

Continue to improve the core capabilities of Slice Machine to allow you to achieve what you initially chose us for - build an awesome website easily. We want to continue to remove Slice limitations so you can build freely, without constraints. 

Don’t miss out on any exciting updates! Check out our progress page to stay informed about the latest shipped features and what’s currently in the works!

Want to stay in the loop about our latest features? 

We are excited to see how these new features transform your development experience and make your website creation process even more enjoyable. Stay tuned for more updates, and happy building with Slice Machine!

Slice Machine is the local build tool that will make Prismic every developer's favorite CMS. We're constantly striving to improve developer experience.

Improve Your Prismic Developer Experience with Slice Machine V0.2

Prismic has been putting all our efforts into providing the best developer experience for building websites with modern frameworks, such as Next and Nuxt. We’ve worked hard to provide awesome libraries to help kickstart a project with your favorite stack. And it was this focus on developer experience that first brought you Slice Machine, the Prismic local build tool for Next and Nuxt.

Why have we focused on our local tool? At Prismic we are convinced that the best way to ship faster is to iterate faster. By iterating fast we mean being able to create, edit, and preview components and pages locally — without the hassle of having to query production data.

So, how much time does Slice Machine save? Building with Prismic was fast. Slice Machine makes it three times faster.

And now, we’ve made Slice Machine even better in V0.2 ...

With our latest release, we’re solving some of your biggest pain points to make it even easier to build with Prismic and Next or Nuxt. Between the latest improvements and previous innovations, here’s how Slice Machine does it.

Before introducing Slice Machine, for any headless CMS like Prismic, the process of visually testing Slices and pages before shipping to production was a bit time-consuming.

To make sure a Slice or a page matched the expected design, it had to behave properly with the data coming from the API. This process was tedious because the developer had to endlessly go back and forth to the content repository to add data and then see how the website looks locally.

Slice Machine streamlines this process by providing code snippets for every field type, providing mock data for testing, and providing a new tool for local previews. Here’s how these innovations work:

Code snippets help you save precious time building your components and pages using your repository data. Each code snippet shows you how to properly access data from the API and provides the Prismic component for displaying it.

A local preview feature, called Slice Simulator, now helps developers preview their Slices in one click and on different viewports, without a lot of extra setup steps or a new tool to learn. Storybook is still available as an option for developers who are using the tool to do more than preview Slices.

Customizable mock data for every content field enables developers to preview Slices without having to manually fill in the content in a Prismic repository.

Before introducing Slice Machine, Slices could be used as components, but only inside their parent Custom Types.

For example, if you had a Testimonials Slice created in your Home Page Custom Type, you couldn’t use it in another Custom Type without duplicating it (and then ... maintaining it in both places).

Now, with Slice Machine, your Slices work across all Custom Types. Taking the same example, it means that you now only need to create your Testimonials Slice once, and then you can use it in any other Custom Types. 

For content editors, it brings much more flexibility for creating website pages, for the same reasons that components are powerful for developers. Taking this example again, they could easily create a new, let’s say, Product Page and add the Testimonials Slice, no problem. 

The possibilities are endless for content teams with that much flexibility.

Before Slice Machine, using Prismic meant creating and maintaining all models in the editor, and making sure the code was up to date with the data models manually. This meant that a change in the data models in the repository could break the website, which could leave you with quite a mess, especially if you weren’t versioning your models on your own.

With Slice Machine, you can now version and maintain your models in sync with your code. Now, for every model, JSON files live in your code, so you can version them using your Git workflow, and your code becomes the single source of truth for content modeling.

Ready to try Slice Machine for yourself? Awesome. Here are three ways you could give it a try:

Start a new Next or Nuxt project and ensure that dependencies are installed. Then run `npx @slicemachine/init`.

Already have Slice Machine on your project? Just start it, and you will be asked to upgrade to the new version.

Or you can spin up a test drive in no time with an example project from our documentation.

Deliver a website with a visual Page Builder for your marketing team

Côme Sabran

Simplify How You Build Websites with the Latest Slice Machine Features

Improve Your Prismic Developer Experience with Slice Machine V0.2

Deliver a website with a visual Page Builder for your marketing team