A short yet detailed guide to styling components with create-react-app with Sass and CSS Modules, which now is part of CRA. Up until the release of create-react-app v2, if you wanted to include Sass or CSS Modules in your project, you would have to eject from create-react-app, learn Webpack configurations, install Sass loaders and configure it […]
React OAuth Authentication with Firebase – Tutorial
Build a secure React app that provides takes advantage of Firebase simplicity to consume OAuth Authentication with GitHub, Twitter and Facebook. For an app to be secure, we usually need to implement some kind of authentication, whether it is the basic username/password combo or a two-factor authentication. In this post we’ll learn how to leverage […]
Learn Webpack for React
You know React, you know create-react-app, but now you want to learn Webpack to create your own configurations and run React. In this tutorial, we will see the basics of Webpack for React to get you started, including React Router, React Fast Refresh, Code Splitting by Route and Vendor, production configuration, and more.
How To Make create-react-app work with a Node Backend API
This is a very common question among newer React developers, and one question I had when I was starting out with React and Node. In this short example I will show you how to make create-react-app work with a Node Express Backend.
Profile Updater – A React App to Update Your Social Media Profiles: Twitter, GitHub & Facebook
If you are anything like me when it comes to keeping your social media profiles in sync, then you could benefit from this app. The purpose is to type your profile information once, and then send the updates to your profile in Twitter, GitHub & Facebook. Just to note, this project is still in development […]
Char, Word, Sentence and Paragraph Counter JavaScript and React
In one of my React projects I had to do a character counter for some text inputs, so I thought it would be fun to build a small project to count characters, words, sentences and paragraphs from a textbox in plain ol’ vanilla JavaSCript and also in React.
Uncaught ReferenceError: regeneratorRuntime is not defined – Two Solutions
Trying to use async/await in my React app gave me this error Uncaught ReferenceError: regeneratorRuntime is not defined. I found two solutions
Uncaught TypeError: Cannot assign to read only property ‘exports’ of object ‘# < Object >‘
This TypeError is thrown when import is combined with module.exports in a specific JavaScript file (module) and you are using Webpack 2.
React Starter Boilerplate with Hot Module Replacement and Webpack 3
This is a basic React boilerplate with React 16, Webpack 3 and Semantic UI React
Online Markdown Editor – GitHub Flavored
So I spent this past weekend creating an Online Markdown Editor. I used React.js…