React Rally 2017

For the last few months I have been working on side projects using React, and I’m loving the library and how easy it is to create an app and start building something great.

Thanks to the NFL and Facebook engineering teams and their commitment to diversity in tech, I had the incredible opportunity of attending this year’s React Rally conference in Salt Lake City, Utah. It was my first big conference since becoming a software developer. This is something I couldn’t have imagined a year ago, when I was about to start a dev bootcamp in London!

During these two days I was able to learn from some of the best developers in the React community, and also to chat with some of them face to face. There was plenty of time for everyone to share their experiences and have fun together. The organizers took care of every single detail, and the event was a complete success! You can see the videos for each talk here.

Day #1

React Rally 2017 day 1

Michael JacksonUNPKG: The CDN for everything on npm

Michael was the first speaker of the day. He shared the benefits of unpkg, a CDN that holds all modules that exist on npm, and System.js, a client-side module loader.

Michael Jackson at React Rally 2017

Shirley WuD3 & React

Shirley did an amazing presentation on using D3 and React to visualize data. She shared some of her examples which were mind-blowing.

What I took away from the presentation was that D3 is well suited for visualizations that have basic user interactions such as hover and click, and that combining it with React makes it easier to deal with more complex interactions.

Devon LindseyA hand wave of React for all your Internet of Thangs

Devon showcased an impressive hardware project to control access to her house using a microchip implanted in her hand. The hardware parts she used were a Raspberry Pi, the PN532 NFC chip, and the August smart lock. The software was powered by react-hardware, and Johnny-Five.

Michael ChanBack to React: The story of two apps

Michael gave very useful tips on how to be an efficient React developer, optimizing for change, mastering your tools, and being careful when delegating to open source libraries.

When you npm install, that’s your code now.

Lin ClarkWhat WebAssembly means for React

Lin’s talk went a bit over my head. She explained through cartoons what WebAssembly could potentially mean for React. You can read more about it here: https://hacks.mozilla.org/2017/02/a-cartoon-intro-to-webassembly/.

Ben IlegboduLayperson’s guide to React Fiber

Ben spoke after lunch, and to make sure everybody was alert, he asked us to do ten squats! After that, we were ready to learn about the Fiber reconciler, asynchronous rendering, better UI performance, and error boundaries using componentDidCatch.

It turns out that errors in React v16 will cause the whole component tree to go blank. In order to avoid that, we can wrap sections of our the app so that, when they fail, the rest of the app keeps working normally. It sounds super powerful.

Bonnie MiliánReacTex: using React Native and neural networks to recognize handwritten equations

Bonnie impressed us all with her talk. She gave a brief introduction to deep learning and neural networks, and then showcased one of her projects to recognize handwriting. She used TensorFlow to generate the neural network, React Native to develop a mobile app to read the user’s input, and react-latex to render the resulting equations on the web.

Nicolas GallagherTwitter Lite, React Native, and Progressive Web Apps

Nicolas talked about applying concepts from React Native to the web, such as creating components instead of templates, and using the StyleSheet API instead of normal CSS. React Native Web takes the platform agnostic parts of React Native and brings them to the web developers.

Jana BeckReact-ing htmlFor=empathy

Jana showcased a life-changing project used by disabled patients whose only means of communication is blinking their eyes. It uses WebGazer.js, an open source library for eye-tracking, to detect when the patient blinks in order to select a letter from the ESA alphabet.

Zack ArgyleRedux + ServiceWorker = Offline React

Zack talked about Redux and Service Workers. Service Workers allow caching, push notifications, background sync, and offline network management, among other things. Service Workers and prechaching allow us to develop PWAs that work offline.

Day #2

React Rally 2017 art

Preethi KasireddyWe all started somewhere

Preethi kicked off day 2 with one of my favorite talks about the learning journey that every developer goes through, reminding more seasoned devs of the struggles that they also experienced long time ago.

Being passionate about something makes it almost impossible not to be persistent.

During her talk I couldn’t stop nodding. I completely empathized with her experience deciding to become a developer and teaching herself to code two years ago. She highlighted some of the key things that helped achieve her goal: confidence, learning how to learn, passion, persistence, and a network of people that helped her along the way.

Learning curve

Evan CzaplickiConvergent evolution

Evan talked about Elm, its architecture and its runtime. I learned that in Elm there are no objects but functions, and that everything is immutable. The thing that impressed me the most about Elm were its super helpful error messages.

Henry ZhuSo how does Babel even work?

Henry is the maintainer of Babel, a JS compiler that helps manipulate abstract syntax trees. It takes a string, transforms it into an object, and generates a new string.

He also talked about what it’s like to be an OSS maintainer, and some important skills to be successful in that role, such as empathy, humility, and confidence.

If you are asking yourself how to do OSS, just show up!

Jennifer VanScaling my first enterprise React app!

Jennifer talked about her experience scaling an enterprise React app, and gave valuable tips on how to keep React fast as our product grows.

It’s totally unacceptable for an enterprise product to take 10 seconds to load the page.

Sean LarkinEverything is a plugin!! Mastering webpack from the inside out

Sean explained how webpack works under the hood with a cool diagram showing the connections between all its different pieces.

When you understand that you can modify any of this functionality, then you have the power to make webpack do so much more and make it work for your stack, your environment, or your workflow, and not viceversa.

Sean Larkin at React Rally 2017

Cameron MathesonGraphQL IRL

Cameron talked about GraphQL, a query language made of types and resolvers, and how it benefits both front-end and back-end devs.

Justice MbaDemystifying setState()

Justice gave a great talk explaining React and setState through cartoons. Worth watching if you want to gain a deeper understanding of both.

David KhourshidInfinitely better UIs with finite automata

David talked about some of the struggles that developers face when building user interfaces, and explained how finite state machines built with React can help us solving these issues.

It’s difficult to add a new feature to a legacy app, even if it’s only a week old app.

Cara KueiStart a conversation between browser windows

Cara is a front-end engineer at the NFL. She talked about their experience using postMessage to communicate between browser windows, and how they integrate that with React.

Max StoiberI want you to contribute to open source

Max closed the day highlighting the importance of open source contribution, and encouraging everybody to become part of the OSS community. OSS helps people that are looking for a solution for their problem so that they can avoid solving it again.

He gave some suggestions for people willing to become OSS contributors but don’t know where to start:

  • See if you know something that can help others, and build an OSS project around it, or write a blog post.
  • Writing good documentation is very hard, so helping improve documentation is a good way to start contributing to OSS.
  • Don’t compare yourself unfairly with popular OSS contributors. Start small.
  • Always ask yourself whether you can make your project open source.

Takeaways

One of the high points of the conference for me was having the opportunity to meet the people that are leading the React community, and making friends that I’m sure I’ll see again soon! I feel empowered by each and every one of the people I had the chance to meet at React Rally, their passion, and the personal experiences that brought them to where they are now.

During these two days I was able to see how some organizations are using React to build their products, and also grasped the basics of new libraries, compilers, and languages that I’d love to learn in the future. React Rally was a clear example of the popular saying “a software developer never stops learning”.

Thanks again to the NFL and Facebook engineering teams. Hope to see you again next year! 🐙 💜

React Rally 2017 scholarship team

« Create React App: Linting all the things Asynchronous JavaScript »