Articles

Articles cover a wide range of modern webdev topics including React, CSS Modules, and Webpack.

3 Tools to Make Web Development More Fun
3 dev tools that particularly boost my workflow and keep me happy about my work.
January 12th, 2018
5 React Component Toolkits
No need to write all your components from scratch - bootstrap your app quickly with one of these awesome UX toolkits.
July 14th, 2017
React with Any Backend
Use a modern JS frontend with any backend. Here's how. Works with anything: Python/Flask, Java/Spring, Ruby/Rails, PHP, you name it.
June 30th, 2017
Three Example React Stacks
React apps can be set up in many different ways - here are 3 that I like.
May 5th, 2017
Webpack 2 Loader Variations
There are a ridiculous number of ways to configure your loaders in Webpack 2.
March 17th, 2017
2 sample apps using create-react-app
Concrete examples showing create-react-app in action. Simple enough to aid in React education.
January 11th, 2017
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 8th, 2017
Build a tiny, unique, web app
Why you should build a tiny, unique app as part of the React learning process.
January 4th, 2017
Anatomy of a Static Site
Overview of the use, bundling, and deployment of static (serverless) sites.
November 17th, 2016
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 19th, 2016
create-react-app vs other starter projects
Is Facebook's create-react-app worth using? How does it compare to other starter projects?
September 4th, 2016
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 26th, 2016
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.
June 18th, 2016
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 30th, 2016
Instant Component Creation in Atom
Create a React component in under a second! No more typos!
May 13th, 2016
CSS Modules by Example
CSS Modules are super trendy and super useful. Learn how they work, visually, by example
April 27th, 2016
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 14th, 2016
What are CSS Modules? A visual introduction
CSS Modules are super trendy and super useful. Learn how they work, visually, with diagrams and examples.
April 1st, 2016
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.
March 20th, 2016
React AJAX Best Practices
Four good ways to use AJAX with React.
February 5th, 2016
AJAX/HTTP Library Comparison
There are many AJAX libraries out there - but fetch is the new standard.
February 4th, 2016
How AJAX works in React
Simple overview of how AJAX and React work together, with links to more details.
February 3rd, 2016
Top 5 Tutorials for Getting Started with React
The best react tutorial for you can be found in this list.
January 15th, 2016
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.
January 2nd, 2016
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 21st, 2015
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 20th, 2015
Webpack HMR Tutorial
The Webpack docs leave something to be desired when it comes to using Hot Module Replacement.
November 19th, 2015
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 14th, 2015
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 6th, 2015
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 5th, 2015
Do more in less time with Webpack HMR
Hot Module Replacement, or HMR, is an indispensable tool for increasing development efficiency.
November 4th, 2015
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 3rd, 2015
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.
November 2nd, 2015
Why 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 21st, 2015
Use aws-sdk with Webpack
Including the aws-sdk NPM module in your Webpack project can cause errors. Here's the fix.
October 19th, 2015
How Whitespace Works in JSX
Seeing less whitespace in your React component than you would expect? JSX removes some whitespace before outputting HTML.
October 3rd, 2015
How To Pass Events Between Components
Wondering how to set up your components to pass events between them? Wonder no more.
October 2nd, 2015
Event Bubbling
Knowing how event bubbling works in React can help you keep a clean separation between components.
September 20th, 2015
Webpack Watch in Vagrant/Docker
Wondering why 'webpack --watch' doesn't work inside your virtual machine? There's a simple solution.
August 27th, 2015
cat

JavaScript Stuff in Your Inbox

Get tips, lists and guides to help you learn complex web development topics.