Practical

hands-on

courses

Workshops

Do you see yourself leading amazing projects? Then you’d better not miss our workshops. Our instructors will help boost up your skills and show you new dimensions of JavaScript problem-solving.

Learn the most modern React practices, master GraphQL and TypeScript or get a crash-course on the next-gen programming language - ReasonML.

Workshops are happening on December 4 and 5, at SRH Hochschule Berlin. Doors open at 8:30, trainings from 9:00 till 17:00.

Workshop

Modern React

One of the most popular workshops from React Amsterdam 2019.

After some years of silence, React team had recently landed a number of new additions to it's library enabling application developers to optimize their code both for better performance and maintainability. Max will guide your through emerging patterns and show you by example how you can start applying the new best practices in your production apps.

What's included

  1. Using React Hooks
  2. Getting started Concurrent React (Suspense and Time Slicing, previously called "Async React")
  3. Why do React.lazy and React.memo exist?
  4. Utilising Compound Components
  5. Render Props
  6. Performance Profiling with the new React DevTools
  7. and more...

Prerequisites

To attend this workshop you need to be familiar with the basics of React, as well as most of the new features in ES2015.

Learn more about the trainer, author of Styled Components on his website

GraphQL Workshop

by Kitze, React Academy. December 4 and 5.

This one-day workshop will teach you everything you need to know to incorporate GraphQL into your application. During the first half of the workshop, we'll explain the basics of a GraphQL and we’re gonna build a GraphQL server, covering best practices for architecting your schema, error handling, authentication, and permission layers. In the second half of the workshop, we’ll connect our GraphQL server to a React application with Apollo Client. We’ll break down the modular architecture of the client and teach you how to set everything up and use queries and mutations. We’ll show a few different approaches for working with Apollo: Higher Order Components, Render Props, and hooks. Throughout the course of the workshop, you’ll learn practical tips for using GraphQL in production.

What's included

  1. Basics of GraphQL
  2. Set up a GraphQL backend
  3. Setup authentication and permissions layers to secure your GraphQL APIs
  4. Using GraphiQL to explore and test your GraphQL API
  5. Setting up a GraphQL client with Apollo
  6. Fetching and rendering data in your react app with GraphQL queries (using HOCs, render props, hooks)
  7. Inserting data with GraphQL mutations
  8. Updating and deleting data with GraphQL mutations
  9. Updating the store after a mutation
  10. Optimistic updates

Prerequisites

To attend this workshop you need to be familiar with the basics of React, as well as most of the new features in ES2015.

Want to know more about the trainer? Check React Academy website.

Building Whatsapp in a day with React Native and GraphQL

by Vladimir Novick. December 4.

In this full day workshop we will go through the process of creating Whatsapp app in React Native from scratch. We will talk about how to get started, structure our app and create proper navigation workflow, style our screens and create compelling animations. But we will not stop there. Not only React Native is changing mobile ecosystem nowadays, GraphQL is also an important part of how we connect to our backend.

We will go through GraphQL basics and use it in our Whatsapp app to connect to GraphQL endpoint which we will also define and create during workshop by using free and open source Hasura GraphQL engine. Workshop will give you the ultimate experience of creating React Native app from scratch with GraphQL API.

Prerequisites

Familiarity with React, JavaScript and modern syntax features (ES2015).

Testing in React

by Alex Lobera. December 4.

Many developers struggle to write tests 1) quickly and 2) that increase their degree of confidence. Writing good tests requires writing good code. Writing good code that is easy to test requires a good understanding of programming principles and how they apply to the libraries of choice.

In this workshop, you'll learn testing principles & good practices and how to apply them to your React projects with two goals in mind: 1) Tests should help us refactor our code without having to change its corresponding tests 2) Tests should increase our degree of confidence that our React app works as expected without increasing complexity.

What's included

  1. Build your own test framework in JavaScript
  2. White-box testing Vs. Black-box testing
  3. Mocking: testing API calls and Dependency Injection in React
  4. Unit Testing Vs. Integration Testing Vs. Snapshot Testing. When, why, and how Code Coverage best practices
  5. Tooling: React Testing Library, Jest, Enzyme
  6. and more...

Prerequisites

To attend this workshop you need to be familiar with the basics of React, most of the new features in ES2015, as well as promises.

Want to know more about the trainer? Check reactgraphql.academy.

TypeScript Workshop

by Tejas Kumar, your local React hero. December 5.

TypeScript is taking the web platform by storm, mainly because it is so syntactically similar to JavaScript, but comes with powerful scalability features that create more robust products. In this workshop, we will examine an existing JavaScript codebase, port it over to TypeScript, and refactor parts of it to see the value TypeScript can provide.

What's included

  1. Intro to TypeScript and types
  2. The basics: Primitives, interfaces, classes, generics
  3. Practical take on JS project migration
  4. "any", "never", and "unknown". Your buddies for life!
  5. Real-life benefits - easy refactorings, autocomplete
  6. and more...

Prerequisites

Familiarity with React, JavaScript and modern syntax features (ES2015).

Design Systems for React Developers

by Andrey Okonetchnikov & Artem Sapegin. December 5.

Development of digital products is a complex process that involves multiple stakeholders and roles: managers, designers, engineers, QA, and customers. This increases the communication overhead, slows down the process, and oftentimes results and less than ideal user experience.

  • How to communicate design ideas between different stakeholders effectively?
  • How to deliver consistent UI without constant supervising?
  • How to ensure same problems not being solved multiple times?

Design systems offer a systematic approach to the process of product creation. This approach establishes an organization-wide design language that can be backed into a UI library and the styleguide and becomes the single source of truth for the entire organization. Component libraries and living styleguides encourage reuse, promote consistency, improve team productivity, help to identify common patterns and solve similar problems only once.

What's included

  1. Understand what a design system is and how to start thinking in design constraints
  2. Analyze and split your UI into small reusable components
  3. Setup an environment to create components in isolation
  4. Create a living style guide and start building a component library
  5. Structure your application around components
  6. Write maintainable styles for your components based on the design system
  7. and more...

Prerequisites

To attend this workshop you need to be familiar with the basics of React, as well as most of the new features in ES2015.

We’re no
strangers to
Berlin’s scene