JS Kongress is the conference about all things JavaScript. Handcrafted with 💙 for the JS community!

The focus of JS Kongress 2019 on March 11-12 is the (r)evolution of Architectures. We will dig deeper into the role of JavaScript as a driving force for modern software and cloud architectures. Join us for two days in Munich, Germany to discuss the impact for us developers as well as companies and agile product development.

Microservices, Data Driven Architectures, Event Sourcing, Stream-oriented architectures, Cloud Native Computing and API First are becoming first-class citizens in software architectures. Also, frontend architectures are improving quickly: reactive programming, redux and the art of state management.

JS Kongress

Mood Video

A walk through the internal architecture of webpack. See how you can extend, implement, or modify any piece of it!

Webpack is one of the most depended on packages for front-end web development. With over 15 million monthly downloads on npm, it has been called the LLVM of the web and taken the JavaScript ecosystem by storm. 

However, few understand how webpack actually works and how to leverage some of its most powerful features: Custom Plugins! 

Join me as I walk you through the internal architecture of webpack, and show you how you can extend, implement, or modify any piece of it! 

Join me as we unravel the mystery behind webpack together!

Everything’s a plugin: Understanding webpack from the inside out

In recent years, JavaScript has grown considerably in size. See what features are still missing and what features may not be needed.

In recent years, JavaScript has grown considerably in size. In this talk, we’ll explore what features are still missing and what features may not be needed.

Future JavaScript: what is still missing?

Get familiar with event sourcing on the server and learn how it can be combined into your architecture.

The overall amount of data that our servers have to handle continue to grow every year, as servers need to handle more and more traffic. As such, event sourcing patterns become more useful to handle the load. In this talk, I would like to talk about the different architecture patterns to implement event sourcing in your Node.js server and what architecture can fit every case.

How To Combine Event Sourcing Architecture In Your Node.js Server

Understand the web standards process and the architectural decisions that need to be made to add a new feature to the web platform.

One of the unique thing about the web is that no one owns the platform. There are multiple runtime environments available from different browser vendors, and new features are being added every day by different organizations. 

In this talk, we’ll look at how web platform features are proposed, developed, and tested. We’ll go over what kind of systems are in place to coordinate a massively distributed engineering project, and why you should get involved!

A web platform feature is born! – massively distributed multiplayer engineering

Introduction to the world of event-driven systems, CQRS, and Event Sourcing concepts.

The stream-oriented architectures are still very rare in the node.js world. While reactive programming becomes a first-class citizen in the front-end applications, we don’t have too many materials on how to apply some of these concepts in our server-side apps. 

In this talk, Kamil will show you the Nest framework as well as introduce you to the world of event-driven systems, CQRS, and Event Sourcing concepts (and how to really take advantage of them).

Taming reactive Node.js: Stream-oriented architecture with NestJS

Take a look at this new paradigm for UI components.

Did you ever feel like monkey patching your UI component? Adding too many if/else, handling a lot of complexity or hacking several non-desired side effects. Did you ever have a problem with double-clicking an async button? Fetching multiple times the same resource in a row? Did you have problems translating UX interfaces and mock-ups into your applications scenes?

All these kind of problems can be properly fixed by applying a different point of view. An architecture based upon Mealy state machines. Also known as finite state machines or automatas. These machines are deterministic, pure and idempotent. Opening a new set of possibilities from predictable components to autogenerated tests.

Let’s take a look at this new paradigm for UI components. You’ll discover a better and cleaner world 😉

What are the key takeaways from this talk?
- Define your app states in advance; even if you’re not using an FSM
- FSM can reduce to 0 the number of run-time bugs your app produces.

Libraries:
- State machines and statecharts for the modern web. https://github.com/davidkpiano/xstate
- A state machine abstraction for React https://github.com/michelebertoli/react-automata
- an open source platform for network analysis and visualization https://github.com/cytoscape/cytoscape

Mastering UIs with Finite State Machines

Authentication does not have to be over complicated, as long as you use the right solution for each situation.

In this talk, I will try to explain in depth, the way JSON Web Tokens work and can be used to secure your single page apps. I will explain the difference between using opaque tokens and JWTs. 

The talk will also give an overview of a modern authentication flow and a step by step breakdown of how it works exactly. No specific previous knowledge is required, but it helps the audience has some experience with authenticating users.

Knock knock, who’s there? Authenticating your single page apps using JSON Web Tokens

Understand what truly functional-reactive code in JavaScript looks like.

Today we have the ability to write fully Functional-Reactive code in JavaScript, using RxJS. However, in our day-to-day life, we often use RxJS alongside other libraries and patterns that make our life easier, but also distance us from pure Functional-Reactive Programming (FRP). What would an app that has been written completely in RxJS, and in-line with the principles of FRP, look like?

In this talk, we will examine such an app – a Pomodoro productivity timer with start and pause functionality – and use it to understand what truly functional-reactive code in JavaScript looks like, and what are the principles that underlie it.

more:
- 🎤 Like A Surgeon – Dissecting a completely Functional-Reactive JavaScript app for the very first time 🎶 (remember?)
- repo: https://github.com/NettaB/reactive-pomodoro


What are the key takeaways from this talk?
- What are the main concepts of Functional-Reactive Programming, and how are they expressed in JavaScript/RxJS code?
- What is the structure of an FRP app, and how is it different from how we usually write code?
- How can we integrate more FRP concepts in our everyday code?

Dissecting a completely Functional-Reactive JavaScript app

A real-life use case for micro-frontends and motivation for adopting them.

We start with a use case: why would you even want to move to a microfrontends architecture? You’ll learn the motivation, core concepts and principles behind microservices, how they can help your frontend team work more efficiently, and the tradeoffs that are normally involved when you try to apply them to single-page applications. 

Luckily, Docker and Kubernetes can alleviate a lot of these issues, and we’ll walk through a minimal but concrete example of building a microfrontends architecture with these tools on your local machine. Finally, you’ll see how you could migrate gradually and what it takes to bring this architecture to production. No previous knowledge of Docker or Kubernetes is required.
 
What are the key takeaways from this talk?
- A real-life use case for microfrontends and motivation for adopting microfrontends (tech autonomy, reduced impact of failure, team independence)
- Core concepts, principles, and prerequisites of microservices (highly decentralized, independent deployment, modeled after the business domain, and more), and the tradeoffs usually involved when applied to microfrontends (dev/prod parity, interactivity, iframes, developer experience)
- Docker and Kubernetes/Helm fundamentals – the purpose of each tool and how they complement each other
- A minimal but concrete example of how to implement a microfrontends architecture on their local machine with Docker and Kubernetes
- How to migrate to this type of architecture in a gradual way and what’s involved in deploying this architecture to production

Independent deployment of the frontend with Docker and Kubernetes

Understand several beneficial principles of state management at a high level.

State management is a very important topic that brings a lot of new concepts and complexity in an application’s architecture. Instead of focusing only on the implementation details of a specific lib, this talk will explain several beneficial principles of state management at a high level.

Based on this knowledge you will not only be able to understand patterns like FLUX and REDUX but also get the knowledge to compare specific libraries like ngRx, ngxs, akita, redux-observable.

What are the key takeaways from this talk?
- Evaluate the need for a state management lib
- Compare state management libs
- Craft their own state management

Crafting state management – A principle based architecture

Realize the (r)evolution in the software stack, the key drivers, and the significance of JavaScript as a platform.

The advent of the cloud disrupted the software stack. The shift from the LAMP era to the cloud resulted in the shift of the software status quo. JavaScript is the biggest piece of the new, post-LAMP pie. It’s not only a front-end scripting language, but a software stack game changer that is equally powerful for both the front-end and back-end. The aim of this talk is to show how Javascript is one of the major platforms that is shaking up the stack landscape.

The first half of the talk will cover the key drivers of the shift of the software status quo, touching upon the areas of deployment, integration, scalability, customization, and, distributed systems architecture.

The second half will show the difference between stacks that once upon a time were more varied between client and server, due to JavaScript is now more fluid and homogeneous, with numerous frameworks like Koa, Meteor, React, and, Angular.

The talk will be concluded by sharing resources with the attendees as migrations from the LAMP stack is as much a technical change as it is a cultural one.

Required knowledge: Basics of Cloud computing, LAMP stack, Distributed Systems, and, JavaScript.

What are the key takeaways from this talk?
- Realize the (r)evolution in the software stack.
- Understand the key drivers of this (r)evolution.
- Realize the significance of JavaScript as a platform in this (r)evolution.
- Be able to incorporate change in your work/personal projects using the resources shared in the talk.

The big piece of the post-LAMP pie

Patterns, practices, and technologies for modern front-end engineering at scale.

How do you scale your codebase? We have more than 100 apps, 200 developers in 5 different time zones and more than 1 million lines of code in our frontend repository. With the codebase that big it’s vitally important to have shared patterns, principles and standards and it’s even more important to make sure everyone actually follows those standards.

Learn about the architecture, patterns, and technologies that Atlassian has developed to scale frontend development of its largest and most popular product: Jira, and lessons learned on that journey.

No special knowledge is required, but familiarity and some experience with modern frontend tech stack and ecosystem would help you to get the most out of this talk.

Decomposition and beyond: frontend engineering at scale

How to use Web Component to build a micro-app architecture and mix different technologies.

Web Development is exciting nowadays! We get new innovative technologies on a regular basis. While this is awesome it can also be overwhelming, especially when you have to maintain a product for the long term.

Web Components and Micro Apps provide a remedy for this dilemma. They allow for decomposing a big solution into small self-contained parts that can be maintained by different teams using the best technology for the requirements in question. Come to this session and find out how this idea helps with writing applications that can evolve over a decade and more.

Let’s peacefully unite the best technologies for the different parts of our big enterprise applications!

Angular, React, Vue and Co. – peacefully united thanks to Web Components and Micro Apps

See how Docker & Node can work together with Kubernetes, to release and scale automatically stateless-services. 

We will explore the benefits of DevOps process using Kubernetes, Docker, and Node.js. Showing how Docker and Node.js can work together, using the power of Kubernetes to release and to scale automatically stateless services. 

At this talk we will explore the key concepts and components to start working with Kubernetes, real scenarios and the differences between the traditional approach compared to Container based applications. 

Attendees will learn about the basics of Kubernetes and tips to scale Node.js applications furthermore they will learn the common problems that we face when we decide to change from monoliths to microservices using Docker and JavaScript. 

Scaling Node.js applications with Kubernetes and Docker

What alternative languages are there for writing modern frontend applications today?

After years of advancements in the field, creating better practices, libraries, and frameworks, it’s only natural we look at reinventing the language we use for programming the frontend.

This talk will be an exposition to various modern frontend programming languages you can use today.

Beyond JavaScript: The languages for the modern Web

Explore patterns and libraries to make working with Web Workers easier.

The single-threaded nature of JavaScript can make handling lots of data or complex processing in your web application difficult to balance with providing a good user experience. Web Workers promise to help us find that balance and let us build fast and responsive applications even when doing heavy work, but the APIs for working with them leave much to be desired. 

In this talk, we’ll explore useful patterns for making Web Workers easier to work with and highlight effective ways to communicate between workers, handle complex data processing off the main thread, and test and debug them.

Weaving Webs of Workers

Learn how to run A/B tests at scale and what it takes to build the optimal tests.

We are all working towards one single goal. To create the best user experience. But most of the time we are wrong about what we think is good for the user. We usually have no idea if a feature is useful to the user until it is used by the customers.

My talk is about letting the users help you understand what they need and if a particular feature is really useful for the users by using the technique of A/B testing. We are constantly running A/B tests to improve the customer experience by measuring the business metrics.

Attend my talk to find out how to run A/B tests in your company at scale and what it takes to build the optimal tests.

Let your users decide what they want

Learn how and why to use serverless and micro-services architecture in your web app.

With the advent of serverless architecture, front-end developers can now easily build and deploy their applications without a lot of overheads. 

This session aims to look at how to build a basic web application with serverless architecture and why it’s becoming more popular. 

The attendees should have previous experience with developing web applications with monolith or micro-service architecture. 

The Front-End Stands Alone

TC39, webpack, WebAssembly, RollupJS, ...

See how to optimize network requests to minimize round trips without slowing down critical data paths.

Why choose between fewer network requests and slower larger responses? This talk will show you how to optimize network requests to minimize round trips without slowing down critical data paths. 

We will cover rarely-used but widely supported features to efficiently load data to give your app the fastest possible rendering times.

This talk will answer the following questions:
- GraphQL can be used to minimize request round trips.
- Batched data transfer will be slowed down by the slowest data that is requested
- We can combine batched data transfer with streaming responses to get the best of both worlds (even in legacy browsers) without the overhead of managing socket connections.

Streaming HTTP and GraphQL

2019

The focus of JS Kongress 2020 is Scaling JS – Pushing the Limits: Massive Platforms, Data-Driven Architectures, and Modern APIs.

The #DeepTrack is about all things JavaScript. YOU create the program!

Join us, and let's watch out for solutions and best practices.