LEARN FROM THE BEST TRAINERS IN THE CLOUD

Remix Fundamentals (Remote)

Building modern web applications is riddled with complexity And that's only if you bother to deal with the problems

Tired of wiring up onSubmit to backend APIs and making sure your client-side cache stays up-to-date? Wouldn't it be cool to be able to use the global nature of CSS to your benefit, rather than find tools or conventions to avoid or work around it? And how would you like nested layouts with intelligent and performance optimized data management that just works™?

Remix solves some of these problems, and completely eliminates the rest. You don't even have to think about server cache management or global CSS namespace clashes. It's not that Remix has APIs to avoid these problems, they simply don't exist when you're using Remix. Oh, and you don't need that huge complex graphql client when you're using Remix. They've got you covered. Ready to build faster apps faster?

At the end of this workshop, you'll know how to:

Create Remix Routes

Style Remix applications

Load data in Remix loaders

Mutate data with forms and actions

How to Build UI's for Smart Contracts (Remote)

There are many journeys we can take into becoming a web3 developer. Not all journeys require learning a completely new language and becoming a smart contract developer. In this workshop we will learn how to build our own React UI on top of any existing smart contracts on the Polygon Proof of Stake Blockchain. We will explore a basic overview of blockchains and learn about the advantages of building on Polygon. We will also gain an understanding of what Smart Contracts are, learn how to find existing ones, and learn tools that help us interact with them from a React application.

Web Accessibility in JavaScript Apps (Remote)

Often we see JavaScript damaging the accessibility of a website. In this workshop, you’ll learn how to avoid common mistakes and how to use JS in your favor to actually enhance the accessibility of your web apps!

In this workshop we’ll explore multiple real-world examples with accessibility no-nos, and you'll learn how to make them work for people using a mouse or a keyboard. You’ll also learn how screen readers are used, and I'll show you that there's no reason to be afraid of using one!

Join me and let me show you how accessibility doesn't limit your solutions or skills. On the contrary, it will make them more inclusive!

By the end, you will:

• Understand WCAG principles and how they're organized
• Know when to use accessibility audit tools
• Quickly identify common accessibility issues
• Integrate accessibility into your team workflow right away
• Realize that creating accessible websites isn’t as hard as it sounds ;)

GraphQL - From Zero to Hero in 3 hours

How to build a fullstack GraphQL application (Postgres + NestJs + React) in the shortest time possible.

All beginnings are hard. Even harder than choosing the technology is often developing a suitable architecture. Especially when it comes to GraphQL.

In this workshop, you will get a variety of best practices that you would normally have to work through over a number of projects - all in just three hours.

If you've always wanted to participate in a hackathon to get something up and running in the shortest amount of time - then take an active part in this workshop, and participate in the thought processes of the trainer.

Hands-on with AG Grid's React Data Grid (from AG Grid team, remote)

Get started with AG Grid React Data Grid with a hands-on tutorial from the core team that will take you through the steps of creating your first grid, including how to configure the grid with simple properties and custom components. AG Grid community edition is completely free to use in commercial applications, so you'll learn a powerful tool that you can immediately add to your projects. You'll also discover how to load data into the grid and different ways to add custom rendering to the grid. By the end of the workshop, you will have created an AG Grid React Data Grid and customized with functional React components.

Build a knowledge base with Gatsby, Contentful and AWS (from Rangle team, remote)

In this workshop, we will go over how to build a knowledge base using Gatsby, a static site generator Framework that uses React and graphQL, Contentful, a Headless CMS to drive the content and deploy it to AWS S3.

High-performance Next.js

Next.js is a compelling framework that makes many tasks effortless by providing many out-of-the-box solutions. But as soon as our app needs to scale, it is essential to maintain high performance without compromising maintenance and server costs. In this workshop, we will see how to analyze Next.js performances, resources usage, how to scale it, and how to make the right decisions while writing the application architecture.

JS Security Testing in GitHub Actions (from StackHawk team, remote)

This workshop will focus on automating software composition analysis, static application security testing and dynamic application security testing using GitHub Actions. After a brief introduction covering the different types of application security and the importance of finding security vulnerabilities before they hit production, we'll dive into a hands-on session where users will add three different security testing tool to their build pipelines.

Crash Course into TypeScript for content from headless CMS (from Kontent by Kentico team, remote)

In this workshop, I’ll first show you how to create a new project in a headless CMS, fill it with data, and use the content in your project. Then, we’ll spend the rest of time in code, we will:

• Generate strongly typed models and structure for the fetched content.
• Use the content in components
• Resolve content from rich text fields into React components
• Touch on deployment pipelines and possibilities for discovering content-related issues before hitting production

You will learn:

• How to work with content from headless CMS
• How content model can be leveraged to generate TS types and what benefits it brings to your project
• How not to use string literals for content in code anymore
• How to do rich text resolution into React components
• How to minimize or avoid content-related issues before hitting production

Build Web3 apps with React (from Decentology team, Remote)

The workshop is designed to help Web2 developers start building for Web3 using the Hyperverse. The Hyperverse is an open marketplace of community-built, audited, easy to discover smart modules. Our goal - to make it easy for React developers to build Web3 apps without writing a single line of smart contract code. Think “npm for smart contracts.”

Learn more about the Hyperverse here.

We will go over all the blockchain/crypto basics you need to know to start building on the Hyperverse, so you do not need to have any previous knowledge about the Web3 space. You just need to have React experience.

Build a Headless WordPress App with Next.js and WPGraphQL (from WP Engine team, remote)

In this workshop, you’ll learn how to build a Next.js app that uses Apollo Client to fetch data from a headless WordPress backend and use it to render the pages of your app. You’ll learn when you should consider a headless WordPress architecture, how to turn a WordPress backend into a GraphQL server, how to compose queries using the GraphiQL IDE, how to colocate GraphQL fragments with your components, and more.

Bringing your React Web App to native with Capacitor (from Ionic team, remote)

So, you have a killer React app you've built and want to take it from your web browser to the App Store. Sure, there are a lot of options here, but most will require you to maintain separate apps for each platform. You want your codebase to be as close as possible across Web, Android, and iOS. Thankfully, with Capacitor, you can take your existing web app and quickly create native iOS and Android apps for distribution on your favorite App Store!

This workshop is aimed at intermediate developers that have an existing React application, or are interested in mobile development with React. We will go over:

• What is Capacitor
• How does it compare to other cross-platform solutions
• Using Capacitor to build a native application using your existing web code
• Tidying up our application for distribution on mobile app stores with naming conventions, icons, splashscreens and more.

How To Design A Sustainable Freelance/Contracting Career + Speedcoding Challenge (from Toptal team, remote)

Ready to kickstart your freelance career or just getting started on your freelance journey? You’re in the right spot. Learn from the world’s largest fully distributed workforce in the world.

The independent talent movement is the future of work. If you’re considering leaving full-time employment for a career as a freelancer, now is the time to find your successful space in the independent talent workforce. More people are working freelance today than ever before, with the freelance marketplace now contributing $1.2 trillion to the US economy. Some of the most in-demand roles for freelancers right now are senior developers with professional experience in React, Python, Blockchain, QA, and Node.js.

This workshop will help you design a sustainable and profitable full-time (or part-time) freelancing/contracting career. We will give you tools, tips, best practices, and help you avoid common pitfalls.

At the end of the workshop there will be a Q&A session with a Freelance Developer who can answer your questions and provide insights and tips into their own success.

During the Workshop break, we will be running a speed-coding challenge! At the end of the workshop, we will award a prize for the winner and display the leaderboard.

We will have you login to our portal and complete the challenge as fast as you can to earn points. Points are assigned based on difficulty and the speed at which you solve the tasks. In case you complete all tasks, you get extra points for the remaining time. You’ll see your score, ranking, and the leaderboard once you complete the challenge.

We will be giving away three Amazon Gift Cards ($200, $100, $75) for the top three winners.

Detox 101: How to write stable end-to-end tests for your React Native application (from Wix team, remote)

Compared to unit testing, end-to-end testing aims to interact with your application just like a real user. And as we all know it can be pretty challenging. Especially when we talk about Mobile applications.

Tests rely on many conditions and are considered to be slow and flaky. On the other hand - end-to-end tests can give the greatest confidence that your app is working. And if done right - can become an amazing tool for boosting developer velocity.

Detox is a gray-box end-to-end testing framework for mobile apps. Developed by Wix to solve the problem of slowness and flakiness and used by React Native itself as its E2E testing tool.

Join me on this workshop to learn how to make your mobile end-to-end tests with Detox rock.

React at Scale with Nx (from Nrwl team, remote)

The larger a codebase grows, the more difficult it becomes to maintain. All the informal processes of a small team need to be systematized and supported with tooling as the team grows. Come learn how Nx allows developers to focus their attention more on application code and less on tooling.

We’ll build up a monorepo from scratch, creating a client app and server app that share an API type library. We’ll learn how Nx uses executors and generators to make the developer experience more consistent across projects. We’ll then make our own executors and generators for processes that are unique to our organization. We’ll also explore the growing ecosystem of plugins that allow for the smooth integration of frameworks and libraries.

Building custom storefronts on Shopify with Hydrogen (from Shopify team, remote)

Get hands-on with Hydrogen, a React-based framework powered by Shopify. In this workshop, we'll explore the framework and get a custom storefront up and running quickly. You'll learn how (and when) to leverage React Server Components and caching mechanisms to build fast, dynamic, custom storefronts.

Building a Shopify app w React & Node.js (from Shopify team, remote)

Building an app can be tough work but Shopify has created a set of tools and resources to help you build a seamless app experience within the React & Express ecosystem. Get hands-on experience building a Shopify app using the Shopify App CLI, the Shopify App Bridge library, and our design system, Polaris. We’ll show you how to create an app that accesses information from a Shopify store and can run in your local environment. We’ll walk you through how to:

• Create a Shopify app using the Shopify App CLI
• Build a user interface with Polaris React components
• Integrate your app with Shopify using Shopify App Bridge components

React at scale with Vodafone

Join our Vodafone Engineering teams from around the world to see how we apply React technology at scale and with complimentary frameworks.

This session will cover both Web and Mobile application:

Our MyVodafone app provides a primary digital touchpoint for our customers across all of our markets. Our ambition is to grow the relevance of the app for our customers, aligning to other channels and establishing a common platform for markets to experiment and contribute through innersource working practices. Starting from a diverse landscape, hear why we have chosen to use React Native to aide our transition and establish a foundation that offers choice for any market regardless of their app implementation. Understand some of the challenges we faced and how we overcame these.

For Web application, our ambition is to set the proper foundations and enablers to boost cocreation and reuse among all markets looking for efficiency, quality and a best in class user experience. Our main pillars are our web manifesto and our development community.

In the workshop speakers will cover:

• 1 A quick overview of Vodafone

• 2 Focus on our My Vodafone App:

• 2.1 Overview & Why React

• 2.2 Setting the foundation

• 2.3 Bridging as a cornerstone

• 2.4 Migrating from Native to React Native in Vodafone Ireland

• 2.5 Driving re-use beyond the My Vodafone App

• 3 Focus on web application:

• 3.1 Overview

• 3.2 Technical Challenges & Why React

• 3.3 Technical Building Blocks

• 3.4 React in real live

• 3.5 Marketplace in Vodafone Turkey

• 3.6 SME Portal in Vodafone Spain

• 3.7 New Web Architecture in Vodafone Italy

• 3.8 Retail 10 in Vodafone Digital Channels

• 3.9 Source web

• 3.10 Marketing pages on headless CMS in Vodafone UK

Pedro Galán, Andrew Ferguson + their teams will talk through the detail.

How to create editor experiences your team will love

React is renowned for its developer experience. What if you could use it to improve the experience of editors and content creators too? In this workshop, you’ll learn how to use Sanity.io for structured content modeling. Find out how to build, iterate, and configure your own CMS to unify data models with efficient and delightful editor experiences. This workshop is intended for web developers who want to deliver better content experiences for their content teams and clients.