Engaging Ecommerce with the Visual Web

Colby Fayock

From Code to Scale! Build a Static Web App in Minutes

John Papa

What Does The Angular Say? 🦊

Laura Silvanavičiūtė

Building for Web and Native with Ionic & React

Building for Web and Native with Ionic & Vue

Mike Hartington

Data Loaders - Elevating Data Fetching in Vue

Eduardo San Martin Morote

Reusing App State in React Native with Recoil

Sergii Zhuravel

Using Next.JS and Redux for Epic Noscript Web Apps

Daniel Skogly

Building Modern CMS Driven Web Applications with Strapi the OSS Headless CMS

Daniel Madalitso Phiri

How to Share Code between React Web App and React Native Mobile App in Monorepo

Emily Xiong

GraphQL for Web and Mobile Apps Made Simple

Johan Eliasson

How not(!) to Build Real-time Apps

Nikolas Burk

Build a Universal Reactive Data Library with Starbeam

Yehuda Katz

MIDI in the Browser... Let's Rock the Web!

Jean-Philippe Côté

The Next Wave of Web Frameworks is BYOJS

Brandon Roberts

Web Accessibility in JavaScript Apps

Sandrina Pereira

Build Web3 apps with React 

Shain Dholakiya

Build a Fullstack App Fast with Modern Tools

Christian Nwamba

Digital Ecology: How Can You Mitigate the Carbon Footprint of Websites?

Katarzyna Wojdalska

The Art of Rendering Modes: Go Beyond a Blank Page

Alexander Lichter

Progressive Enhancement - What It Is and Isn’t, a Practical Introduction With Svelte

Elliott Johnson

Domain Driven Design with Vue Applications

Abdulrasaq Mustapha

WebAssembly and React: A New Era of High-Performance Web Applications

Ramón Huidobro

Observability Matters: Enhancing Performance of our Node Application with OpenTelemetry

Yash Raj Verma

Vue.js Live Conference

Vue.js Live 2024

Data fetching is a critical part of modern web applications. It's a complex problem that has been (partially) solved in many different ways. In this talk, we'll explore the new Data Loaders API for Vue Router, how it compares to existing solutions, and how it can greatly simplify data fetching in your Vue applications.

Node Congress

Node Congress 2024

Are you building a chat app, a way to see users’ online status or a real-time collaboration dashboard? All of these use cases have one thing in common: Somehow the user-facing application needs to be informed in real-time about events that happen on the backend of your application.In this talk, we’ll look closely at common approaches like polling, application-level updates and pub-sub systems. We’ll explain the tradeoffs with each approach and elaborate why another approach, called Change Data Capture (CDC), is the most elegant and robust way to achieve this.

Have you ever considered that when we encounter terms like observability and reliability, our initial instinct is usually to attribute them solely to SRE concerns? Yet, upon closer examination, one may realize that actually implementing observability is, in essence, more aligned with the domain of developers. After all, developers are the ones who directly implement the actual logic into our existing codebase, and who better to understand and debug their code than the developers themselves? Through this session, we will emphasize on understanding the importance of observability specifically from a developer's perspective. Let's explore some best practices that help us effectively debug the performance of our Node application and how the inclusion of open source frameworks like OpenTelemetry could be beneficial to us.

React Day Berlin

React Day Berlin 2023

Hold on, WebAssembly on the server?! I thought it was for browser! In this talk, we'll explore the benefits of using low-level languages on the server-side, and the different possibilities that WebAssembly provides for building high-performance web applications. We'll dive into different providers for WebAssembly functions, as well as practical use cases for integrating WebAssembly with React. By the end of this talk, you'll walk away with a deeper understanding of how server-side WebAssembly and React can be used together. You'll also gain practical insights into how to use low-level languages on the server-side, and tips for overcoming common challenges when integrating WebAssembly with React.

JS Nation

JSNation 2023

Progressive Enhancement is the philosophy of providing a basic, functional experience to everyone, regardless of device, and adding additional layers of interactivity and delight as they are supported. The last decade of web development, focusing on SPAs, where JavaScript is a hard requirement, have made this philosophy very difficult – how do we make websites that are fundamentally built with JavaScript accessible to users without it? This talk examines the philosophy behind Progressive Enhancement, then focuses on some concrete examples (including a dive into Svelte compiler output!) of how we can build functional, reliable, and usable experiences for all, adding delightful interactivity for those who can support it.

Vue.js London 2023

Introduction to Domain Driven Design<ul><li>- What is DDD?</li><li>- Key principles of DDD</li><li>- Benefits of using DDD in web application development</li></ul>Domain Modeling in Vue 3 Applications<ul><li>- How to design and implement domain models in Vue 3</li><li>- Strategies for integrating domain logic with Vue's reactive data model and component-based architecture</li></ul>Best Practices for Implementing DDD in Vue 3<ul><li>- Strategies for organizing code in a way that follows DDD principles</li><li>- Techniques for reducing coupling between domain and application logic</li><li>- Tips for testing and debugging domain logic in Vue 3 applications</li></ul>

In the world of Single Page Applications, client-side rendering has long been the go-to method for rendering content. However, as SPAs have evolved, other rendering modes have emerged that offer different advantages and disadvantages. In my talk, we will explore why it's important to go beyond a blank page as initial request and explore different rendering modes like SSR, SSG, ISG and more. We'll not only cover the pros and cons of each mode but also provide real and comparable examples. By the end of the talk, you'll have a better understanding of the different rendering modes available for SPAs, and be able to choose the best one for your needs. Join my talk to explore the art of rendering modes.

React Day Berlin 2022

Did you know that about 250 000 websites are published every day? The majority uses too heavy fonts, unnecessary images or utilises redundant libraries generating carbon footprint. ec0lint is a tool for frontend developers that mitigates the carbon footprint of websites by showing tips on how to create a more climate-friendly code. Thanks to code optimization ec0lint can help in reducing emissions from 1.8 g to ~0.2 g per one view saving 216 kg CO2 for each website (-88%!) annually.

React Summit

React Summit 2022

Usually creating web and mobile apps require different tech stacks, and it is pretty hard to share code. This talk will show how I added a React web app and a React Native mobile app in the same monorepo using Nx, and how I optimized codeshare between react web app and react native mobile app.

JSNation 2022

Web application development has had many shifts over the lifetime of the web. From server-side applications with a sprinkle of JavaScript to Single Page Applications built entirely with JavaScript. Now we’re heading back to where many new web frameworks build for static first, with JavaScript added as needed. This talk covers building web applications with JavaScript through the lens of Astro, a static site generator where the choice of JavaScript framework is uniquely yours. <a href="https://www.froala.com/wysiwyg-editor?pb=1"></a>

If you own an electronic music instrument made in the last 3 decades, it most likely supports the MIDI protocol. What if I told you that it is possible to interact with your keytar or drum machine directly from your beloved browser? You would go crazy, right? Well, prepare to do so…With built-in support in Chrome, Firefox and Opera, this possibility is now a reality. This talk will introduce the audience to the Web MIDI API and to my own WEBMIDI.js library so you can get rockin' fast.Web devs, man your synths!

Experiences on the web have grown increasingly visual, from displaying product images to interactive NFTs, but not paying attention to how media is delivered can impact Core Web Vitals creating a bad UX with slow loading pages, hurting your store’s conversion and potentially losing sales.How can we effectively leverage media to showcase products creating engaging experiences for our store? We’ll talk about media’s role in ecomm and how we can take advantage of it while optimizing delivery.

GraphQL Galaxy

GraphQL Galaxy 2021

Building web and mobile apps with GraphQL should be simple. With Nhost, developers build web and mobile apps with automatically generated GraphQL APIs. In this talk, we'll show you how this is ideal for developers who want to boost productivity without worrying about infrastructure. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

React Advanced

React Advanced Conference 2021

A short exploration of a method for building websites that work without JS, while still enjoying the convenience of modern frontend and backend technologies - with live coding! <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

A group of volunteers all over the world is working on React and React Native apps for the ADHD America program (non-for profit organization). In our work we use Recoil - quite a new React state management tool that looks quite promising. I'll show how we use it in both apps - for web and for mobile and explain why we decided to try it. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

JSNation Live

JSNation Live 2020

We are very used to generating visual results with code but are still often surprised to hear that we can create music in the same way. Oh, you didn’t know that? You are not alone. Even though the idea of music programming is older than all of us this concept is still pretty unfamiliar among many developers. Not for long! Let's shed some light on music coding in our daily bases web applications using Angular. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

You've built an app and you want it to scale. Do you want CI/CD, custom domains, SSL certificates, APIs, global scale of your static assets, authentication, and authorization? Let's learn how to build a static web app on Azure and go from GitHub repo to global scale in minutes. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

This session will focus on Starbeam's universal building blocks. We'll use Starbeam to build a data library that works in multiple frameworks.We'll write a library that caches and updates data, and supports relationships, sorting and filtering.Rather than fetching data directly, it will work with asynchronously fetched data, including data fetched after initial render. Data fetched and updated through web sockets will also work well.All of these features will be reactive, of course.Imagine you filter your data by its title, and then you update the title of a record to match the filter: any output relying on the filtered data will update to reflect the updated filter.In 90 minutes, you'll build an awesome reactive data library and learn a powerful new tool for building reactive systems. The best part: the library works in any framework, even though you don't think about (or depend on) any framework when you built it. Table of contents- Storing a Fetched Record in a Cell- Storing multiple records in a reactive Map- Reactive iteration is normal iteration- Reactive filtering is normal filtering- Fetching more records and updating the Map- Reactive sorting is normal sorting (is this getting a bit repetitive?)- Modelling cache invalidation as data- Bonus: reactive relationships

React Advanced Conference 2022

Learn how to build web apps from design in Figma to deploying to AWS while moving very fast.

React at scale with Vodafone

The workshop is designed to help Web2 developers start building for Web3 using the Hyperverse. The Hyperverse is an open marketplace of community-built, audited, easy to discover smart modules. Our goal - to make it easy for React developers to build Web3 apps without writing a single line of smart contract code. Think “npm for smart contracts.” Learn more about the Hyperverse <a href="https://www.decentology.com/hyperverse">here</a>. We will go over all the blockchain/crypto basics you need to know to start building on the Hyperverse, so you do not need to have any previous knowledge about the Web3 space. You just need to have React experience.

Often we see JavaScript damaging the accessibility of a website. In this workshop, you’ll learn how to avoid common mistakes and how to use JS in your favor to actually enhance the accessibility of your web apps! In this workshop we’ll explore multiple real-world examples with accessibility no-nos, and you'll learn how to make them work for people using a mouse or a keyboard. You’ll also learn how screen readers are used, and I'll show you that there's no reason to be afraid of using one! Join me and let me show you how accessibility doesn't limit your solutions or skills. On the contrary, it will make them more inclusive! By the end, you will:- Understand WCAG principles and how they're organized- Know common cases where JavaScript is essential to accessibility- Create inclusive links, buttons and toggleble elements- Use live regions for errors and loading states- Integrate accessibility into your team workflow right away- Realize that creating accessible websites isn’t as hard as it sounds ;)

When building an app, there are many options choices developers need to make. Is it a web app? Does need to be a native app? What should I use for UI? In this workshop will look at how to make use of Ionic for building your app and how to deploy it to not only the web, but native as well. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

In this workshop, we'll build out a fully functional website and integrated blog with Next.js and Strapi. Table of contents: - An introduction to Headless CMS and supported architectures - Getting up and Running with Strapi and Next.js - Integrating Blog functionality into a Next.js app - Deploying your Next.js and Strapi Apps Bonus - Implementing content previews with Next.js Prerequisites:Basic React Knowledge Basic knowledge of Node.js and npm Basic Web Concepts. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Vue.js London Live 2021

When building an app, there are many options choices developers need to make. Is it a web app? Does need to be a native app? What should I use for UI? In this workshop will look at how to make use of Ionic for building your app and how to deploy it to not only the web, but native as well. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

#web apps