How do you toggle a component's visibility without losing its UI space?
•Simple implementation of a Visible component that enables you to toggle the visibility of any component.
Andrei Calazans
I am a Software Engineer, these are my notes and thoughts
about Software Development.
Why you should do “The Missing Semester” by MIT
•Have you heard of “The Missing Semester” course provided by a team of instructors at MIT? They promise to go over a set of tools which can help you become a more proficient software engineer.
How to override a Node.js module with React Native's Metro config
•Today I learned how to easily override an imported module with Metro
Why :443 is postfixed in https request domains?
•Today I learned why the :443 postfix on https domains are used
A Retriable Suspense Wrapper
•What if we placed React's Suspense retry logic at the same level as its error boundaries?
Git diff file filtering
•Today I learned how to filter files when doing git diff
How do you change the base of a branch in Git?
•Today I learned git rebase --onto
How do you cache FlatList.renderItem? Is the below FlatList.renderItem properly cached?
•Let's take a look at caching FlatList's renderItem when it needs to pass down an ID to the on press of the list's item.
Why won't Fzf.vim's preview window syntax highlight
•Today I learned why Fzf.vim's preview window was not syntax highlighting.
Difference between node --inspect and --inspect-brk
•Today I learned what the difference between Node.js' --inspect and --inspect-brk is
Git worktree
•Today I learned Git worktree works
The currentColor keyword in CSS
•Today I learned what the currentColor keyword does in CSS
How do you type a higher order function in TypeScript?
•The problem, solution, and story behind me figuring this out. Expect to learn TypeScript's generics, function types, Parameters and ReturnType utility, and inference if you pay attention to ReturnPromiseType
A GridView for React Native
•A GridView is a component that can render a list of items and group the items by the crossAxisCount.
Sharing environment variables using Github Action secrets
•I spent a few hours trying to figure out how to consume a Github secret within a Dockerfile, this post shows you how to do it.
Hiring, Vetting, TripleByte, Interviewing.io, and Comments.
•This is a comment type post where I highlight TripleByte's pivot towards a job search platform and Aline Lerner's post on why hiring is broken.
A Guide To Managing Tech Teams
•Video notes and comments on Dave Fariley's Youtube video on this subject.
Do you know what Taiko is?
•Taiko define itself as a "Reliable Browser Automation". This post goes over in detail what Taiko is plus shows you the result of integrating it into a project.
Test Driven Learning
•When programming it is ideal to always optimize for faster iterations, but what about learning?
Questions To Ask Your Engineering
•What are some questions every engineering department should try to answer?
Public Open Source Apps To Learn From
•I have been compiling a list of open source apps that I find online. This is a very helpful list for you to learn common patterns used in React Apps.
When Should You Use Next.js getServerSideProps?
•This was a recent doubt that I had, and when I researched the answer I noticed that many are making a mistake when it comes to this.
Flexible Versus Rigid Software Systems
•I decided I wanted to write about flexible versus rigid systems because I observed a pattern emerge over and over in projects and open source libraries. While observing this pattern, I noticed how it impacted our perception of the codebase in the early and later days.
Personal Comments On Leland's Prediction
•Leland made a prediction about the popularity of React & React Native, and usage of strictly typed languages back in 2017. How did it pan out?
Leading Engineering Teams With Intrinsic Motivation
•Intrinsic motivation is when you engage in a behavior because you find it rewarding. Do you understand how you can use this to make healthy software engineering teams?
Documentation Oriented Programming
•How about a "Documentation Oriented Programming". You write a document as you work on the problem with the how/what/why. It could be: shared, referenced, and posted.
What Are The Use Cases For React Class Components?
•What are the use cases for React Class components today despite the existence of Function Components and Hooks?
Next.js - Handling Linkable Tabs
•Do you need to have tabs in your Next.js app and these tabs need to have links to them?
Code Comprehension Takes The Largerst Amount Of Time
•Code comprehension represents the largest amount of time spent with a codebase
Explicit Versus Implicit - The Cost Of Implicitness in Programming Comprehension
•For better developer experience always prefer an explicit pattern. Here is why.
Leveraging You.i Engine's Counterparts to Extend React Native You.i
•In this tutorial, I go over how to create a native module in C++ to extend the functionality of React Native You.i components by tapping into its counterparts
What are the 100 things you must do to accomplish what you want?
•This came up while I was thinking about my goals. To become a developer I came up with a plan that resulted in a simple list of actions I had to accomplish to achieve what I wanted.
Podcast Summary - React Native EU 2020 Conference Q&A Panel
•Highlights from the React Native Show Podcast with the presenters of the React Native EU 2020.
Hooks Were Not Made To Give State To Functions
•There is a misconception that hooks were created to simply give state to functions. This post goes over the reasons hooks were created and why you should know them.
Animating Button On Focus For 10ft Devices
•On 10ft devices visual feedback is required not only for presses but also for focus. The following is a simple implementation of such.
Keeping up with React Native
•React Native never stops evolving, everyday there are new libraries and new updates to React Native core. This post is an organic article that is periodically updated with the changes of React Native.
How to create a native view module with react-native-youi
•This post will walk you through the steps to create a Native View Module for react-native-youi library.
How To Avoid Learned Helplessness Syndrome?
•Are you always asking for help? Does the task at hand feel completely overwhelming and you don't know where to begin or what to do? You could be suffering of "learned helplessness".
Is this Reducer Unpure?
•Redux Reducer rule number one -- it shall not mutate. But, can this be considered a mutation?
Podcast Summary - Eli White on the princiciples of React Native and more.
•I pinpoint the parts I found interesting in this podcast where Eli White revists React Native's principles and more.
NPM & Yarn Private Package Registry Personal Mistakes
•While working on a client project, I ran into an issue with their private registry. I kept seeing the unauthorized error when I ran `yarn install`. It was a weird issue especially because I had all of the correct keys. After some investigation I found out I was using the wrong `_auth` value.
Don't Fall Into This React Bug
•React hooks introduced a new way to handle state, and it changed a specific mental model of what happens when we set state.
Using React Refs
•What many forget is how Functional components are not referenceable. How can we overcome this?
TV Apps — Handling Focus Styling In C++ For Performance Gains With React Native You.i
•When specifying the behavior of a data structure component, there are often two concerns that need to be dealt with: basic functionality and support for data integrity. A data structure component is often easier to use if these two concerns are divided as much as possible into separate sets of client functions.²
React — Separation of Concerns
•When specifying the behavior of a data structure component, there are often two concerns that need to be dealt with: basic functionality and support for data integrity. A data structure component is often easier to use if these two concerns are divided as much as possible into separate sets of client functions.²
Choosing between React Native and Flutter
•Which should we choose? The rise of Flutter brought doubt to the decisions for a new mobile project. This doubt did not exist back in 2016/17 when someone needed a cross-platform mobile solution. Back in 2016/17
React Native FlatList with Hooks
•React Native recently added support to React hooks. Here is an overview of how to use FlatList with it.
ReasonML, Flow, and TypeScript function inference
•Interesting how in ReasonML we don't need to worry much about types thanks to it's inference
Summary of React Conf Brazil - 2018
•The second year of the biggest conference of React in Latin America gathered big names of the Brazilian React scene. This is a summary of everything that happened.
Set up an automated StoryBook flow for React Native
•In this Medium Post, I explain how you can automate your StoryBook set up for React Native
Which component to use in React? (prior to hooks)
•React introduces a component model to compose your UI. There are a couple of ways of rendering a component/JSX. You can use these simples rules to determine which way to write your component.
React class components with ES6 and Class fields.
•With the advent of ES6 and Class fields we can now write shorter components and without the need of worrying with the this keyword bind.
Should you ditch React's class setState
•Should one stop using class setState for lack of understanding it.
React Class Fields and Arrow Functions the simple 101.
•Advantages of using class fields and Arrow functions
Relay is just getting better
•In a recent commit to Relay 1.2, it was added a third argument to refetchConnection, the refetchConnection is an API provided by the createPaginationContainer