All Articles by Date

2017

May 5
Three Example React Stacks
React apps can be set up in many different ways - here are 3 that I like.
March 17
Webpack 2 Loader Variations
There are a ridiculous number of ways to configure your loaders in Webpack 2.
January 11
2 sample apps using create-react-app
Concrete examples showing create-react-app in action. Simple enough to aid in React education.
January 8
8 ideas for your first web app
Eight ideas for your first tiny but unique app. Build one of these simple apps to learn React.
January 4
Build a tiny, unique, web app
Why you should build a tiny, unique app as part of the React learning process.

2016

November 17
Anatomy of a Static Site
Overview of the use, bundling, and deployment of static (serverless) sites.
September 19
Webpack Loader Variations
There are multiple ways to specify Webpack loaders. If you haven't seen them all, reading Webpack configs may be confusing.
September 4
create-react-app vs other starter projects
Is Facebook's create-react-app worth using? How does it compare to other starter projects?
June 26
How to start a React project from scratch
What if you could understand every single piece of your project, from the ground up? It's possible - and starter projects are not the answer.
June 18
Should I use React Server-Side Rendering?
Decide whether or not to use server-side rendering in your project. There are strengths and drawbacks to consider.
May 30
Learn the JavaScript ecosystem one package at a time
Overwhelmed by all the available npm packages? Downloaded a starter project and it has too many moving pieces? Try a new strategy - one package at a time.
May 13
Instant Component Creation in Atom
Create a React component in under a second! No more typos!
April 27
CSS Modules by Example
CSS Modules are super trendy and super useful. Learn how they work, visually, by example.
April 14
What to use for React styling?
High level overview of all the tools available for styling React components, and how they fit together. Covers PostCSS, Sass, BEM, CSS Modules, Autoprefixer, cssnext, and more.
April 1
What are CSS Modules? A visual introduction.
CSS Modules are super trendy and super useful. Learn how they work, visually, with diagrams and examples.
March 20
Will Google find your React content?
Is Google crawling your React components? Use the Search Console to check if the Googlebot is rendering your pages as you expect. This is an important check to do if SEO is important to you.
February 5
React AJAX Best Practices
Four good ways to use AJAX with React.
February 4
AJAX/HTTP Library Comparison
There are many AJAX libraries out there - but fetch is the new standard.
February 3
How AJAX works in React
Simple overview of how AJAX and React work together, with links to more details.
January 15
Top 5 Tutorials for Getting Started with React
The best react tutorial for you can be found in this list.
January 2
What is React?
Thinking about learning React, but not sure what it is or if it will work for your particular project? Here's the actual description of what React is.

2015

December 6
Find your perfect React starter project
Find a React starter project / boilerplate that fits your needs perfectly. Use this tool to search and filter for the starter project that has everything you need and nothing you don't.
November 21
8 no-Flux strategies for React component communication
Sending data between React components can seem like a pain at first. Here are some simple strategies.
November 20
How to validate nested proptypes with React
Want to validate the inner properties of an object passed as a prop? I'll tell you how. (hint, DON'T use PropTypes.any or PropTypes.object)
November 19
Webpack HMR Tutorial
The Webpack docs leave something to be desired when it comes to using Hot Module Replacement.
November 14
Guide to JavaScript frontend package managers
Picking a JavaScript package manager can seem daunting at first - here are all the options and my recommendation.
November 6
3 Ways to Set Up Webpack with HMR
If you want to use Webpack's awesome hot module replacement (HMR) feature, there are exactly 3 ways to do it. I'll help you decide which approach makes sense for you.
November 5
Understanding Webpack HMR
When using HMR without understanding the basics, it can be difficult to figure out what's wrong when it doesn't work.
November 4
Do more in less time with Webpack HMR
Hot Module Replacement, or HMR, is an indispensable tool for increasing development efficiency.
November 3
Simple image gallery react component
Building an image gallery in react is really easy - build one in 70 lines, with a spinner that hides when the images have loaded.
November 2
Detect when images have finished loading with React
componentDidMount() tells you when your component is finished rendering - NOT when your images have finished loading. Learn the difference to update state when images load.
October 21
Why you need to use refs instead of IDs
Newcomers to React might not find refs to be intuitive, but they are important. Here's why you should never use an ID when you can use a ref.
October 19
Use aws-sdk with Webpack
Including the aws-sdk NPM module in your Webpack project can cause errors. Here's the fix.
October 3
How Whitespace Works in JSX
Seeing less whitespace in your React component than you would expect? JSX removes some whitespace before outputting HTML.
October 2
How To Pass Events Between Components
Wondering how to set up your components to pass events between them? Wonder no more.
September 20
Event Bubbling
Knowing how event bubbling works in React can help you keep a clean separation between components.
August 27
Webpack Watch in Vagrant/Docker
Wondering why 'webpack --watch' doesn't work inside your virtual machine? There's a simple solution.