Copy
Stay up to date with the latest news on React.
View this email in your browser

The React Newsletter

Hi <<First Name>>,
 
How TypeScript helps you build better React apps
What is TypeScript?

[TypeScript] is a strict syntactical superset of JavaScript and adds optional static typing to the language.

The definition is taken from Wikipedia.

The definition above condenses in one sentence what TypeScript is all about.

But let's have a look at what this actually means.

strict syntactical superset of JavaScript means that TypeScript expands the JavaScript programming language without altering the existing syntax.

TypeScript understands any JavaScript syntax, which means that we can use a combination of JavaScript and TypeScript in our project, making migrating a lot easier.

The second part of the definition states that TypeScript adds optional static typing to the language.

Static typing is the most important advantage of using TypeScript. We can add types to the functions and variables in our application.

Often, TypeScript can infer a variable's type by looking at the value we use to initialize it.


Read more
 
React Hooks I use everyday

In this post I will list out all the React Hooks I use in a daily basis for my projects.

Here are the list of them.

  1. useState.
  2. useRef.
  3. useEffect.
  4. useDispatch.
  5. useReducer.
  6. useSelector.

Read more
 
Fixing useContext with react-tracked
React's useState/useContext pairing is easy to use but its got performance issues. Let's look at Daishi Kato's react-tracked library and see if we can still use our existing context code, but make it more efficient by only updating components that depend on specific elements of the state tree.

Watch video
 
How to Build a Cloud-Hosted Vector Tiles Map Web App in React — Part III
In this section we’ll be look at deploying our application to a cloud web application hosting platform, so that it can be publicly accessible without having the overhead to setup a web server. There are a number of cloud solutions available that offer this service, the two examples I will provide here are Amazon AWS Elastic Beanstalk (EB) and Heroku. The former offers a free access tier for 12 months while the latter is entirely free.

Read more
 
7 Ways of Achieving Conditional Rendering in React

Choosing when to show a piece of your UI should be as easy as writing an IF statement. However, given the component-based nature of React, and the mixture of HTML and JavaScript known as JSX, that IF gets a little bit more complicated depending on where exactly we want to add it. Should we add it as part of our component’s code? Can we add an IF right in our HTML? Are there other options?

In this article, I’m going to be covering the 7 most common ways of achieving what is known as “conditional rendering” in React. This should give you an idea of what is possible to do and why.


Read more
 
A Walkthrough of migrating MaxRozen.com from Gatsby to Next.js

I've been super keen on Gatsby.js since about 2017. Back then, I re-wrote this blog from a clunky old Django site that required an AWS EC2 instance running 24/7 to Gatsby, and it was amazing.

Over time, I've come to notice that Gatsby's core doesn't actually do much, and each project needs a different set of plugins to do what you want, and every new project with Gatsby has completely different headaches, so you never actually get better at using it (as a casual user).


Read more
 
React video courses
Because I need to pay my bills 😉
 
Copyright © 2021 ABL - The Problem Solver, All rights reserved.


unsubscribe from this list    update subscription preferences 

Email Marketing Powered by Mailchimp