Empowering Efficiency: Unifying 11 Unique Websites with Next.js and Storybook

on YouTube ↗10m

" summary

Claims a working system that consolidates 11 websites into two repositories using Next.js Storybook and Storyblok and shows what’s built and how it runs not just theory The repo uses environment variables to load site specific assets rewrites and redirects run via middleware static generation for terms and SSR where needed a Storybook component library supplies TypeScript types reusable functions Cypress tests run across sites and updates deploy to all sites with a one-click GitHub deployment

AI-written summary · about

" chapters (9)

1. 0:00Component duplication pain
2. 1:27Introducing the problem
3. 2:32Storybook for consistency
4. 3:13Storyblok integration
5. 3:54Next.js for efficiency
6. 5:19Multilingual support
7. 6:25Reducing repositories
8. 8:10Flexible component sharing
9. 8:55Closing and key takeaways

" related talks

• 40mGoing Headless: Zero to Next js HeroSamuel Snopko · Next.js Conf 2020
• 22mHow micro-frontends and NextJS can 4x site performanceEmily Thomas · React Day New York 2021
• 27mThe story of storybookNorbert de Langen · ReactJS Day 2017
• 09mNx + Next.js = ❤️Adam L Barrett · React Summit 2020
• 07mReact components, atomic design and storybookEinar Afiouni · NDC Oslo 2017
• 38mReact-Storybook: Design, Develop, Document and Debug your React UI componentsMarie-Laure Thuret · React Alicante 2017
• 14mRewriting eaze.com with Next.jsJack Hanford · ZEIT Day 2018
• 32mKickstarting libraries of shared React components for multiple teamsSurya Ambrose · reactjsday 2019