Ben Ilegbodu

How do you set up Typescript and other static checking? Do you target ESM or CJS builds? Is integration testing even possible?

So you have a great idea for the perfect JS library... but the implementation is only half the battle. You also need to configure infrastructure to develop, test, build and deploy your package. How do you set up Typescript and other static checking? Do you target ESM or CJS builds? Is integration testing even possible? There’s so much extra to consider!

Let’s learn what makes up the “perfect” library tooling. Familiarity with developing JavaScript packages will help you get the most out of this session, but you will gain plenty of helpful insights even if you have yet to build one. Oh, and don’t worry if you don’t understand all of those terms — you soon will after this video!

2020

JSConf Hawaiʻi

The "Perfect" Library Tooling

React has exploded in popularity. But it’s only a UI library, not a full-fledged framework like Angular, Ember or [insert latest JS framework]. We need to create our own “framework” by picking from the plethora of libraries in the React ecosystem. But which ones should we choose? Or better yet, which ones do we actually need? Do we need a Redux? What about handling styling, testing and routing, etc? How does it all come together?!!?!

Let’s walk through the tools and helper libraries that surround React. By the end of the session, you’ll have a solid understanding of the ecosystem and know which libraries you should prioritize learning first in order to confidently build your own React-based stack.

2018

ReactNext

State of the React Ecosystem

React’s sophisticated reconciler (aka the “Virtual DOM”) makes updates to the UI feel fast because it optimizes interactions with the DOM. As a result, we no longer have to worry about how to transition our UI from one state to the next. However, the reconciler is not a silver bullet; even the new Fiber Reconciler. Our React apps can still get sluggish, especially as they grow in size and data. 

Let’s discuss some causes for slow-downs and tools to diagnose problems so that we can speed up our apps.

React Alicante

Help! My React app is slowwwww!

As the Frontend Platform team at Eventbrite switched from Backbone/Marionette over to React, it had to convince other developers, managers, directors, and non-engineers that React was the right path. And the rationale for moving wasn’t just because React is insanely popular. There are many tangible benefits that make the effort of migrating worthwhile. 

New to React and want to learn a little about how it works? Seeking ammunition to convince your team to make the change? Come learn about why we made the decision to transition to React, through an introduction of how to build user interactions with React.

Reactathon

Why React?

Fiber was introduced in version 16 of React. It is a ground-up rewrite of the React scheduler, typically mis-referred to as the "Virtual DOM." The Fiber-based scheduler supports "cooperative scheduling" and allows for other output renderers besides the browser DOM. 

In this session geared towards those familiar with React, let’s learn about what React Fiber is and why it exists through the lens of how it will impact your React development and the performance of your apps at runtime.

2017

React Rally

Layperson's guide to React Fiber

Discover how to leverage the new JavaScript language features and apply them to our React Native project.

JavaScript is evolving quickly. The ES6 specification was released back in 2015 and has been implemented by modern browsers. New versions of ECMAScript will now be released on a yearly basis. We can leverage ES6 and functionality slated for future versions right now to write even clearer and more concise React code.

Experience with React will help you get the most out of this session, but you don’t have to have a JavaScript black belt to leave feeling confident in using ES.next with React. Learn how to write cleaner code using the new spread operator, classes, modules, destructuring, and other tasty syntactic sugar features being introduced into ECMAScript. Oh, and don’t worry if you don’t understand all of those terms — you soon will after this session!

The goal of this talk is to walk React / React Native developers who aren’t familiar with new ECMAScript through some of its cool new features (including proposed new ones). But it’s more than just learning ES6+. It’s about how we can apply it (as well as future versions of ECMAScript) with React to write clearer and more succinct code. 

We’ll start off with React’s previous official tutorial that is 100% ES5 and slowly transform it using various ES6 and proposed future ECMAScript features that are transpiled via Babel. I developed a Github repo that is a step-by-step example of how to leverage ES6+/ES2015+ in React by rewriting (an adapted version of) the official React tutorial.

ECMAScript 2015 is JavaScript. React added support for native ES6 classes over a year ago (with v0.13), but there is still lots of developers still writing in ES5. Many coding examples and StackOverflow answers are given in ES6 so it’s important for us in the React community to level up.