Inverting Boolean functions
We can create a helper function that makes functions return their Boolean opposite. This can be useful in the shorthand syntax for array methods.
Read full articleFetching data asynchronously in useEffect
To asynchronously fetch data when a component mounts, define and then call an async function inside of a useEffect with an empty dependency array.
useEffect(() => {
const fetchData = async () => {
const data = await getData()
setData(data)
}
fetchData()
}, [])useEffect(() => {
const fetchData = async () => {
const data = await getData()
setData(data)
}
fetchData()
}, [])useEffect(() => {
const fetchData = async () => {
const data = await getData()
setData(data)
}
fetchData()
}, [])useEffect(() => {
const fetchData = async () => {
const data = await getData()
setData(data)
}
fetchData()
}, [])Continue reading
Namespacing styled-components
To improve the readability of React components, we can import the styled-components they use from another file under a ui-namespace.
Read full articleRussian Roulette
Add thrill and chaos to your code by adding a helper that only sometimes causes an infinite loop.
Read full articleGetting properties from objects that match a condition
Since array methods like filter and map return an array themselves, we can chain them one after the other.
Read full articleChecking if every array element matches a condition
There is now a more convenient way than reduce or loops to check if all elements in an array match a condition.
Read full articleImplicit return in arrow functions
If an arrow function immediately returns a value, we don’t have to write the return keyword. The function will still implicitly return that value.
Read full article