Next.JS has long been the favored framework for React enthusiasts, but with the recent Next V13 update, things have taken an intriguing turn. The new version has introduced some highly anticipated features that have left developers with mixed feelings. The challenges arise from React's extensive history predating Next.JS, making it difficult to seamlessly integrate new functionalities like the 'Servicer Action' and others. However, Next.JS stands out as one of the first frameworks to tackle the server/client territory within a single code block. This innovative approach is still in its early stages and promises to shape the future of frameworks to come. To delve deeper into this exciting topic, make sure to attend our event.

This talk is a comprehensive guide to building Progressive Web Applications with React. We will begin by introducing the concept of PWAs and highlighting the benefits they offer, including offline capabilities, fast loading times, and app-like experiences. We will then delve into the core principles and features of React, showcasing how it can be leveraged to create high-performing PWAs. We will cover the implementation of service workers, which enable offline access and background synchronization, allowing users to interact with your application even without a stable internet connection. We will explore caching strategies to optimize the performance of PWAs, ensuring quick and reliable access to cached resources.

This workshop dives into the core of building resilient, scalable, production-ready applications with React and Next.js, grounding you in a pragmatic approach to software development. We’ll tackle common web performance pitfalls, showing you how to make impactful optimizations without compromising readability, maintainability, or speed, essential when delivering under tight timelines. You’ll explore resilience patterns that enable your applications to perform reliably under real-world demands along with how to make the right compromises, whether you’re building for early-stage platforms or scaling up to serve millions of global users.

Covering React reconciliation fundamentals, we’ll provide the context needed for structuring large-scale component architectures, alongside best practices for designing components that stay maintainable over time. Through a case study using TanStack Query, you’ll tackle data fetching at scale to ensure optimal app performance with complex data requirements.

Finally, we’ll focus on post-deployment strategies, including setting up observability and monitoring tools to detect issues early. This workshop provides an adaptable playbook for creating robust applications that endure, building a skill set to navigate the evolving problem spaces and needs across different project stages, whether you’re developing from scratch or scaling for global audiences.

This talk explores the intersection of Next.js, React Query, and the Backend for Frontend (BFF) design pattern, three vital elements pieces that help solve the puzzle of performant and scalable data fetching.

I’ll start by discussing Next.js and its capabilities for React applications, highlighting its features like server rendering and data pre fetching, and route pre-fetching. I’d then delve into client data fetching and state management, showcasing how React Query brings a new perspective to managing server state hydration in React applications, simplifying data fetching, caching, synchronization, and updates.

The last part of the talk will take the topic further by introducing the Backend For Frontend (BFF) design pattern, demonstrating how a BFF can be integrated with NextJs API handler to work seamlessly as a Proxy with a React application, enhancing user experience and performance by spreading the load of large payloads.

Throughout the talk, real-world examples will be used to provide a practical understanding of these topics.