Five Minute React 01 - Installing Sublime Text | 23rd Apr 2020
If you're going to write web apps, make sure you have a great development environment

Five Minute React 02 - Configuring Sublime Text | 17th Apr 2018
Make your code easier to read, and find errors in real-time.

Five Minute React 03 - Installing Node | 17th Apr 2018
Complete instructions to get Node up and running on Mac or PC

Five Minute React 04 - Package Control | 17th Apr 2018
Managing and installing packages with NPM and Yarn

Five Minute React 06 - Installing MongoDB | 17th Apr 2018
It's very difficult to store data if you don't have a database installed!

Five Minute React 05 - Using Node Modules | 17th Apr 2018
We've added a 3rd party module, so let's write some code to use it!

Five Minute React 07 - Using MongoDB | 15th Jun 2018
A quick look at basic data manipulation in the MongoDB console

Five Minute React 08 - Version Control Part 1 | 17th Apr 2018
Let's get git installed and set up a repository in GitHub.

Five Minute React 09 - Version Control Part 2 | 17th Apr 2018
Now that git's installed and our repo's set up, let's commit something to it.

Five Minute React 10 - Installing Express | 17th Apr 2018
Our development environment's set. Let's get our web server up and running.

Five Minute React 11 - Intro to Express Part 1 | 17th Apr 2018
Let's take a quick look at the top-level files installed by Express-Generator and explain what's going on.

Five Minute React 12 - Intro to Express Part 2 | 17th Apr 2018
A look into the subfolders that express-generator installed, and a quick overview of routes and views.

Five Minute React 13 - Express Routing | 17th Apr 2018
If we're going to create an API, we'll need to understand HTTP requests and how Express handles them.

Five Minute React 14 - Express Cleanup and API Setup | 17th Apr 2018
Converting app.js to ES7, installing Nodemon, and getting our API directory ready.

Five Minute React 15 - Git Branching | 4th Apr 2019
As we get ready to start writing code, it's important to talk a bit about branch management in Git.

Five Minute React 16 - Data Modeling | 17th Apr 2018
We get started by installing Mongoose, and using it to create a User model.

Five Minute React 17 - Installing Passport | 17th Apr 2018
We need authentication, and Passport will help ensure that it's done, and done well.

Five Minute React 18 - Setting Up Testing | 17th Apr 2018
We talk about why JavaScript testing is useful, and get everything we'll need to get started installed.

Five Minute React 19 - Testing With Jest | 17th Apr 2018
Now that we have Jest installed, let's write a simple test ... one that's built to fail.

Five Minute React 20 - Testing an API Endpoint | 17th Apr 2018
Now that we have a failing test, let's make it pass by building out a simple API endpoint.

Five Minute React 21 - Working With ESLint | 17th Apr 2018
Now that we're starting to code, we need to make sure our work is consistent in error-free. ESLint will help.

Five Minute React 22 - ESLint From The Command Line | 17th Apr 2018
We don't have to use Sublime Text to find all of our linting errors. There's a faster, better way.

Five Minute React 23 - Installing React Necessities | 17th Apr 2018
It's time to get React installed. To do that, we'll also need Babel and Webpack. Let's do it!

Five Minute React 24 - Setting Up Webpack | 17th Apr 2018
We've got Webpack installed, now let's tackle the basics and make it do our bidding!

Five Minute React 25 - Our First React Components | 17th Apr 2018
It's finally time to write some React code. Let's get started!

Five Minute React 26 - Using Props In React | 17th Apr 2018
Props are a key part of how React does its thing. Let's get started by showing how they work.

Five Minute React 27 - Webpack Hot-Reloading Part 1 | 17th Apr 2018
Getting hot-reloading up and running in Webpack requires quite a few changes. Let's get started!

Five Minute React 28 - Webpack Hot-Reloading Part 2 | 17th Apr 2018
We make a few final changes to our configuration files, get hot-reloading up and running, and test it out.

Five Minute React 29 - React Folders and Template | 17th Apr 2018
It's time to get rid of our test component and start setting up our source directory for actual React app development.

Five Minute React 30 - Building Out Components | 17th Apr 2018
We start in on the components we'll need to get pages displaying, and intentionally make a few mistakes along the way.

Five Minute React 31 - React Routing | 17th Apr 2018
Client-side routing allows us to switch between React pages without a reload. Let's get it running.

Five Minute React 32 - Fixing Webpack | 17th Apr 2018
Introducing front-end routing inadvertently broke Webpack hot-reloading. Noooooo! Let's get that fixed.

Five Minute React 33 - DRYing Your Code | 17th Apr 2018
We cut down on code repetition while also creating a shared Sidebar component in React.

Five Minute React 34 - Adding Bootstrap | 17th Apr 2018
We learn about pulling CSS into our app via Webpack, and use Bootstrap to pretty things up.

Five Minute React 35 - Classes and State | 17th Apr 2018
A simple header change helps us learn more about React classes and component state

Five Minute React 36 - Building a Log In Page | 17th Apr 2018
Let's add a log in page, and pretty it up by creating a custom .scss file to add to our existing build.

Five Minute React 37 - API Endpoint: Registration | 17th Apr 2018
We use Passport to create an API endpoint for registering users, then test it out with Postman.

Five Minute React 38 - Log In and Log Out | 17th Apr 2018
Now that we can register users, let's create and test API endpoints to handle logging in and out.

Five Minute React 39 - A Basic Intro to Redux | 17th Apr 2018
Before we start using Redux to manage app state, let's talk about what it does, and how it does it.

Five Minute React 40 - Setting Up The Store | 17th Apr 2018
Now that we've got Redux installed, let's create our Store and attach it to our application.

Five Minute React 41 - Redux Actions | 17th Apr 2018
We've got a Store ... now we need some actions in order to manipulate the state data kept there.

Five Minute React 42 - Redux Tools | 17th Apr 2018
We've got actions talking to reducers. Wouldn't it be nice if we had some tools to track that?

Five Minute React 43 - Optimizing for Production Part 1 | 17th Apr 2018
It's time to start separating out tools and code we need for development from what we need for production.

Five Minute React 44 - Optimizing Part 2 | 17th Apr 2018
We finish up a quick detour into optimization by chopping our Webpack build in half ... again!

Five Minute React 45 - Wiring Up Log-In Part 1 | 17th Apr 2018
After a brief diversion, it's time to get started making our form actually log users in.

Five Minute React 46 - Wiring Up Log-In Part 2 | 17th Apr 2018
We continue attaching our log-in form to our API, and view the results of our efforts.

Five Minute React 47 - Wiring Up Log-In Part 3 | 17th Apr 2018
We create actions and reducers to wire our log-in form into Redux, and check to make sure they're working.

Five Minute React 48 - Displaying User Information | 17th Apr 2018
We can log in, now let's use that to display some information on our page. Bonus: adding a working spinner!

Five Minute React 49 - Intro to Component Lifecycle | 17th Apr 2018
We fix the bug where refreshing the page loses our user object, and talk about component lifecycle methods at the same time.

Five Minute React 50 - Logging Out | 17th Apr 2018
Our users need to be able to log out. Let's build a link that lets them do that!

Five Minute React 51 - Asynchronous Actions | 17th Apr 2018
It's time for some code refactoring. Let's get our API calls out of our components with async actions.

Five Minute React 52 - Refactoring Log-In | 17th Apr 2018
We've moved logging out from our component to our action file. Let's do the same for logging in.

Five Minute React 53 - Final Action Refactoring | 17th Apr 2018
We've got one more piece of code refactoring to do, and then we finish up with a new feature!

Five Minute React 54 - Building A Registration Page | 17th Apr 2018
We need new users to be able to sign up, so let's put together a registration page for them.

Five Minute React 55 - Sending to the Registration API | 17th Apr 2018
Our registration form is built, now let's wire it up with actions to talk to the API, and reducers to connect to the Store.

Five Minute React 56 - Registration Success Page | 17th Apr 2018
Alerting our users that a registration was successful seems like a good idea. Let's do it!

Five Minute React 57 - Error Handling | 17th Apr 2018
It's time to display errors to our users so they can dismiss them without reading them!

Five Minute React 58 - Front-End Validation | 17th Apr 2018
We've got forms for login and registration. Let's do our best to ensure the incoming data is what we want.

Five Minute React 59 - Back-End Validation | 17th Apr 2018
Allowing multiple users to register with the same email or username is bad. Let's NOT do that!

Five Minute React 60 - Reset Password Part 1 | 17th Apr 2018
Users forget their passwords, and also sometimes like to change them. Let's handle that.

Five Minute React 61 - Reset Password Part 2 | 17th Apr 2018
We're talking to our API, but our app is just sitting there showing no change to the user. Let's fix that!

Five Minute React 62 - Setting Up SMTP | 17th Apr 2018
We need to send emails to our users, so we're going to need an SMTP server. Let's get to it!

Five Minute React 63 - Securing Secrets | 17th Apr 2018
Let's get our API keys and other sensitive information out of our code, and out of version control.

Five Minute React 64 - Save Password Part 1 | 17th Apr 2018
We need a form so our users can input a new password. Let's build one!

Five Minute React 64.5 - Fix The Production Build | 17th Apr 2018
Here's an additional mini-tutorial that fixes a Webpack issue.

Five Minute React 65 - Save Password Part 2 | 17th Apr 2018
Now that we have a form for users to change their passwords, let's wire it up with actions and reducers.

Five Minute React 66 - Save Password Part 3 | 17th Apr 2018
We finish up saving passwords by giving the user some notice that, well, something happened!

Five Minute React 67 - Setting Up An External API | 17th Apr 2018
We're going to need music data to power our app. Fortunately, Discogs has us covered.

Five Minute React 68 - Search Albums | 17th Apr 2018
An API endpoint, actions, reducers, and a page for searching albums ... all in one tutorial!

Five Minute React 69 - Add Album Front-End | 17th Apr 2018
Now that we're listing albums, let's get started allowing them to add albums to their profiles!

Five Minute React 70 - Add Album Back-End | 17th Apr 2018
It sure would be nice if clicking the "add album" button did something. Let's make that a reality!

Five Minute React 71 - Saving Music Data Locally | 17th Apr 2018
We want to store albums and artists on our local DB as users add them to their lists. Let's do this!

Five Minute React 72 - Search and Add Artists | 17th Apr 2018
Let's put together the front-end and back-end for both searching and adding artists to user's profiles!

Five Minute React 73 - View a User's List | 17th Apr 2018
Let's get ambitious and put together all of the API code, actions, reducers, and components for list viewing.

Five Minute React 74 - Improving Music Lists | 17th Apr 2018
We have a basic listing page. Let's make it look good, and add some buttons for management.

Five Minute React 75 - Wire Up Remove Buttons | 17th Apr 2018
We have these fabulous "remove from my list" buttons ... let's make them do something!

Five Minute React 76 - Upgrade Node and React | 17th Apr 2018
We take a quick break from coding to get up to date with Node 8.9.1 and React 16.

Five Minute React 77 - Improving The Home Page | 17th Apr 2018
We wrap up principal coding on our React app by improving the home page and cleaning up some code.

Five Minute React 78 - Final Webpack Optimizations | 17th Apr 2018
Want to reduce your bundle size by 17x? Here's how we're going to do it!

Five Minute React 79 - Securing Express | 17th Apr 2018
We're getting ready to deploy to production, but we need to make sure our server's secure first!

Five Minute React 80 - Set Up a Server | 17th Apr 2018
We get a server set up for our app at Digital Ocean, complete with generating SSH keys for Mac and Windows.

Five Minute React 81 - Create a Superuser | 17th Apr 2018
We've got a server, let's create a user with admin powers so that we can start installing stuff!

Five Minute React 82 - Merging to Master | 17th Apr 2018
We're going to use Git to get our app onto our server, which means we need to merge our develop branch. Let's go!

Five Minute React 83 - Install Node and MongoDB | 17th Apr 2018
Our server is super bare, and needs all the basics up and running. Let's get Node and Mongo on there!

Five Minute React 84 - Secure MongoDB and Finalize | 17th Apr 2018
It's the final episode. Let's make sure our DB is secure, and then get this thing up and running!

Five Minute React - Wrapup | 17th Apr 2018
Just a short wrapup video now that Five Minute React is complete.