Conf42 JavaScript 2022

Conf42 JavaScript 2022 is going live! Schedule, Lineup & RSVP: https://www.conf42.com/js2022 Join Discord to interact: https://discord.gg/DnyHgrC7jC 0:00 Intro, Sponsors, Partners Keynote 3:44 Finbar Fleming Getting started 4:38 Chris Miller & Liz Kaufmann 5:51 Marcell Endrey 6:15 Mayank Kumar 6:44 Travis Waith-Mair 7:10 Andrew Knight Tools 7:29 Naty Rocha 8:11 Katarzyna Wojdalska 8:51 Alba Rivas 9:23 Anton Kalik 10:13 Arman Murzabulatov 10:39 Dmitry Khorev 11:04 Eric Burel 11:43 Luciano Mammino 12:43 Michele Riva 13:21 Robert Aboukhalil 13:43 Roy Derks 14:12 Yagiz Nizipli 14:45 Michael Wehar 15:26 Saravana Balaji Srinivasan Deep Dive 16:04 Joshua Arvin Lat 16:26 Li Hau Tan 17:05 Austin Gil 17:43 Serhii Bilyk (no intro) 17:55 Gareth McCumskey (no intro) 18:06 Gaurab Patra & Bhagyajit Jagdev 18:40 Griffin Solot-Kehl 19:14 Robert Hoffman 19:48 Roman Boiko 20:57 Rob Richardson Lessons Learned 21:18 Ben Tlusty 21:56 Dave Bitter 22:26 James Diacono 23:20 Julio Cesar Abalde Reyes 23:49 Domenico Musto 24:23 Thank you, Join our Discord to interact! https://discord.gg/DnyHgrC7jC

JavaScript can be very difficult to debug, especially errors impacting end users in Production. The way that JavaScript applications are developed and debugged pre-production often means that good processes are not put in place to monitor errors in production. Most teams only learn about errors when customers call in with a problem. Reducing the time taken from the time and user first experiences and error to the point where a developer understands the root cause of the error can transform the experience of your end users, and give developers time back to work on new feature development Learn how to improve how quickly you can fix errors in Production Other talks at this conference 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

I have worked in the industry on and off since the year 2000. I now teach code at The School Of Code. I have a passion for seeing code that is at it's best and the most friendly for every skill level, whilst still maintaining effectiveness and completeness. This talk has been given in the PHP world several times, and each time this has prompted strong discussion around the definitions of how this might look in practice. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

For a couple of years, I taught beginner programming to high school and university students who did not intend to be developers. The members of these classes did not have an engineering background and only applied for fun — or because the curriculum forced them to. During these times I went through multiple iterations of my course materials and changed many of its details including the language being taught, the editor being used, and the storage of the resulting programs. I kept the parts that worked well in the previous semester and threw out the ones that did not. I had some very positive feedback along the way, along with some total failures. In this talk, I am sharing my learnings from these classes and invite the audience to help me improve the material even further with their feedback. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

From this talk the audience will get to know what exactly internalisation and localisation is, how are they related to or different from each other. How i18n can help them upscale their app and increase their user base. They will know how an application can be created to support multiple locales so that the users from different parts and origin around the globe can use their apps in their native locales (language). They will also learn about the common challenges around supporting i18n and how to address those challenges. They will also get to know about the browser support in the context of i18n and l10n. We will also touch base around the Right-to-Left language based app rendering. The audience will also get to know that i18n, l10n are not specific to the textual content but they also deal with images, numbers, currency etc. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Solid.js has an API that feels very familiar to React developers, but under the hood is completely different. Solid.js has a suite of "fine-grained reactive primitives." It is these primitives that we will explore and learn how to use coming from the perspective of a React.js Developer. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Component libraries are the building blocks of modern front-end apps. Developers can create a component once and reuse it in many places to create consistent user experience. But what happens if a change accidentally breaks any of those components? That could affect many pages! Changes to size, color, layout, and phrases may unintentionally go undetected. How can we easily catch these bugs? Visual component testing! In this talk, we will: 1. Learn how visual testing differs from traditional automated testing 2. Demo visual tests for a live React app with Storybook components 3. Evaluate pros and cons of different visual testing techniques We will use [Applitools Eyes](https://applitools.com/products-eyes/) as our visual testing tool. After this talk, you will be better equipped to test your apps. All example code will be provided in a GitHub repository for you to clone and extend as well! Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Promises are the standard approach to handling asynchronous operations in JavaScript and TypeScript. While they are flexible and fun to program in, important downsides make our codebase less maintainable. For instance, errors in a promise are typed as any, they use eager evaluation, and you can completely omit a catch operation for error handling. So there should be something else we can use, shouldn’t it? In this talk, we will be learning how to use functional programming and some alternative asynchronous computations like TaskEither, ReaderTaskEither, and Futures to show how we can handle side effects and create more robust applications. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Did you know that more than 250 000 websites are published every day? The majority uses too heavy fonts, too large/unnecessary images or utilises redundant libraries. These and other factors generate the carbon footprint. Actually, one view of an average website emits 4.6 g CO2 which sums up to 553 kg CO2 annually. Unfortunately, current solutions optimise only already existing websites. ec0lint is a tool for frontend developers that mitigates the carbon footprint of websites. It shows tips advising how to create a more climate-friendly code. Thanks to code optimization ec0lint can help in reducing CO2 emissions per one view from 4.6 g to ~0.2 g saving 529 kg CO2 (-96%!) annually. In the keynote, we want to share our knowledge about digital ecology with the audience, tips and tricks on how to mitigate digital footprint and information about the tool we created. Our website (active from the official release day 07.06.22): ec0lint.com An article with tips written by me: https://www.linkedin.com/pulse/change-your-online-habits-mitigate-climate-crisis-katarzyna-wojdalska/ An article about digital ecology written by me: https://www.linkedin.com/pulse/have-you-ever-wondered-how-much-carbon-emissions-your-wojdalska/ Our GitHub: https://github.com/ec0lint/ec0lint Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

https://slack.com is a messaging app for business that connects people to the information they need. In this talk we’ll see how to extend Slack functionality by developing a custom app. We’ll use Slack’s SDK for Node.js, Bolt.js (https://api.slack.com/tools/bolt) and Salesforce as backend. The app will let us create and manage work travel requests on Slack, avoiding context switching and maximizing productivity. Are you ready to fly?? Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

This is the story of my experience about application from scratch till fully workable service using React and Node JS. You will find how to setup the project, how to handle the session, how to build the interface, where to start and what to take into account in the development process for your first startup. You will see the whole infrastructure of the project with diagrams. You will get some code of communication between server and client using GraphQL and Apollo. You will see the appliance of algorithm training words, creating collections on MongoDB. Security part of protecting routes. All tools in one for simple startups just in one speech. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

I discovered MeteorJS when I was a co-founder/CTO of an early-stage startup and we desperately needed to develop quickly and be very flexible (180 degrees pivot over the weekend) upon the needs of clients. MeteorJS is a full-stack JS framework that helps build quickly. I will explain how MeteorJS works and how to utilize it in the best way. Also, will talk about the tradeoffs of using MeteorJS (vs traditional stacks) and the strategy for future migration to different more popular stacks. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Join me for a talk on developing scalable event-driven applications with NestJS. If you’ve never tried NestJS - I’ll talk briefly about its advantages and use cases it can solve for you. We’ll explore a hands-on example of scalability issues that can happen and the common approaches to solving them. Thanks and see you. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Jamstack, SSR, SSG, static rendering, Next.js, Gatsby, ISR, prerendering, edge handlers... JavaScript developers sure like making up new words! But what do they mean, *actually*? In this talk, I'll demystify those fancy concepts and propose a better definition of ""server-side rendering"" a web app. You thought ""server-side rendering"" and ""static rendering"" were different things? That you cannot render authenticated, paid or personalized content at build-time? That per-request SSR costs an arm and a leg? Then this talk will blow your mind! Based on this corrected definition of SSR, I'll show you how you can solve the ""rich guest/poor customer"" issue that arises when you don't use static rendering to its full potential. The result: ultra-personalized static websites, that cost nothing to host and deliver the best possible user experience. Segment your renders and make your customers rich again! Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Imagine you are hosting a private event and you want to create a website to invite all your guests. Of course, you'd like to have an easy way to just share a URL with every guest and they should be able to access all the details of the event. Everyone else should not be allowed to see the page. Even nicer if the website is customized for every guest and if you could use the same website to collect information from the guests (who is coming and who is not). Ok, how do we build all of this? But, most importantly, how do we build it quickly? How do we keep it simple and possibly host it 100% for FREE? I had to do something like this recently so, in this talk, I am going to share my solution, which involves a React SPA (built with Next.js & Vercel) and AirTable as a backend! In the process, we are going to learn some tricks, like how to build a custom React Hook and how to protect our app from AirTable query injection (yes, it's a thing)! Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

How can a JavaScript-based search engine retrieve millions of records in a matter of microseconds? Why is JavaScript the right language to implement a true isomorphic application to be deployed everywhere, from mobile applications to edge networks? In this talk, we will see how Lyra, a full-text search engine written in JavaScript, is challenging the search industry with an incredible combination of performance and developer experience. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

In this talk, I'll dive into how sandbox.bio was built, with a focus on how WebAssembly enabled bringing command-line tools to the web. Although these command-line tools were originally written in C/C++, they all run directly in the browser, thanks to WebAssembly! Since the computations run on each user's computer, this makes the application highly scalable and cost-effective. Along the way, I'll discuss how to get started with WebAssembly, along with its benefits and pitfalls (it's a great technology but not always the right tool for the job!). Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Type systems like TypeScript are the next thing when developing JavaScript applications. They make sure that your props are passed in the correct form and shape throughout your application. Together with GraphQLs query language that is based on types, you can create the web application of the future! Structure: With (live) code examples I will show how to combine TypeScript and GraphQL into a fully functioning application that is based on a secure type system. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Performance plays and important role in engineering. After looking for contributing to Node.js, implementing a very fast specification compliant URL state machine and a parser for Node.js became the project which pushes the boundaries of both javascript user-land and node.js. I've been working on implementing the URL parser, currently written in C++, in Rust and WebAssembly. I want to share my experience working on it, and benchmarking with the native implementation. The first talk will cover implementing it in Rust and WebAssembly, which I wrote it on https://www.yagiz.co/implementing-node-js-url-parser-in-webassembly-with-rust/, and then I'll focus on implementing it using JavaScript and releasing it under github.com/anonrig/url-js. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

This past summer, I worked with two undergraduate students (Alyssa Zhang and Maya Newman-Toker) and one software engineer (John Mancini) on a research project that investigates computer generated artwork. During this investigation, we designed and implemented nine algorithms that generate visual designs. Our algorithms, coded in JavaScript, are built from procedural processes that draw lines and basic shapes onto a digital canvas. These procedural processes were inspired by mathematical concepts, natural phenomena, and artistic trends, but contain many parameters to allow for image variation. We used our algorithms to build a dataset of over 1,000 algorithmically generated artworks, which we recruited reviewers to compare and rate. We plan to analyze the reviewers' ratings to find associations between different parameterizations of our algorithms and the response of reviewers to the resulting images. Check out the GitHub repo: https://github.com/Algorithmically-Generated-Artwork/Drawing-Program Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

This talk will introduce the audience to an exciting framework that leverages Micro-frontend strategy and makes Typescript/Javascript applications available across different platforms like Web, Desktop, VSCode, Chrome extension etc. The framework is highly flexible and scalable for code development. Additionally, I will elaborate on the challenges we at Red Hat overcame by implementing this Multiplying Architecture that benefited our community and the end users to a great extent. I’ll illustrate via some examples and implementation options and discuss Backend for Frontend(BFF), sync and async services, event bus, federated modules, and other opportunities for decoupling your front-end architecture. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

When dealing with machine learning (ML) requirements, most teams generally start using **Python** or **R** due to the number of references available using those languages. However, there are cases where companies do not have the bandwidth and budget to learn a new language on top of JavaScript especially if JavaScript and Node.js are being used in most deployed systems. That said, ML practitioners should still be able to build and deploy ML-powered applications using JavaScript as long as they know which tools, services, and packages are available for these types of requirements. In this talk, we will discuss how to use different techniques to build machine learning powered apps ranging from fully abstracted to fully customized solutions with JavaScript Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Inspired by talks such as build your own react, we are going to build our own Svelte. Svelte is a compiler-based frontend framework that compiles your code into optimised JavaScript. In this 40-min talk, we will write a Svelte compiler from scratch, and learn everything about designing a compiler. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

If you're a JavaScript developer, chances are, you've heard about TypeScript. In this talk, I want to share an iterative approach to enable TypeScript support with as little tooling as possible, using JSDocs. I break it into four stages: - Enabling TypeScript in a JavaScript file - Enabling TypScript in a whole JavaScript project - Integrating TypeScript into CI/CD Pipeline - Generating Type Definitions for Open-Source Libraries Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

You will learn how to write safer typescript: - template literal types - permutations and combinations of argument types - type inference on function arguments Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

They say if something is too good to be true, it usually is … except now. Using the Serverless Framework (the most popular development tool for building serverless applications according to DataDog’s “state of serverless” report) and some JavaScript, you can rapidly spin up applications faster than ever before and get it deployed into a production ready state at the same time without needing to trudge through the maze of complexity that is AWS. Lets not forget to mention you’ll save money at the same time! Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Today's PCs are more powerful than the chips used in the Apollo mission. Participants will learn to implement a robust frontend data analytics framework using AlaSQL.JS. Data can be imported to AlaSQL very fast, then custom queries can be written to do different complex analytical functions without hitting the server. Participants will also learn to build a custom reporting framework that sits in the browser and is customized for different users' needs, which is highly desirable for multi-tenant architecture. In the end, participants will get to know about a few more interesting use cases and open source projects to contribute to. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Users expect immersive experiences that can not only be entertaining but create engagement and retention. This workshop will explore some of the theory around user perception while learning the BabylonJS library for creating 3D environments in a web browser. Additional hands-on sections explore extending this environment to include live streaming media and communications between participants in that metaverse environment. For real-time interactivity with sub-second latency we'll cover some of the same techniques with WebRTC being used by major companies for broadcast quality workflows. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Do you want to become an infrastructure wizard overnight? Then this talk is for you. With most tools for Infrastructure as Code, we describe our infrastructure in a declarative configuration language. But there is another way: We can use a general-purpose programming language like TypeScript, Java or C#. This talk gives an overview of this alternative approach to IaC and answers some of the most burning questions: Can we finally get rid of tons and tons of YAML and JSON files? What are the pros and cons of coding instead of configuring? What tools can we use, what are their differences? And most importantly, do they help us to build infrastructure like a boss without 30 years of experience? Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

In my talk I will present different ways to implement Backends for Frontends pattern with the help of Serverless services on AWS. I will share best practices and also talk about some pitfalls. I also will do a live demo on how to set-up the developer environment, develop a service, test it and deploy on AWS. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Have you ever wanted to refactor mercilessly but didn't want to break the fragile tower? Or have you ever pushed to production only to spend the next few days cleaning up the regressions? You need integration tests, and Cypress is a great, fast way to build them. With a simple JavaScript or TypeScript interface, you can automate browsers to hit those critical functions in your app to prove it works as expected -- this time and every time. Join us to dive into building Cypress tests and leave with confidence to refactor your way to greatness. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

You won’t believe #7! Are you tired? Is your child keeping you up at night? This talk is for you! SRP, The Boy Scout Rule, KISS, YAGNI, Tell, Don’t Ask! In this talk, we will go through real-life examples that will help us to better understand how to write better code. I will share with you how I used these principles as a new father so I can get more sleep and peace of mind. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Remix is a great framework to build robust, progressively enhanced and interactive web apps! During Covid we all missed the Parties.... therefore Dave will create his own party on stage. He will take you on a fun journey on how he created a multi-user and real-time progressive web app. But be aware, there is a guest list and not every solution is invited to join the party! Dave will show you how the Remix friend group will keep your party rocking: - where the state of your data is on the server where it belongs. (load some data and take action to get the party started). - where this multi-user web app is not dependent on complex client-side javascript (so even your drunk friend will understand it) - where the client-side is less error-prone (no party fouls wanted) - where the components are just plain stupid (no good story starts with a glass of milk) - where your application becomes simple and easy to understand (you know, for that friend) Dave will tell you about the challenges he encountered building this web app and how it was solved charmingly by using Remix. He will show you how Remix can be used for web apps with a lot of interactivity not just for plain websites with an occasional form. Getting FOMO? Make sure to sign up for the party and don’t miss out! Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

Programmers have been always been subject to feedback loops. Fast feedback liberates us to do our best work, and slow feedback punishes us. To help us understand our predicament, a brief history lesson is given. This is followed by a demonstration of the REPL, an interactive programming tool. Though widely neglected, the REPL has the potential to make us all happier and more productive. There will be something in this talk for programmers of any language or skill level, but note that the demonstration is in JavaScript. Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

After a bad experience with some backend teams that changed the API without informing the frontend team in any way, we decided to introduce the API First paradigm in our development, adopting the OpenAPI specifications. This, together with a contract-based development, would allow us to detect such changes earlier and not reach critical moments at the end of the sprint. One of the problems we encountered was than all the tools we found depend on java that allow, so we made the decision to build our own CLI in nodejs. From this need, several applications are born, aimed at different moments of development. Following the specifications contained in an OpenAPI file, allows us to: automatically create code in javascript or typescript, both for client and server, so that we save a lot of time that we can spend thinking. This functionality is already available within the application openapi-nodejs-cli automatically create a mock server, which allows the front team not to have to wait for the API to be finished check that an API meets the indicated OpenAPI specifications, which allows us to test within the development flow for early detection of changes in the API Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk

The journey from physical computers to functions running in the cloud has changed how engineering teams work forever. The role of software developers and infrastructure engineers is not what it used to be. But what is coming next ? What’s beyond devops, containers and serveless ? In this session we will explore new emerging models for software development which aim to boost productivity and reduce time to market. Warning: this talk might contain code Other sessions at this event 🚀🪐 https://www.conf42.com/js2022 — 0:00 Intro 0:46 Talk