And how we stopped our React context from re-rendering everything

Diagram of the article’s main idea: update a sibling component’s state via a ref
Diagram of the article’s main idea: update a sibling component’s state via a ref
Photo by the author.

Refs are a seldom-used feature in React. If you’ve read the official React guide, they’re introduced as an “escape hatch” out of the typical React data flow with a warning to use them sparingly. They’re primarily billed as the correct way to access a component’s underlying DOM element.

But alongside the concept of Hooks, the React team introduced the useRef Hook, which extends this functionality:

useRef() is useful for more than the ref attribute. It’s handy for keeping any mutable value around similar to how you’d use instance fields in classes.” — React’s documentation

While I overlooked this point when the new Hook APIs launched, it proved to be surprisingly useful. …


Behind the scenes from Antler’s virtual Demo Day

Image for post
Image for post

As in-person events continue to be held online amid the ongoing Covid-19 pandemic, many events are finding new ways to connect with their audiences and deliver more personal, engaging experiences. It’s no different at Antler — we used to run physical Demo Day events to exhibit our portfolio companies, and now, we need to adapt the format for a decentralised, virtual audience.

I’ve previously written about our first virtual event while explaining why we chose Gatsby over Next.js to achieve excellent performance. Now we wanted to build on top of this foundation to deliver an even better live experience.

We launched this new platform for our virtual Demo Day Rewired event in Sydney. For the first time, viewers could have their questions answered live, we actively surfaced useful information about each startup as they presented, and we made it even easier to get in touch with each startup’s founders. …


Behind the scenes from Antler’s virtual Demo Day

Image for post
Image for post

As in-person events continue to be held online amid the ongoing Covid-19 pandemic, many events are finding new ways to connect with their audiences and deliver more personal, engaging experiences. It’s no different at Antler — we used to run physical Demo Day events to exhibit our portfolio companies, and now, we need to adapt the format for a decentralised, virtual audience.

I’ve previously written about our first virtual event while explaining why we chose Gatsby over Next.js to achieve excellent performance. Now we wanted to build on top of this foundation to deliver an even better live experience.

We launched this new platform for our virtual Demo Day Rewired event in Sydney. For the first time, viewers could have their questions answered live, we actively surfaced useful information about each startup as they presented, and we made it even easier to get in touch with each startup’s founders. …


I made the same web app in Gatsby and Next.js and found Gatsby performed better

Image for post
Image for post

With the ongoing Covid-19 pandemic and social distancing measures, many events have been forced to migrate to online virtual events. I’m a software engineer at Antler, which runs a global startup generator program that usually runs multiple in-person Demo Day events a year that showcase around a dozen new startups, and we faced the same situation.

We wanted to deliver a solid online experience that puts the focus on the content — our portfolio companies’ pitches. With the wider audience of this event and the fact that it may be a user’s first exposure to Antler’s online presence, we needed to put our best foot forward and ensure it loads fast. …


I made the same web app in Gatsby and Next.js and found Gatsby performed better

Image for post
Image for post

With the ongoing Covid-19 pandemic and social distancing measures, many events have been forced to migrate to online virtual events. I’m a software engineer at Antler, which runs a global startup generator program that usually runs multiple in-person Demo Day events a year that showcase around a dozen new startups, and we faced the same situation.

We wanted to deliver a solid online experience that puts the focus on the content — our portfolio companies’ pitches. With the wider audience of this event and the fact that it may be a user’s first exposure to Antler’s online presence, we needed to put our best foot forward and ensure it loads fast. …


A photo of me typing on a MacBook
A photo of me typing on a MacBook

Almost a year ago, I started my first proper job as a web developer at 2hats: a Sydney startup that connects work-ready university students to startups that need their talents.

Over the past few months, I’ve had the time to have a real reflection on this wild story — how exactly I got here, why I made the decisions I made, and what lessons I could learn going forward.

I landed on four key takeaways from this story and also hope they help other students who are just starting their careers.

🚀 Side projects take you far.

For any developer, a résumé is never enough to get hired. Since employers look for people who have experience (which many students don’t have), I used my side projects as a substitute for formal work experience to even get my foot in the door. …


Developing a passion, enduring an interview from hell, and finding an opportunity by luck

A photo of me typing on a MacBook
A photo of me typing on a MacBook

If you told my 11-year-old self as he was writing his first line of CSS that he would be starting his career as a web developer at 18, he wouldn’t believe you. While he was generally interested in computers and was planning on learning to code, he would be confused about how soon it all started.

But nearly a year later, while I am still quite surprised at the situation, I’ve been able to reflect on this journey and understand how I got here.

About

Sidney Alcantara

Front-end web engineer @AntlerEng working on 👉 firetable.io 👈 combining the simplicity of spreadsheets with the power of Firestore

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store