React Finland

React Finland 2021

<div><div>For many years, we have migrated all our devtools to Node.js for the sake of simplicity: a common language (JS/TS), a large ecosystem (NPM), and a powerful engine. In the meantime, we moved a lot of computation tasks to the client-side thanks to PWA and JavaScript Hegemony. So we made Webapps for years, developing with awesome reactive frameworks and bundling a lot of dependencies. We progressively moved from our simplicity to complex apps toolchains. We've become the new Java-like ecosystem. It sucks. It's 2021, we've got a lot of new technologies to sustain our Users eXperience. It's time to have a break and rethink our tools rather than going faster and faster in the same direction. It's time to redesign the Developer eXperience. It's time for a bundle-free dev environment. It's time to embrace a new frontend building philosophy, still with our lovely JavaScript. Introducing Snowpack, Vite, Astro, and other Bare Modules tools concepts!</div></div><div><div> </div></div> <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

The Eternal Sunshine of the Zero Build Pipeline

m4dz 🥑🦄

Documentation is often your community's first point of contact with your project and their daily companion at work. So why is documentation the last thing that gets done, and how can we do it better? This talk shares how important documentation is for React and React Native and how you can invest in or contribute to making your favourite project's docs to build a thriving community <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Opensource Documentation—Tales from React and React Native

Rachel Nabors

Rethinking CSS - Introducing Stylex

Naman Goel

Can we have themeable CSS-in-TypeScript without the runtime cost? In this talk we'll have a quick look at how this can be achieved with vanilla-extract. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Zero-runtime CSS-in-TypeScript with vanilla-extract

Mark Dalgleish

System-level state management in modern React applications is challenging. Usually, as the applications grow, the complexity of interaction between different parts of the application compounds. The more you need those isolated parts to talk, the higher the level of complexity. Usually, the common pitfalls of these communications are underestimated especially with the recent trend of State management that tends to keep the application state outside of React and distributed. In this talk, We'll see how the Actor Model architecture can come to the rescue and what makes it stand out compared to the other approaches. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

The Actor Model: a new mental model for React

Farzad YousefZadeh

Most documentation systems focus on text content of one form or another: WYSIWYG editors, markdown, code comments, and so forth. Storybook, the industry-standard component workshop, takes a very different approach, focusing instead on component examples, or stories. In this demo, I will introduce an open format called Component Story Format (CSF). I will show how CSF can be used used to create interactive docs in Storybook, including auto-generated DocsPage and freeform MDX documentation. Storybook Docs is a convenient way to build a living production design system. I will then show how CSF stories can be used create novel forms of documentation, such as multiplayer collaborative docs, interactive design prototypes, and even behavioral documentation via tests. Finally, I will present the current status and outline a roadmap of improvements that are on their way in the coming months. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Documenting components with stories

Michael Shilman

David will explain the different possibilities to implement MicroFrontends in the past, the present, and the future. More importantly, he will leave you to know which of the available approaches is best suited for your specific task at hand. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Micro Frontends in React — a State of the Art Approach

David Leitner

Being flexible with Apollo Federation and autoscaling with Kubernetes opens many opportunities to scale your app. Jan will show how these two services work hand in hand and why autoscaling matters. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Using Apollo Federation in a microservice architecture in Kubernetes

Jan Peer Stöcklmair

My unpopular opinion is that testing is ... important. How do you test your React Native apps? In this presentation I will show how to run full integrations tests using Cypress while the RN app is running in the browser. This method can cover most of the application's code and be effective at finding logical errors and mistakes when calling the server APIs. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Integration Testing for React Native Apps

Gleb Bahmutov

Over the past few years, state machines, statecharts, and the actor model have proven to be viable concepts for building complex application logic in a clear, visual way with XState. In this talk, we'll take a peek into the future of XState, including new features in the next version, and new tools and services that will make it even easier to create and collaborate on state machines. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

The State of XState

David Khourshid

Remember Atomic Design? It's been a while since we started talking about Design Systems. They're supposed to solve our interfaces inconsistencies issues, as a single source of truth. But do you know well how to build and use them, from a developer perspective? Here's your ultimate guide to Design Systems, for Devs! From the fundamentals of Design Tokens definition, to how to build advanced versatile layouts. You'll learn all best practices, tips &amp; tricks, components splicing strategies, from this comprehensive step--step handbook talk. Never be lost again in front of a creating Design System from scratch! <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Design Systems of a Down: Steal this Guide!

I'll present a practical approach to styling react components, a folder structure and documentation structure that's very easy to follow (for onboarding members) + other insights I got while using this approach. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

How to structure, style and document your components for maximum effectiveness

Dragos Bilaniuc

François will introduce ViteShot, a new open-source tool that can generate screenshots of HTML/CSS components within seconds, so you can be confident that your UI looks exactly the way it's supposed to. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Screenshot testing with ViteShot

François Wouts

A demo and deep dive into GraphCDN, the edge caching GraphQL CDN. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

How to cache GraphQL queries at the edge

Max Stoiber

Modern frontend frameworks like React are well thought-of in their application security design and that’s great. However, there is still plenty of room for developers to make mistakes and use insecure APIs, vulnerable components, or generally do the wrong thing that turns user input into a Cross-site Scripting vulnerability (XSS). Let me show you how React applications get hacked in the real-world. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

You thought your React application is secure? Think again

Liran Tal

How Contentful helps you to manage all the data in a headless e-commerce website. <h3>Transcript</h3> <h4>Intro</h4> Hi. So in this talk, we are going to talk about Contentful &amp; Headless. Before we start, thank you React Finland for giving me this opportunity. I am Nidhi. I'm a front-end engineer at ShopTrade. I am a Google Summer of Code alumni. You can connect with me on Twitter. My handle is Nidhijha98 and on GitHub my handle is NidhiKJha.Let me walk you through the agenda of my talk. So we'll talk about, what is Headless CMS? Why do we need it? Then we'll talk about a specific Headless CMS called Contentful, the features of Contentful where I'll walk you through the website of Contentful and how we can create content model and content in that. And let's code a feature, where we'll connect our front-end with the Contentful. And then you can ask me any questions, if you have. <h4>What is Headless CMS?</h4> [00:56] What is Headless CMS? So the word Headless comes into the picture with an idea of chopping the head, which in our case is front-end, from the back-end, which in our case is content management repository. So that is what Headless stands for.Previously, the traditional CMS that we had, in that we used to bundle up everything from our content images to our code in one single bucket. Now, with the modification of content management systems, we have a new approach called Headless CMS where we have separated our front-end and the content modeling and the CMS completely. And further to connect that CMS with front-end, we can use an API for seamless display across all the different devices. So previously, when CMS were designed, the way content was served was mainly through the website, but now, it can be served via wearables or smartphones, et cetera. So that's also the problem Headless CMS covers. <h4>Why do we need a Headless CMS?</h4> [02:07] Now let's talk about why do we need a Headless CMS? It unifies your entire data into one single Headless content hub. It provides you with a collaborative platform, your entire team can collaborate there. You can make your content highly reusable and accessible. So for example, you can create one content type and then you can create further, further you can add content using the same content type. Then there is separation of code and content in a Headless site. CMS makes life easier for content editors, they can edit the content directly in CMS without worrying about the code. <h4>What is Contentful?</h4> [02:50] So what is Contentful? Contentful is a Headless CMS, which is an API-first content management platform where you can create the data, modify it, and publish it on any digital channel. So the structure of Contentful is you have organizations, once you log in, you have organization. And each organization, there can be multiple spaces, spaces are for projects, specific to project, you have an environment, and then you add a content model.When you add a content model, you add a specific content type thinking about the idea behind is to add what type of content you have to add later on. For example, say I can create a content type page and then I can use it to create different content. For example, I can use the same content type page to create homepage, to create product pages, et cetera. So this is about the structure of Contentful. <h4>Tour around Contentful</h4> [03:48] Let's take a tour of Contentful to understand features of Contentful and how we can add the data. So for that, once you go to your Contentful website, you see this here. If you do not have an account, you need to sign up first and if you have, just login to that. Once you log in, you will be redirected to a page like this... Sorry, to this URL. Here you can see, I have added my organization as Test. This I created for the talk only. And then you can add your talk space here. My space right now is a talk space where we are going to create some content, we can add some content here and some content model.So to understand what exactly we are going to add here, let's go to this website. So I have an application, and it has a title, an H1 tag. For H2 tag, I want different blocks and each block will have a different title, obviously. So I want to create blocks with different titles. I want to display the list of titles that I can have.[04:59] So let's go back to our Contentful and create a content model where we'll add a content type called Blog. So once you create the content type, you need to add fields in this. You can choose any of the fields here, as per your requirement. It can be rich text, text, number, date and time, location, media, Boolean, JSON object, to reference. I'll go with text since I only need to add the title there. It'll be my block title. And since it's going to be short, so I'll be selecting a short text. You can select long text as well. Create. Settings. Now you can add different validations here.For example, if it's going to be a required field, you can check mark this one. If you want it to be a unique field, check mark this one. Character count, if there is a certain set of characters that should be there, you can select from here, then match a specific pattern. If you want to add a regex, you can do it from here. Prohibit the specific pattern and accept only specific values. You can change it as per your requirement.[06:12] Now, I want to add one more field. I want to add a media there, so let's name it Blog Image. I want one file at a time, but if you want to upload many, you can just go ahead with that as well. Now let's create this one. Save it. And then we can add content from here.So we have created only one content type right now. This is a blog, but once you add multiple, you can have multiple in the drop down. So let's add our first blog and name it, Blog Example 1, and add a media. To add a media, we have two options, add new media and add existing media. So let's add new media here. To upload any asset, you need to add a title and description, and file. These two are optional, so even if you skip these, it won't matter, but since it's required, you need to upload an image here.[07:27] So you can select any image that you want to. I want to go with this one, so I'll add it here. Once your image is uploaded, you need to publish it and as soon as you publish it, your status will change from draft to published. So I published it and it changed from draft to published. Now going back to your blog one, you need to publish this Example Blog One as well.Now let's add another blog. Let's give it a title, Blog Example 2. Add media. Let's choose to add existing media this time. Select from all the images that we have. Publish it. So now we have two content blogs added over here. So to upload any image or any media here, what you need to do is you need to go through this media tab and here, you can add assets. So if you want to add a single asset, you can go and select a single asset. If you want to add multiple assets, you can add it. So a single asset is how we have added that new media when we were adding the content. And to add multiple assets, we just need to go there, click on multiple assets, select files to upload, and here you can choose out of these the number of images that you want to add. And then after that, just upload it and your images will be uploaded. And then you can just... These images will be uploaded as draft, and then you need to publish them.[09:13] You can manage apps from here if you want to. And then we have settings from where you can manage the settings of the space. Now, we have added our content model, we have also added our content. So let's connect this content with our Next.js application.Let's fetch the data there. To include any content, first we need to add a Contentful package, that's the tool we have to install, Contentful. Once your package is installed, to get the data from Contentful, you can either write GraphQL queries, or you can use getStaticProps function. I had used the getStaticProps function here. So let's save this code. Sync function getStaticProps here.[10:14] Now, we need to import one thing from the Contentful package, which is createClient, so let's import createClient from Contentful. And now, so how will the Contentful know, how our code knows which space it has to connect from Contentful? So for that, we need to create const client equals to createClient, where you will pass space that's a Space ID which will be a string, and an access token, which is again going to be a string. To generate the Space ID and access token, you need to go there in the settings. In the API keys, you need to add a new API key here. And you can generate... You can see we have our Space ID and access token. So let's add our Space ID and then let's add our content access token here. So now, we have connected our Contentful with our Next.js application. To get this data, let's create another const res, which will... Client... Oops... client.getEntries and which will take a specific content type.So right now we have one content type that we have added in the beginning, which was blog. Here you can check. So you need to pass which exact content type you have to pass. So we have a blog here that we need to add. So we've added a blog and we have generated that response, now we need to return it so that we can pass it as a props. Props here will be an object. There, my name props is blogs, and this will be res.items.[12:39] To access this props list, let's pass it in our component down there. Console. Let me check it in our console what props do we get. Let's go to our website, check it here. What can I see in my console here? So see, we have an object. It says object prototype. I must have missed something. Hit entries. I have passed the content types. Okay. Let's reload the website once.So now you can see, we have our two blogs here and in blogs, we have fields and each field has a blog title that we have added. So to show this blog title here, let's write our map method. So it will be props.blogs.map where we will, let's name it Blog. Here, where the H2 tag, and this will be blog.fields.title and the ID that they want to ask here is blogs.sys.id. You can add anything else if you want to in the ID. Blog.sys.id.[15:00] So now we have added it here. Let's save it and check if we have got the data there or not. Oops, I guess, I missed something. Blog.fields.title. So blog.fields.blogtitle is there. So blogtitle, and now we'll get it.So see, we have got titles here. If you want to add the image there, then just we can get it from blogimage.fields.file.url. So this is how you can get the data from Contentful. Few suggestions, do not use my space and access token and since I'll be pushing that code, I'd recommend you to store it in your EMV file. So this is about Contentful and how you can get the data. If you want to pass this data as a prop to other component, you can do it from here. <h4>Questions</h4> [16:22] Juho Vepsäläinen: Yeah. I think we've moved to the discussion. So do you think you can combine this system with the other ones? So it was Contentful as a back-end and then something like React Bricks on top, or how do you say this?Nidhi Kumari: Sorry. Can you repeat the question please?[16:50] Juho Vepsäläinen: Yeah, it was more for Matteo maybe that is it possible to combine something like Contentful with another system like React Bricks or Storybook?[17:01] Matteo Frana: Well, I think it's possible. But to provide a great experience to a Contentful user or Storybook user, we should have an embeddable version of React Bricks which just edit a piece of content. For example, let's say that we take the page as a good piece of content because with the Headless, you don't have this concept of page. Page is just another entity, but you have any entity that you want. But if you want to create a page entity, we could just bind the entity in your Headless CMS with a page ID of React Bricks and then we could have an embeddable version of React Bricks in order to edit the landing page, let's say for example, for a product of an eCommerce inside of a Headless CMS. Really this is a thing that we have in mind to do, especially for eCommerce in Shopify. This is a thing that we are working on to help, to provide a landing page for products in Shopify, but of course, it is an interesting thing to integrate with Headless CMSs too. So we can talk about it.[18:22] Juho Vepsäläinen: Any thoughts from the Storybook side, if I'm going to equally somehow Contentful with Storyblock or...[18:32] Facundo Giuliani: Yes, I think that somehow they collide in the way of how storing their content, how delivering... I mean the concept behind using an API to connect and to grab information from a service that is providing the content already created on store probably is very similar. I mean that I can't imagine a way where you would use both product at the same time probably because they have the same purpose let's say, but yes, again, I think that the goal behind this is make the job easier for the people that is creating the content and using it in the front-end of our application, using different technologies, using different frameworks, using different programming languages, and leaving that decision to be made by developers, for instance, and the designers to implement the content created in the best way and deliver the content in the best way. So I think that the final goal is to offer a great experience for the user that is using our products, let's say. by <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Contentful and headless

Nidhi Kumari

Headless CMSs are great for developers, but not for content creators. React Bricks is the first CMS that is super-great for Developers (it's just React, backed solid APIs), for Content Creators (it keeps the visual editing experience of no-code tools like Wix) and for Designers (you can express your exact design system and be sure nobody will break it). I'll show you how it works! <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

React Bricks: a CMS with visual editing based on React components

Matteo Frana

The discussion explores the separation of concerns between logic (Model) and UI (View) and how React hooks are a great abstraction model that help achieve that. We'll start with designing a component's API (in a top down approach), then dive deeper to explore how to implement this API, while maintaining a good separation of concerns. We'll create custom React hooks to implement the Model and React components for the UI. Both expose self-documenting APIs and are completely decoupled from each other. To demo this approach, we'll create a simple Toggler component (a UI component that allows going back and forth in an array of values).Towards the end, we'll explore the benefits, focusing on testing these decoupled units in isolation. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Hooks are a great abstraction model

Calin Tamas

In this talk we are going to have a look on how to use Server-Side-Rendering and Static-Site-Generation in NextJS to serve pages. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

SSR & SSG in NextJS

Nur Şah Ketene

Lukas will demonstrate how you can have your backend GraphQL in sync with your frontend code on a framework agnostic way. - Having the advantage of autocompletion while writing the GraphQL queries IDE support- Built in type safety through static schemas- Automatic generated frontend code for your framework of choice (React, Vue.js, Angular)- Having everything rebuild through a built in watch mode <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Automate your stack with GraphQL

Lukas Holzer

In this talk, Patrick goes through the effort that went into ReScript's documentation platform. You can check the slides for this talk <a href="https://drive.google.com/file/d/1Nc9m2BpEvzcgUBhDFn48e5xGMQN8iGmm/view" target="_blank">here</a>. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

The Story of ReScript's Documentation Platform

Patrick Ecker

A demo on Aleph.js about good development experience and deno runtime. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Aleph.js - Build your React app in Deno

Je Xia

We often talk and hear about scaling in production, but we rarely talk about scaling development. Aspects like structuring and organizing your codebase, code sharing across teams, speeding up build and test runs can play a huge role in terms of productivity for a developer team. That impacts small teams but gets even more evident as your team grows and especially for large enterprises. In this short talk I'm going to demo Nx and what it can do for you to help you modularize your React code, generate code for you, help you build faster and much more. Tune in to learn about the build framework you've been missing in your tool belt! <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

React on Steroids with Nx!

Juri Strumpflohner

The final stage of a react component is when it is being published and distributed. How can I ensure my packages won’t crash in production? This talk will help you to test your React components publishing them to a private registry and running End-to-End tests against them. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Testing the integrity of your React components by publishing in a private registry

Juan Picado

If you must have legacy code, you want it written in statecharts. We'll break down the mental models required for understanding unfamiliar UI code, and compare the maintenance costs with and without statecharts. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Make legacy code delightful with statecharts

Matt Pocock

Likely you've heard of Web Components but do you know how to use them with React? If not, then this is the demonstration for you! <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Web Components in React

Matias Huhta

To show how we can make rich, interactive experiences, for instance games, with React semantics and shareable components, and what that means for traditional constructs, like the render-loop. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Breaking out of the confines: making games in React

Paul Henschel

An introduction to SolidJS UI Library. Explore an example to show the similarity and differences between Hook + Virtual DOM versus Reactivity + DOM. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

SolidJS - Reactive JSX

Ryan Carniato

Even today, with advanced tooling and frameworks, the gap between design and development still exists. This talk will examine how we can eliminate handoff between design and development teams using JSX as a shared source of truth across any platform. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

JSX for Designers

Travis Arnold

Quick tips on how to utilise the native mobile platform to help provide your users an upgraded experience with sounds, vibrations and animations. Small changes can have a huge difference UX-wise. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Haptics, Sounds and Micro Animations

Kadi Kraman

There are two mutually exclusive methods that CSS-in-JS libraries use to generate and ship styles to the browser. Both methods have benefits and downsides, so let’s analyze them in detail from the loading performance perspective. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

A thorough analysis of CSS-in-JS

Andrei Pfeiffer

Digital accessibility is a human right of people with disabilities around the globe. That means developers have an important role to play in advancing human rights! Join U.S. disability rights lawyer Lainey Feingold for a practical interactive discussion about laws and policies around the globe that impact digital accessibility. Come learn best practices for digital accessibility and how we all can “put the law in our pocket” to help make the digital world inclusive for everyone. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

The Digital Accessibility Legal Landscape – why it matters for developers 

Lainey Feingold

How to properly hide modals / dialogs / drawers functionalities behind buttons that spawn them without cluttering container components. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

How to Delegate your React Dialogs

Calin Bogdan

In this presentation, we'll present how video streaming works. We'll look at the anatomy of video streaming, and how video streaming is beneficial for delivering your content over just adding mp4 files. We'll demonstrate live streaming from the browser, and then how to integrate that live stream into your webpage. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Video streaming on the web: Live and recorded video streaming

Doug Sillars

The landscape of popular JS frameworks and libraries has become increasingly polarised. With React standing out an increasing number of companies are struggling to find skilled developers. People experienced in React are in a great position. Nevertheless, what if my CV lacks the right keyword? What if my Angular experience looks more like a burden? Can I apply for a front-end developer position in a React project? <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Becoming a React developer - A hiring manager’s perspective

Mika Schafroth

State machines and statecharts can seem intimidating. Especially if you (like me!) didn’t study computer science, aren’t big into maths, or just haven’t come across state machines and statecharts before. In this session, you’ll get a whirlwind introduction to state machines and statecharts, no prior knowledge and no coding experience required. Are you already familiar with state machines and statecharts but want to get a better understanding of the benefits and how to convince your team to get onboard? That’ll be covered too. You could be a developer, designer, project manager, multi-disciplinarian or fancy specialist, I believe everyone can get something out of this talk, so join me! <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Introducing state machines and statecharts

Laura Kalbag

In this brief introduction of Nuxt, we will learn Nuxt basics and how to build Git-files based content management system using Nuxt.js and its module system. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Brief introduction to Nuxt

Krutie Patel

We’re generally afraid of the future. Not only is it unknown, but there’s quite a lot of reasons to believe we’re practically doomed. And it doesn’t help that we’re negatively wired nature, programmed to look out for risks more than search for rewards. Developers especially so. So with this speech, I want to paint another picture for you. I genuinely believe, the future of work is enjoyable and definitely worth pursuing. And you can have that. Right after this speech. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

The future of work is enjoyable

Elisa Heikura

How our narrow understanding of racism (visible and interpersonal level) still stands in the way of racial equity and inclusion (in tech, too) and how racial bias can be seen in tech, products etc. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Structural Racism

Jasmin Assulin

You can check the slides for Nasim's talk <a href="https://drive.google.com/file/d/1dv0ZOFDTitrUHJfJAgKs6YiO4M8Fxwcs/view"></a><a href="https://drive.google.com/file/d/1dv0ZOFDTitrUHJfJAgKs6YiO4M8Fxwcs/view">here</a><a href="https://drive.google.com/file/d/1dv0ZOFDTitrUHJfJAgKs6YiO4M8Fxwcs/view"></a>. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Reasons why we need inclusion

Nasim Selmani

Did you know that 50% of users will NOT use the English version of your application, if it supports multiple languages? For ambitious high-growth businesses, going global is not "if" but "when" so it's important to recognize the importance of localization, especially in large multi-team projects. This discussion will explore the depths of localization in Agile companies and what can be achieved with a Continuous Localization system. I'll share some common issues we faced with multi-language products and how localization automation helped us to scale the process across many product teams within the company. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Continuous Localization in Enterprise Web Projects

Ante Tomić

You might have heard about Headless CMS. This new type of content platform gives us some benefits compared to a Monolithic CMS.We will talk about the key features of any Headless CMS and how we can integrate a headless platform into our React applications. We will focus on Storyblok, a headless CMS that offers a real-time Visual , a great feature for developers and content creators. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

How to View and React without a Head

Facundo Giuliani

I focus on why inclusion is important in hiring and what are the inclusive hiring practices for any organization that could be taken into use. Inclusive hiring and evaluation process are the great window of opportunity that can truly support inclusion with practical actions. I offer practical tips and a way to implement small changes while working the way towards more inclusive hiring culture and strategy. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

How to avoid bias or exclusion when recruiting

Emmi Marjetta

In this talk we'll take a closer how we do event branding and theming at Brella, and how we want to progress it in the future. Topics such as generating accessible colors will be discussed. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Online event about #reactjs with a hint of #Finland in it.