Transitions

A component is an indivisible, reusable parts of your code. We use them to better organize our ui, implement separation of concerns and avoid code duplication. But React also likes when we use them smart.

When something changes in your app and a re-rerender is triggered, that update doesn't...

React is a declarative component based UI library developed with the learn once write anywhere philosophy in mind. 

This definition suits react quite perfectly. Straight to the po...

If your component needs async data, you will either have to

• Implement some really rigid logic for each and every component
• Show incomplete UI
• Re-render all your UI when the data is ready

This is where

I just said that React doesn't immediately commit updates to the DOM because they are slow. Sometimes though, even in memory updates can be slow.  Traditionally, rendering is blocking. Once a render starts, it can't be stopped. This can delay a DOM update by too much making the experience choppy

When you learn to code, you are though procedural programing, which is a form of imperative programing. You are thought to tell the computer step by step what to do.

This works fine for a independent, pure function which doesn't care about anything else outside it's scope. But when doing UI...

When coding in a declarative style, you only need to define how you want your data to look and the computer will do it for you.

React gives us JSX and hooks for that. 

JSX brings HTML into JS. You just tell React how your UI should look, and he takes care of every 

React 18 will support some new awesome features that will help us overcome these issues.

1. Suspense
2. Transitions
3. Streaming HTML and Selective Hydration

React 18 brings huge improvements to server side rendering. Now when performing SSR we have to 

1. Wait for all the data to be fetched
2. Wait for the server to render the whole page
3. Display the rendered page
4. Wait for the whol...