React Knowledgeable

React Knowledgeable, nicknamed <RK />, is a fun and friendly podium to share what we learn about React.

Speak at RK

Recap RK Lightning 2

wei on September 10, 2019

Last Thursday, we had our second ever RK Lightning event at HackerspaceSG πŸŽ‰. Here's Wei's recap πŸ‘©πŸ»β€πŸŒΎ

Talks

πŸ’„ Build a Gatsby Theme and publish #13

Raj kicked off the lightning talks with his second live demo with Gatsby, this time building a Gatsby Theme of a site with a like button. What is your one liner for Gatsby Themes? Secretly, I called them partials. After last Thursday's talk, I think of them as a way to communicate with common features via a version number now.

πŸ‘ž Dancing with React Hooks #2

Next, we had our most magical Van to talk about what she learned about hooks by creating those little dancers with funny walk moves on the screen. Joyfully surprising everybody she demoed the moon walk πŸ˜‚ The characters she created in her stage have exactly her style and that leads to her other talk at SingaporeCSS, The Joy of Doing Things without the Need for Justification - (oh look at her newest avatar, it has her MJ hat now!) For this talk, she then dived into what she learned about hooks, how to make setInterval and useEffect have peace, and her take on understanding hooks.

We took a question break. I had a nice conversation with Yangshun, who has me for Docusaurus but it was actually the first time we met in person! The question break also featured popcorns popped by Valentine from Hackerspace our host, and stickers exchange!

πŸ¦– How Modern Static Site Generators Work #11

Yangshun talked about how modern static site generators are built. They share some intrinsic similarities with each other, and they differ from traditional ones. It seems that Yangshun has learned those by building Docusaurus 2 πŸ˜‰

  • slides
  • video (to be updated)

πŸ‘₯ Are React and CSS Friends? #14

Then, I shared about styling sites with React, how React changes the way we write styles, and a mind model that makes sense for me to style my projects, including our site.

πŸ€• Battle Stories: Portals #16

Then finally, Thomas took up the last spot (15 mins before 9!) and shared a problem he encountered – communicating styles between page and iframe embedded modal.

All videos are courtesy of the worldclassly engineers.sg, we will never stop getting amazed.

🀞 Till next time

Our night snack was indian food at ABC, fun promised, our tables were tilted this time!

RK is a fun and friendly podium to share what we learn about React. The best way to participate is to speak at RK, share with us what is sparkling interesting to you. Hope to hear from you next month!

React updates of the month

βš›οΈ React 16.9 is out

  • more UNSAFE_ lifecycle methods
  • deprecated unheardof stuff
  • acync act() for testing
  • Performance Measurements with <React.Profiler>
  • need to wait longer for a combined release of concurrent mode + suspense for data fetching Β―\_(ツ)_/Β― i am not even surprised

πŸ›  New DevTools

My friend Nut doesn't like it because it no longer has the very reactive re-render component highlight. Although the "why my component rerenders" under profiler tab looks really shiok.

πŸ₯― Flow v0.106 Coming Soon: Changes to Object Spreads

  • the current model is based on an assumption that inexact object types do not specify own-ness, this makes properties from spread become optional because object spread at run time copies only own properties
  • the new model assumes inexact object types specify own-ness on specified properties, therefore following our intuition of object spread more closely
  • inexact objects may contain more properties that may overwrite existing properties in spread target
  • the new model will err, tell us what happens, and ask if we can make the spreaded object exact

I got involved with a twitter thread the other day. There was some voice saying Flow is dead. Flow is not dead my lovely people :) Flow is happily wedded with React. They live under the same household, and guess who gets to officially support React v16.9 Profiler first?