Next-Gen Content Workflows in Strapi

on YouTube ↗25m

" summary

Strapi 5 Preview embeds front ends inside the admin using a single iframe proxy whose source is computed by a config function that can point to a Next.js API endpoint; that endpoint sets a draft-mode cookie to let previews show unpublished content without affecting production. The proxy forwards editor events via postMessage forwarding to nested iframes, hosts a device selector and QR flow for Expo development builds, and implements field-level highlight updates so real-time, multi-platform preview workflows actually work.

AI-written summary · about

" chapters (10)

1. 0:00Introduction: Why Strapi 5 Preview is a Game Changer
2. 1:23How the Preview Feature Works (Behind the Scenes)
3. 2:59Setting Up Preview with Strapi Launchpad
4. 5:15Multi-Frontend Preview Setup: Web + Native
5. 6:31Creating a Custom Proxy Page Inside Strapi Admin
6. 9:46Supporting Preview in Web and Mobile Apps
7. 14:24Handling Real-Time Preview Changes and Events
8. 18:58Responsive Preview Across Devices (Web, Tablet, Mobile)
9. 20:26Further Customizations: Highlight Changes, Device Views
10. 22:28Final Thoughts: Why Preview Empowers Content Teams

" related talks

• 22mNuances of Iframe: Lessons from Contentstack Live PreviewDeepak Kharah · React India 2024
• 31mEditorial workflows, GIT them here!Chad Carlson · StrapiConf 2021
• 15mBuilding Modern CMS Driven Web Applications with Next.jsDaniel Madalitso Phiri · Next.js Conf 2021
• 20mWebstrates: Shareable Dynamic MediaClemens Nylandsted Klokmose, Wendy E. Mackay, Michel Beaudouin-Lafon, James R. Eagan, Siemen Baader · UIST 2015
• 09mFrom 0 to Strapi in Production in 60 daysAnisha Malde · StrapiConf 2021
• 07mBoosting Productivity and Team Velocity with StrapiArlene Zavala · StrapiConf 2021
• 24mThe Future of Editing WebsitesSadek Drobi · backendlessConf_ 2019
• 08mHeadless - The Future of CMS Is HereSamuel Snopko · React Advanced 2022