React Finland
Schedule
Note that the times have been adjusted to your local timezone automatically.
It's possible to subscribe to the conference calendar directly to keep up to date with any changes.
2019-04-23 - Pre-conference#
- -
- -
🎉Visiting Suomenlinna Castle ☀️ #
Suomenlinna is one of the most significant castles in Finland. The world heritage site has a lot to explore. You need to take a ferry to reach it.
- -
🎉Swimming at Yrjönkatu swimming hall 🌧 #
Yrjönkatu swimming hall is Finland's first and oldest public swimming hall inaugurated in 1928. According to the BBC, it is one of the most beautiful swimming halls in the world.
Swimming is limited to women/men only per day (women: Mon, Wed, Fri, Sun, men: Tue, Thu, Sat) as clothing is optional. You can also find multiple saunas. Depending on the services you want, expect to spend between 7 and 30 euros.
The swimming hall is open daily (closed 22.04 due to Easter).
- -
🎉React Helsinki meetup #
Meet local developers in React Helsinki meetup.
2019-04-24 - Workshop day#
- -
💤Registration and breakfast #
Pro tip: You can register at any time during the conference. There's light breakfast (pastry and coffee) available.
- -
👩💻Design Systems for React Developers #
- React.js
- Styling
- Style guides
- Tooling
👩💻Modeling React Applications with Statecharts #
- React.js
- State management
👩💻React and GraphQL – From zero to production #
- GraphQL
- GraphQL.js
👩💻TypeScript for React Developers #
- Immer
- Mobx
- mobx-state-tree
- React.js
- State management
👩💻Advanced React – Suspense, Time Slicing, Hooks and more … #
- Reason
- GraphQL
- React.js
- React VR
👩💻Advanced Performance Tuning for React Applications #
- React.js
- Testing
- -
🍽️Lunch #
- -
Workshops continue #
- -
☕Break #
- -
Workshops continue #
- -
☕Break #
- -
Workshops continue #
- -
🎉Sauna with Reaktor #
One of our sponsors is organizing an unofficial event where you can go to sauna and meet developers. The event also has food and drinks so you won't go hungry/thirsty and there will be transfer from the venue.
2019-04-25 - First conference day#
- -
💤Registration and breakfast #
You can register later too. There's light breakfast (pastry and coffee) available.
- -
💤Opening — Jani Eväkallio#
Opening the day with Jani Eväkallio, our MC of the day
- -
State management #
🗝MobX - The Journey — Michel Weststrate#
Slides (PDF) Slides (web) Video
MobX is downloaded a million times per month, and used by many large and small companies, such as Microsoft, Amazon, Lyft, SAP and DICE.
By now, it is 3,5 years ago (in other words, ancient!) that I've wrote it and started building a community around it. In this talk I will both reflect on the product and my journey into the Open Source Software world:
- What makes a great open source library? (Can we even answer that question)
- What is so appealing about the programming model of MobX? (Reactive programming, yet, not scary?)
- How is it possible that open source even works. What does it mean to be a good OSS citizen? (Yeah, I'm looking at you!)
- Why do so many maintainers burn out? (And how to avoid that)
Reflection on the past often gives clues about the future:
- What is the future of MobX and client side state management?
- And what is the future of open source? How can we foster innovation. And maintenance?
Expect a highly personal talk about a successful open source project. Some first hand experiences from an author that still tries to figure out how much of all that is just dumb luck in the end :).
- Mobx
- mobx-state-tree
- Open source
- React.js
🎙Append-only development with React — Luca Matteis#
Slides (PDF) Slides (web) Video
Behavioral Programming is a new paradigm that changes how we think about developing software. Programs are constructed in an incremental-fashion where newly added code can change how old code is executed. In this talk I will explain this paradigm in the context of developing a React app. Furthermore I will show how changes can be made to the app without having to understand how old code was written; hence I describe this method as "append-only development".
- Behavioral programming
- React.js
- Generators
- Events
🎙Mind-Reading with Adaptive and Intelligent UIs in React — David Khourshid#
What if you could predict user behavior with smart UIs? In this talk, we will explore how we can make adaptive and intelligent UIs in React that learn from how individual users use your apps, and personalize the interface and features just for them, in real-time. With probability-driven statecharts, decision trees, reinforcement learning and more, UIs can be developed in such a way that it automatically adapts to the user's behavior.
- State machines
- Reinforcement learning
- Artificial Intelligence
- User interface
⚡️Abstract component modeling in React — Farzad Yousefzadeh#
Slides (PDF) Slides (web) Video
Often when we need to develop user interfaces, we model the interface behaviour based on a visual design or the platform we ship onto. However, since the behaviour of the component is the same, it would be beneficial to find a practical way to share this behaviour between different platforms, styling systems, state containers, data transmitters and any other sort of integrations.
In this talk, I'll be showing a set of techniques to model a semi complicated React component, independent from the common integrations.
- State management
- Statecharts
- Headless components
- -
☕Break #
Drink coffee, live long and prosper. Play foosball at the sponsors' lounge.
- -
Design Systems #
🎙A Common Design Language. Let Designers and Developers talk to each other. — Andrey Okonetchnikov#
Slides (PDF) Slides (web) Video
“Should designers code?” or “Should coders design?”—these two eternal questions are being asked for years with no particular answer given.
- How to let developers know what typography style or button variance they should be using on this particular screen?
- How to ensure that the whole UI is consistent?
- How to let designers know that some screen design doesn’t fit the requirements and needs to be updated?
In order to answer those questions designers and developers have to speak the same language. But what language should it be?
UI components and pattern libraries can provide this intermediate abstraction and be a common language for both designers and developers.
- Design systems
🎙A practical guide to building your design system infrastructure — Varya Stepanova#
Slides (PDF) Slides (web) Video
Design systems bridge the gap between designers and developers, communicate shared practices to all the company levels and significantly decrease production costs. We all have heard this but how to achieve that in practice?
React ecosystem and community already provide a lot of efficient open source tools which can be used for building your design system infrastructure. With them, you can have the most automated development process, high-level interactive documentation for the libraries in your system and support contribution practices within your organisation.
This practical guide shows how to apply existing development tools to your system and what is the value you can get.
- -
🍽️Lunch #
Hopefully it's as disappointing as the one you had at GraphQL Finland
- -
Testing #
🎙CI/CD for React Native — Juha Linnanen#
Both continuous integration and continuous delivery (CI/CD) are elements of software development best practices. Setting up CI/CD can be time consuming, even more so for a mobile project. Understanding the basics of how to apply CI/CD practices in React Native mobile application development to automate software release tasks will improve performance and will free up time more usefully spent elsewhere in the project.
- React Native
🎙Intersection of Automation and Exploratory Testing — Maaret Pyhäjärvi#
Slides (PDF) Slides (web) Video
I’m using exploratory testing to design which tests I leave behind as automated. Creating automation forces me to explore details in a natural way. When an automated test fails, it is an invitation to explore. The two sides of testing, automation and exploration, complement each other. These intertwine the considerations of the best for today and for the future.
For great testing bringing value now as well as when we are not around, we need to be great at testing - uncovering relevant information - and programming - building maintainable test systems. At the core of all this is learning. With our industry doubling in size every five years, half of us have less than five years of experience. We all start somewhere on our learning journey.
In this talk, we look at skills-focused path to better testing in the intersection of automation and exploratory testing. We can arrive at the intersection by enhancing our individual skills, or our collaboration skills. What could you do to become one of those testers who companies seek after that work well in the intersection, giving up the false dichotomy?
Takeaways:
- recognizing skill in testing and skill in programming for testing as dimensions
- building skills in testing / programming
- using collaboration to achieve better testing
- React.js
- Testing
🎙12 Tips For More Accessible React Apps — Manuel Matuzović#
Slides (PDF) Slides (web) Video
If you want to improve the accessibility of your React apps but you don't know how or where to start, this talk is just what you need. Manuel shares 12 tips that will help you build web sites and applications that can be used by anyone. Each tip fits on one slide and you'll be able to put them into practice right away without having to learn anything fundamentally new. The tips include testing, HTML, JS techniques, and general best practices.
- -
☕Break #
Drink coffee. Again. Take a massage at the sponsors' lounge.
- -
Case Studies #
⚡️All aboard the type train — Kadi Kraman#
JavaScript is a language of add-ons, and one of its more recent trends is typing. There are obvious benefits to typing, but what are the drawbacks? Should you choose Flow or TypeScript? Why use types at all? And why not just go straight to Reason? This session will provide some insight into these questions, peppered with examples from the real world.
- TypeScript
⚡️Drawing the line between 3rd party and handcrafted components — Glenn Reyes#
Often when we write new components, we might be like: Come on, there must be a library out there! And most times there was already someone who faced the same problem... only that it's not quite the same. Should I use the 3rd party lib? Or go with my own? Let's find out the differences and trade-offs in this session.
- React.js
- Libraries
⚡️Gatsby + Themes: The Future of Gatsby — Dustin Schau#
Slides (PDF) Slides (web) Video
Themes ease learning curves and reduce the time to a deployable app. Want to get that great blog written, but don’t want to spend the time creating a bunch of components and UI details? Themes. Themes allow you to focus on what matters: delivering compelling experiences for your end users. Themes are coming very soon to Gatsby, and this talk will do a deep dive on what they are, how to use them, and the types of amazing content you can create easily with a framework that people love: Gatsby.
- Gatsby
- Static site generation
- -
☕Break #
Drink coffee if you still can. Enjoy the sofa at the sponsors' lounge.
- -
Visual #
🎙Delightful UI animations by understanding the brain — Bruno Lourenço#
Check out the world’s award-winning websites—what do they all have in common? Animations! They have elements that move and change. When done well, animations can amaze us. But why are some animations delightful while others are so annoying? The answer could be in how our brain perceives motion.
Understanding this could be the key to confidently adding animations to our websites and apps. Animations with code seem hard, but they shouldn’t be. In this talk, I will give some tips and explore some tools to simplify creating animations in React.
- Animation
- React.js
- -
💤Closing ceremonies #
- -
☕Break before smoosh #
- -
🎉#SMOOSH — Jani Eväkallio#
After sold out shows in London and Berlin, we’re bringing the #SMOOSH comedy show to Helsinki!
Join us for an evening of standup, improv, and even a sing-along. This show will be unforgettable, no matter how much you try to forget it. 😉
The event is held at the main venue!
2019-04-26 - Second conference day#
- -
💤Registration and breakfast #
If you slept late, you can still register after this. There's light breakfast (pastry and coffee) available.
- -
💤Opening — Sara Vieira#
Opening the day with Sara Vieira, our MC of the day
- -
React Native #
🎙Building a Community Around Ignite — Jamon Holmgren#
Slides (PDF) Slides (web) Video
In this talk, Jamon will go into what it took to build a thriving developer community around the popular React Native CLI and boilerplate, Ignite.
- React Native
🗝The Untouchable Web — Rick Hanlon#
The majority of users are now browsing websites primarily using touch devices. In this talk, Rick Hanlon from the React Native team at Facebook shares what React Native has learned about touch devices with web developers, including how to provide a rich user experience today, and where this space is going.
- React Native
- React.js
🎙React Standard Library — Ville Immonen#
React Native is the tool for building cross platform React apps. To build native-like experiences, we need good APIs providing the native capabilities of each platform in a unified way. Is the answer a standard library for React apps?
- React Native
- Universal React
- -
☕Break #
Drink coffee and play games at the sponsors' lounge. Finnish coffee is darker than you think.
- -
Styling #
🎙Custom CSS is the path to inconsistent UI — Artem Sapegin#
Slides (PDF) Slides (web) Video
Custom CSS is the simplest way to make the UI inconsistent, especially if we’re talking about spacing between UI elements, font sizes or colors. When developers have too much freedom in defining the UI, they will do things differently. The issue could be solved by avoiding any custom CSS on the app level and having a set of primitive components that allow developers to glue UI together in a consistent way.
- React.js
- Styling
🎙Creating layouts that last — Artem Zakharchenko#
What if we could wield layout composition as an actual React component? Spoiler: that would solve the #1 issue that prevents our layouts from being truly reusable.
- CSS Grid
- Layout
- React.js
- -
🍽️Lunch #
Hopefully it's as disappointing as day before.
- -
Tooling #
🎙Scalable (Design) Systems with TypeScript — Tejas Kumar#
This session explores creating living documentation for design systems, ensuring consistent documentation at all times using TypeScript.
We will read Markdown files, render components described in them, and expose live type-safe code playgrounds powered by the Monaco Editor. We will, together, explore:
- Static Type Analysis and its value
- The Monaco text editor that powers VS Code
- Connecting it all together with React
- React.js
- Design systems
- Live coding
- Monaco editor
- TypeScript
- VS Code
⚡️Codecrumbs in React — Bohdan Liashenko#
Slides (PDF) Slides (web) Video
The granular approach of designing components helps us to build reusable and encapsulated features. On another hand, it also makes a codebase much more complex by extra added abstractions and drastically increased amount of source code files. How can we navigate the maze of hundreds of React-atoms now? Join my talk to get the answer.
- Tooling
🎙React Union: Write once, plug anywhere — Tomáš Konrády#
Slides (PDF) Slides (web) Video
React is usually responsible for managing the render of the whole application. This talk will be about the different use case in which a React application is divided into several standalone configurable modules.
I am going to show how the React modules can be integrated into diverse CMS platforms such as WordPress or Liferay with help of React Union library.
Then we take a look at state management challenges in this kind of setup and how to solve them with @redux-tools.
- CMS
- React.js
- Redux
- State management
- Live coding
⚡️Releasing a library written in TypeScript on NPM — Christoffer Niska#
Most of us have used or at least heard about TypeScript, but how many have released a React library written in TypeScript on NPM?
In this session we will take a look at the tooling required and some best practices for publishing a library using TypeScript and Rollup.
- npm
- TypeScript
- -
☕Break #
Drink coffee. Again. Play more foosball at the sponsors' lounge.
- -
Performance #
🎙Practical Performance for React (Native) — Anna Doubková#
There are quite a few theoretical concepts of writing good a React application, including popular functional programming approaches. However, few take into consideration the impacts these will have on performance of the application. In this talk you’ll find out how some commonly used patterns have an adverse effect on the speed of your app, and how to avoid using them. We’ll mainly explore UI and state management but we’ll also dive into some native-specific issues and look at how to prevent them.
- React.js
- React Native
⚡️WebAssembly - The Next Big Platform — Sven Sauleau#
JavaScript has had the monopoly on the web for quite some time now. What if, for performance reasons or preference, you want to use another language on the web or mix them?
WebAssembly is the right tool for the job! I want to demonstrate how you can write parts of your React application using Rust and related tools. To complete the demonstration, the code will be deployed on Cloudflare's serverless platform.
Rust ecosystem offers many great tools to work with WebAssembly on the web. These include DOM manipulation, JavaScript bindings and so on, and you will learn more about them in the talk.
- Live coding
- React.js
- Rust
- Serverless
- Web Assembly
- -
☕Break #
Drink coffee if you still can. Still time for a massage at the sponsors' lounge.
- -
Architecture #
🎙Building resilient frontend architecture — Monica Lent#
Change is inevitable. So is legacy. And too often, we as developers (who love to solve problems by coding) fall into the trap of believing the only way to fix it is by rewriting everything again and again. But how can we design an application architecture that is more resilient to change in the first place? In this talk we’ll look at specific techniques you can use today to keep your app from turning into that infamous ball of mud.
- Code quality
- Tooling
- Architecture
🎙"Intuitive" Tooling — Carolyn Stransky#
One of the nuances of working in frontend development is constantly being told that insert whatever tooling, frameworks or technologies here are "super simple" or "easy to pickup". While on the surface this seems great, the reality is that many of these technologies are riddled with syntax quirks, incomplete documentation and a high barrier to entry.
In this talk, we'll discuss why truly intuitive tooling doesn't exist, go over some common misconceptions in the React community and learn more inclusive ways to talk about emerging frontend technologies.
- -
💤Closing ceremonies #
- -
💤Afterparty #
Tiivistämö Kaasutehtaankatu 1, Helsinki
2019-04-27 - Post-conference#
- -
🎉Visiting Suomenlinna Castle ☀️ #
Suomenlinna is one of the most significant castles in Finland. The world heritage site has a lot to explore. You need to take a ferry to reach it.
- -
🎉The Carnival of Ice Cream and Chocolate 🌧 #
Finland's first carnival of ice cream and chocolate takes place between 26th and 28th of April. If you like either or both, it's a great chance to pick up some local flavour (liquorice ice cream anyone?).
- -
- -
🎉Visiting Linnanmäki Amusement Park ☀️ #
Linnanmäki is the amusement park of Helsinki. Expect to be amused on its opening weekend!
- -
🎉Swimming at Yrjönkatu swimming hall 🌧 #
Yrjönkatu swimming hall is Finland's first and oldest public swimming hall inaugurated in 1928. According to the BBC, it is one of the most beautiful swimming halls in the world.
Swimming is limited to women/men only per day (women: Mon, Wed, Fri, Sun, men: Tue, Thu, Sat) as clothing is optional. You can also find multiple saunas. Depending on the services you want, expect to spend between 7 and 30 euros.
The swimming hall is open daily (closed 22.04 due to Easter).
- -
🎉The Carnival of Ice Cream and Chocolate 🌧 #
Finland's first carnival of ice cream and chocolate takes place between 26th and 28th of April. If you like either or both, it's a great chance to pick up some local flavour (liquorice ice cream anyone?).
- -
🎉Unofficial bar meet #
Meet local developers in a local bar.
More info to come.
2019-04-28 - Post-conference#
- -
🎉Visiting Suomenlinna Castle ☀️ #
Suomenlinna is one of the most significant castles in Finland. The world heritage site has a lot to explore. You need to take a ferry to reach it.
- -
🎉The Carnival of Ice Cream and Chocolate 🌧 #
Finland's first carnival of ice cream and chocolate takes place between 26th and 28th of April. If you like either or both, it's a great chance to pick up some local flavour (liquorice ice cream anyone?).
- -
- -
🎉Visiting Linnanmäki Amusement Park ☀️ #
Linnanmäki is the amusement park of Helsinki. Expect to be amused on its opening weekend!
- -
🎉Swimming at Yrjönkatu swimming hall 🌧 #
Yrjönkatu swimming hall is Finland's first and oldest public swimming hall inaugurated in 1928. According to the BBC, it is one of the most beautiful swimming halls in the world.
Swimming is limited to women/men only per day (women: Mon, Wed, Fri, Sun, men: Tue, Thu, Sat) as clothing is optional. You can also find multiple saunas. Depending on the services you want, expect to spend between 7 and 30 euros.
The swimming hall is open daily (closed 22.04 due to Easter).
- -
🎉The Carnival of Ice Cream and Chocolate 🌧 #
Finland's first carnival of ice cream and chocolate takes place between 26th and 28th of April. If you like either or both, it's a great chance to pick up some local flavour (liquorice ice cream anyone?).