Still Learning React Hooks

Check out these coding book discounts for Medium readers:

Follow me on Twitter 101K where I post all things JavaScript

Side Note: Always look through official docs first. In this article I cover my own experience with React Hooks. But I know someone on a similar path.

So why this tutorial then? Many hooks tutorials (including official docs) show syntax and how hooks work. But they don’t mention setbacks you’re 100% guaranteed to run into. You know, that moment when you start running into errors even though you are following documentation to a tee!

For example useState({}) hook doesn’t merge…


Things I want to accomplish in this Higher Order Function tutorial:

  1. Introduce newbies to the idea of Higher Order Function in JavaScript.
  2. (In a way that entertains, because HOs can get quite boring.)
  3. Show fun animations explaining how Higher Order functions work.

JavaScript Grammar book explains higher-order functions in detail and also shows you how they work by creating your own version of .map() method. (Among many other great examples.)

Array.map — map all values to an expression.

To kick off this tutorial I’ll start with animated example of higher-order function map. It modifies each item in the original array and returns a copy. In this case we’re…


Or you can just follow me on Twitter where I share more of my tutorials.

This is not a comprehensive study. Just key differences I found.

There may even be some mistakes I overlooked (let me know if you find.)

All diagrams were taken from my CSS Visual Dictionary book.

You can get it here bundled together with JavaScript Grammar.

Different Layout Models

Grid and flex follow different layout models.

Grid has column and row templates with assumed “ghost” items.

Flex is not designed to make grids. It is based around the idea of a flex line and direction. …


JavaScript Grammar contains the entire language walk-through from the stand point of a complete beginner gradual building in complexity.

CSS Visual Dictionary contains a color-coded diagram for every single CSS property in common use for visual speed-learners!


JavaScript Grammar contains the entire language walk-through from the stand point of a complete beginner gradual building in complexity.

CSS Visual Dictionary contains a color-coded diagram for every single CSS property in common use for visual speed-learners!


JavaScript Grammar contains the entire language walk-through from the stand point of a complete beginner gradual building in complexity.

CSS Visual Dictionary contains a color-coded diagram for every single CSS property in common use for visual speed-learners!


JavaScript Grammar contains the entire language walk-through from the stand point of a complete beginner gradual building in complexity.

CSS Visual Dictionary contains a color-coded diagram for every single CSS property in common use for visual speed-learners!


JavaScript Grammar contains the entire language walk-through from the stand point of a complete beginner gradual building in complexity.

CSS Visual Dictionary contains a color-coded diagram for every single CSS property in common use for visual speed-learners!


JavaScript Grammar contains the entire language walk-through from the stand point of a complete beginner gradual building in complexity.

CSS Visual Dictionary contains a color-coded diagram for every single CSS property in common use for visual speed-learners!


JavaScript Grammar contains the entire language walk-through from the stand point of a complete beginner gradual building in complexity.

CSS Visual Dictionary contains a color-coded diagram for every single CSS property in common use for visual speed-learners!

JavaScript Teacher

Issues. Every webdev has them. Published author of CSS Visual Dictionary https://amzn.to/2JMWQP3 few others…

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store