#Javascript#React
React's rendering behavior can sometimes be surprising, especially when dealing with different data types. Recently, I was working on a filter component with multiple select/dropdown components, where I observed a behavior that I found interesting. The gist of it is so simple, yet it was not obvious to me.
#Javascript#React
While reviewing the code from my team, I always look for certain items and suggest changes. In the projects I have worked on, I have created documentation for coding standards, which I enforce throughout the codebase.
#React#Context
Which is the better way to solve prop drilling? Let us talk about it in this post by solving the same problem in three different ways.
#Javascript#Fundamentals
This post summarizes the `this` binding principles explained in the book this & Object Prototypes, by Kyle Simpson. It's one of the book in the series You Don't Know JS. If you want to learn more about javascript from the roots, I highly recommend you reading it.
#Design#CSS
Positioned layout differs from the OG Flow layout in CSS in the way that items can overlap with each other. It is set using the `position` property of CSS. The possible values for position are `relative`, `absolute`, `fixed`, and `sticky`.
#React#Chakra#NextJS
One of the frequently asked questions on chakra ui library discussions is, How do I use nextjs link with chakra ui button or chakra link?. In this post let us explore some common patterns to use nextjs link in ui libraries.
#React#Javascript#NextJS
Lodash is a utility package commonly used in Javascript development for carrying out simple to complex calculations with data structures. Lodash package has a lot of helper utilities which for the most part won't be used in common application. Let's see how to configure webpack to reduce the bundle size of lodash to pick only what is needed aka tree-shaking. Lets ship less Javascript to client by minimising lodash size in create react app and next js
#React#Javascript#Chakra
CSS is awesome, but it is the most time taking part for the JS devs. Chakra UI simplifies CSS for React components by converting CSS to Props which results in increased development time. In this post we will explore css-in-js in general and a simple introduction to chakra components
#React#Javascript
React hooks are heavily based on the Javascript Closures. To understand about the dependencies array we must know about Closures. We will explore closures in general and dive into React hooks world to know how the the closures effects hooks
#React#Javascript
Do you know about the order of hooks? Do you know how the useEffect hook is executed on component lifecycle phases - Mount, Unmount and Update? let us find the order of execution of useEffect hooks, once reading it you should feel confident on using it next time.
#React#Javascript
No! React components are not returning HTML & React is not magic! React is just plain Javascript Library for building powerful and interactive User Interfaces. In this post we will also see where React is being used.