Building web in 2024

React Alicante 2024

On this page, you can find a full list of all React Alicante 2024 talks with my short comments. A longer opinionated summary at the end.

Enjoy and feel free to reuse it if you need a summary for your team or employer.

Table Of Contents

Sessions - Day 1

17 high quality talks on React Server Components, Astro, SolidJS, a11y, and good old CSS!

Composition is King by Chance Strickland

@chancethedev

Despite the fact that React is shifting to the server, its core principles, composition and UI as a function of state, won’t go anywhere.

Enhancing Forms with React Server Components and React 19 by Aurora Scharff

@aurorascharff (slides)

A hands on demo of server components and actions in Next.js. Aurora popularizes RSC in her talks, workshops, and a blog where she publishes in-depth RSC guides. She also recommended me a case study talk from Tomas Jansson as an example of RSC in production (of course, in Next.js).

Debugging JS and React by Mark Erikson

@acemarke (older version of slides from 2023)

A good refresher on debugging techniques from Redux maintainer. I’ve never used console.table() or console.count() before. console.timeStamp() should be handy in profiling, too.

Building Complex UI with State Machines by Erik Rasmussen

@erikras (code)

Erik, who is most famous for redux-form and final-form, walked us through building a state machine for a search form using XState. In his unique style, he made me, my teammates and probably the whole audience fall in love with XState.

Astro Studio - All Secrets Reveiled by Elian Van Cutsem

@eliancodes (code)

An overview of all the latest Astro features: Astro Studio sunset and Astro DB, server islands and actions, Astro Starlight, community loaders, and I likely forgot something. Astro 5 is in beta, but the only missing bit is stable Vite 6 release.

The A1lyboros (maximizing code accessibility with Copilot) by Alena Nikolaeva & David Jensenius

@alenanik11 (slides)

The only way to ensure accessibility is through thorough manual testing. The speakers, who both work on Copilot at Github, raised the problem of bias in large language models. AI code generators don’t guarantee accessibility, but they still can be helpful for exploring the topic. Get started with this prompt shared by the speakers:

I need to learn about accessibility and need to write code that conforms with the WCAG 2.1 level A and AA
success criteria defined at https://www.w3.org/TR/WCAG21/. I want you to be my accessibility coach, a
subject-matter expert that makes me think and account for all accessibility requirements and usability
enhancements. When you answer questions about accessibility please use reputable sources such as w3.org,
webaim.org, developer.mozilla.org, and https://www.ibm.com/able/. When possible, please provide links and
references for additional learning. When you suggest code please use semantic HTML, ensure it is operable
using the keyboard, follow WCAG 2.1 sufficient techniques, and follow the ARIA Authoring Practices Guide
and related design patterns. Do you understand these instructions?

Enhancing your Static Sites with React Server Components by Akash Hamirwasia

@blenderskool

Every static site eventually needs more dynamic data fetching, and it’s historically been a pain. On a simple example, Akash demonstrates how RSC dramatically simplify the process and render previous tricks like useStaticQuery from Gatsby or getStaticProps from Next.js obsolete. An earlier version of this talk is available in the author’s blog.

Making your own tRPC-like library by Gabriel Grubba

@gabrielgr

With end-to-end type safety provided by tools like tRPC, you can “dot your way into it” without ever leaving your IDE. But how does tRPC work? Gabriel suggests implementing one yourself to understand the magic. The constraints of a lightning talk, unfortunately, didn’t allow me to catch the details.

Diagrams you need to know by Jenny Truong

@jen_ayy_ (slides)

Non-technical lightning talk from a stately team member with tons of links to diagram drawing services. I only managed to capture https://dbdiagram.io/ and https://www.tldraw.com/. Checkout the slides for more!

Using events and modern state management tools to clean up local-first logic by Wojciech Ogrodowczyk

@sharnik (slides)

What makes some products really great? They solve a hard problem for their users, often employing a non-obvious technical approach, like event sourcing for an imaginary TODO app. As another example, Wojciech references a talk from Liner about local-first approach.

Dude where is my password? by Miquel Company

@solilokiam (demo / repo)

Miquel explained how passkeys work by building an app with SimpleWebAuthn and Next.js. While passwordless approach is much more secure, Miquel admitted that after years of memorizing passwords, users don’t feel confident in getting rid of them. Popularization talks like his are a great way to spread the word.

Let’s build everything! The chaos of pet projects by Mikhail Korolev

@mkrl__ (slides)

A mix of art and technology from someone who broke two arms in an bicycle accident just before the conference. Misha is the king of pet projects and shared how he manages his projects from the initial idea to the finish line. Talks like this make in-person conferences special, and it’s impossible to fully capture their vibe in text or video.

How to make cheap e2e tests by Anastasiia Dragich

@nastia_dragich

Playwright won, and we all run hours of end-to-end tests in our CI pipelines. Nastia shared how she makes them much faster by mocking backend APIs. She calls this type of tests “isolated integration tests”. I also learned that Playwright has webServer config to start background processes before running tests.

3D Models on the Web with React Three Fiber by Thomas Derflinger

Web: https://tderflinger.com/

An interactive intro into React Three Fiber for rendering 3D models in the browser. Thomas also has a blog post on the same topic.

A Schema is all you need! by Mattia Manzati

@MattiaManzati (slides)

Yes, TypeScript is great, but it doesn’t help in the good old JavaScript runtime. Solutions like zod improve the situation, but don’t fully solve it. Mattia demos the power of @effect/schema by building an encoder and decoder for a simple Todo item schema. I also learned about property-based testing with fast-check.

Signals: What, How, and Why! by Atila Fassina

@atilafassina

Atila stepped up on short notice to replace a cancelled talk and delivered a high-quality deep dive into signals in SolidJS and beyond. I learned about lazy vs eager signals, performance optimizations in Solid and upcoming SolidHack event.

One App Fits All: Building Responsive Experiences in React by Kateryna Porshnieva

@krambertech

Kateryna reminded us that we may not need JS at all with the power of modern CSS. She built a responsive app interface using Utopia fluid design approach, clamp() CSS function, CSS grid, container queries, ch units, hover, pointer, and prefers-reduced-motion media queries. As an example of UI that does require JS, Kateryna built a fully fluid navigation bar using ResizeObserver.

Sessions - Day 2

Another 17 talks on React 19, TypeScript, React Native, soft skills and more

useWat by David Khourshid

@DavidKPiano

React library (or framework?) is far from being perfect. With humor and kindness, the author of XState walked us through some of the weirdest React parts that we learned to accept as a norm. In all this mess, it’s best to stop worrying about the latest React features and instead focus on building great products for our users.

From Chaos to Clarity: Design Patterns for Scalable Software by Joana Santos

@joanamcsa

Nobody expected a design patterns talk to include YMCA dance and life advice on how to be yourself. Joana definitely knows how to keep the audience engaged.

Type-Safe React with OCaml: A Practical Guide by Dillon Mulroy

@dillon_mulroy

Dillon shared his passion for OCaml and walked us through a simple OCaml code example. OCaml ecosystem is rapidly evolving and becomes more approachable thanks to the tools like create-melange-app created by Dillon.

Full Stack Form Validation with React Server Actions by Evyatar Alush

@evyataral

The author of a very interesting form validation framework Vest gave us a live demo of how to get started with it. Server actions supported!

Continuous Improvements of The Code Review Process by Keren Kenzi

Blog: https://medium.com/@KerenKenzi

An overview of code review practices, also available in Keren’s blog.

Chaos Mode - Finding & Fixing Race Conditions by Forbes Lindesay

@ForbesLindesay (slides)

Forbes provided a great visual explanation of a race condition bug using a search-as-you-type widget as an example. He suggested a method to catch race conditions by introducing random fetch delays, which he calls “Chaos Mode”. Then, he showed the wrong, the right and the fast ways to fix the issue. State machines are mentioned again!

React is turning 19! by Nikhil Sharma

@niksharma1997

An overview of all the latest React 19 features including React Compiler (which is not part of React 19, technically speaking).

From mentee to mentor: the art of asking questions that accelerate careers by Kate Marshalkina

@kalabro (slides)

I had the pleasure of giving a lightning talk, which can be summarized as: “Don’t give advice, ask more questions.” More on my speaker experience at the end of the post.

Covid fairytale: Building a React Native App to find a toilet roll during pandemic by Aris Markogiannakis

@arismarko (slides)

A story of building a fun React Native app as React developer including some details on Prisma and Expo.

Speed at Scale: Optimizing The Largest CX Platform Out There by Matheus Albuquerque

@ythecombinator (slides)

While conferences focus on bright new things, at work we often deal with legacy codebases, outdated tools, and slow applications. Matheus shared an in-depth case study on optimizing the performance of a large legacy app (React 15, Webpack 1, Node 10). The content was too extensive for a lightning talk, but fortunately, the slides contain all the references. Highly recommended!

The easy way to Full Stack by Dani Coll

@dani-coll

Dani sets the stage by sharing dozens of full stack job postings in companies of all sizes. Despite common view, companies do hire full stack engineers. It can be an interesting and fulfilling career path but how to get there? By following our interests and picking small tasks at work beyond our common responsibilities.

Sweet, savory, and fresh! Accessible design system Storybook tests by Kathleen McMahon

@resource11

Kathleen made us all smile even though the stats she shared were not so fun: the more aria labels developers add to webpages, the more accessibility issues they introduce. One way to improve accessibility of React components is to use Storybook built-in tools. They can’t replace manual testing, but at least it’s a good start.

Types, TypeScript and the JIT by Daniel Minor

@dminor (slides)

Daniel works on SpiderMonkey, a JavaScript engine that powers Firefox. In his lightning talk, he touched on the theory of types, soundness vs completeness, and how a JavaScript engine executes our code.

The Shape of Frameworks to Come by Daniel Afonso

@danieljcafonso

An intro to SolidStart, a meta-framework for SolidJS. In contrast to some other frameworks, it aims to mitigate the vendor lock-in issue by using a composable architecture, where each piece can be replaced with a different implementation.

How you can Server-Render without Rendering on the Server by Eric Vicenti

@EricVicenti

Eric presented Rise Tools, a framework for building mobile apps that are heavily controlled by the server. With a live coding demo, we all saw in action how a mobile app can be updated in real time. Very cool! If Rise Tools takes off, we will have a new way to quickly build and test our mobile app ideas.

Evolving Game Development with Genetic Algorithms by Kevin Maes

@kvmaes (slides)

Kevin shared how he built a game using genetic algorithms to evolve the complexity of game levels. It was fun to listen to his story full of interesting learnings, little details, and funny episodes. I’m impressed by the amount of work required to build a game from scratch. All code is available on Github. Of couse, powered by XState!

The Illusion of Success: When Delivering on Time is not Everything by Paulina Chojnowska

Slides

A lot of wisdom about software development processes delivered through a set of funny stories. As a community, we all agree on the importance of work-life balance, the dangers of tech debt, the power of prioritization, and the synergies of teamwork. Yet, things often go wrong. Paulina’s talk was a great reminder that our jobs are not only about code. That’s why we probably won’t be replaced by AI anytime soon.

My summary

React Alicante is known for its smooth organization, international speakers, and a long list of diverse talks. This year, the conference hosted 18 full talks, 16 lightning talks, and 12 workshops—a massive volume of content! Many speakers, sponsors and attendees return year after year, which is a sign of a great community. For me, it was the second React Alicante in a row, and this time I returned with a lightning talk!

Speaker experience 📣

I’m extremely greatful to the conference organizers for the opportunity to speak. It was interesting and challenging to prepare a 10 min non-technical session on a topic that I could talk about for hours. Inspired by several other talks (1, 2), I decided to build my presentation around one simple idea: ask more questions. This way I could keep it focused and hopefully useful even for people who were not interested in mentorship.

If you want to learn more about my mentorship experience, please check out my article “Where to find a mentor”.

Technical issues ☠️

This year, I paid more attention to technical issues because I was concerned about them as a speaker. It turned out that a tiny technical issue can ruin a talk. As a speaker, it’s easy to start panicking and lose the vibe. The audience quickly picks up on this and becomes disengaged. Experienced speakers had video recordings of their live coding pieces in case something went wrong.

Unlike last year, React Server Components were mentioned in every other talk, sometimes with a fair dose of skepticism due to the Next.js situation. TypeScript without any doubt became a first-class citizen in the React ecosystem. XState was a very popular topic too.

AI was present, but mostly in the form of jokes. Irrelevant Copilot suggestions during live coding demos made people smile.

Videos 🎥

All sessions were recorded and will be available on YouTube. While waiting, please feel free to check out videos and my report from 2023.


Profile

Hi, I’m Kate 💡

I’m a Full Stack Developer and Engineering Mentor, obsessed with regular expressions, books, and web technologies. In my work, I mix old with new, soft with hard, cats with dogs. When it’s not a disaster, it’s pure magic!

LinkedIn ~ Twitter ~ Mastodon ~ RSS

Building web in 2024