This course gets you up and running with react in under a minute by using codesandbox.io to skip the painful process of setting up your dev environment.

Chris Achard

React Crash Course with Hooks

In this course, we’ll create an online/offline note-taking app.  We’ll use `create-react-app` to create the frontend, and node.js to create a simple backend. 

Progressive Web Apps in React with create-react-app

We’ll build a mobile app with React Native for both iOS and Android. Prior React experience is required, but you don’t have to know mobile development to participate.

Build a React Native Application for iOS and Android from Start to Finish

In this collection, you'll create a simple game with React using Recoil, to explore how you can share and update state across an app.

Getting Started with Recoil in React

Chris Achard Landing Page

 Resources from Chris Achard in 2021

Python is a widely used dynamically typed programming language. It allows for many different programming paradigms including object-oriented, imperative, functional programming, and procedural styles.

python

There are numerous ways to set up a neural network, and it can be difficult to figure out what combination of settings and architectures will get the best results.  We’ll investigate a few different typical network topologies including adding more “depth” and “width”, and evaluate what network topology is best for our data set.  For example, you may want a very deep network for increased accuracy on very complex problems, but the training time will take longer.  Or, you may add width to your network to increase accuracy, but this has a risk of overfitting.

Testing Different Neural Network Topologies

We will view a summary of the different networks as we create them by using the `summary` method on the model.  This will help us better understand the structure of the model.

Understand the Structure of a Keras Model by Viewing the Model Summary

Once we choose a network topology and train that network, we will use it to make predictions on new data.  At this point, you can now use your network to make predictions on data in production!

Make Predictions on New Data with a Trained Keras Models

Instead of training the network every single time it is run, we’ll want to save the Keras model so that we can use it in the future.  Keras makes it easy to save both the model weights and topology to a single file, so we’ll do that here.

Save a Trained Keras Model Weights and Topology to a File

We will load a saved model from a file, and then use it to make predictions on new data.  We won’t need to know anything about the model to do this - we can do it all in a new file by loading a saved model.

Load and Use a Saved Keras Model

We’ll take a Keras network designed for continuous (linear) output, and convert it into a network for binary classification, which can divide data into two classes (for example: “dog” vs “cat”), and can be used for things like sentiment analysis ("positive" vs "negative").

Create a Neural Network for Two Category Classification with Keras

We’ll replace our set of sample data with data that we import from a CSV, by importing it as a numpy array using numpy's genfromtxt method.  Then we’ll use that data to train the binary classification model.

Import Data From a CSV to Use with a Keras Model Using NumPy’s genfromtxt Method

We will use the Keras model’s `predict` method to look at the predicted class value.  Then we will use the `predict_classes` method to have Keras make a class prediction for us, and return only a 0 or a 1, which represents the predicted class.

Make Binary Class Predictions with Keras Using predict and predict_classes

We’ll take a network set up for binary classification, and turn it into a network that can take 3 or more classes.  This network will let us go beyond classifying data into only two categories, and will allow us to expand to any number of categories (for example: “dog” vs “cat” vs “mouse”).  Then, we’ll use real data from a csv to train and test that network.

Create a Dense Neural Network for Multi Category Classification with Keras

We can specify several options on a network optimizer, like the learning rate and decay, so we’ll investigate what effect those have on training time and accuracy.  Each data sets may respond differently, so it’s important to try different optimizer settings to find one that properly trades off training time vs accuracy for your data.

Change the Learning Rate of the Adam Optimizer on a Keras Network

We’ll break our training up into multiple steps, and use different learning rates at each step.  This will allow the model to train more quickly at the beginning by taking larger steps, but we will reduce the learning rate in later steps, in order to more finely tune the model as it approaches an optimal solution.  If we just used a high learning rate during the entire training process, then the network may never converge on a good solution, and if we use a low learning rate for the entire process, then the network would take far too long to train.  Varying the learning rate gives us the best of both worlds (high accuracy, with a fast training time).

Change the Optimizer Learning Rate During Keras Model Training

As we get new data, we will want to re-train our old models with that new data.  We’ll look at how to load the existing model, and train it with new data, and then save the newly trained model.

Continue to Train an Already Trained Keras Model with New Data

In this course, we'll build three different neural networks with Keras, using Tensorflow for the backend.  Keras is a high level API for building neural networks, and makes it very easy to get started with only a few lines of code.

You don't need to know a bunch of math to take this course, and we won't spend a lot of time talking about complicated algorithms - instead, we'll get straight to building networks that you can use today.

By the end of this course, you will be able to build a neural network, train it on your data, and save the model for later use.  Then, you'll be able to load up your model, and use it to make predictions on new data!

Course Introduction: Fully Connected Neural Networks with Keras

Once we have built a multi-class classification network, we'll use it to make predictions on new data that wasn't used during training.  We'll start by calling the `predict` method, which returns the probability that each input data row belongs to each one of the possible classes.  Then, we'll use the `predict_classes` method to only output the class prediction as an integer, which might be easier to use in a production system.

Make Predictions on New Data with a Multi Category Classification Network

Node.js is a platform built on Chrome's JavaScript runtime for easily building fast, scalable network applications. Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient, perfect for data-intensive real-time applications that run across distributed devices.

node

We'll read a csv file in node.js both synchronously, and asynchronously.  The file we're reading is a plain text, utf8 file - but you can also use `fs.readFile` to read a binary file as a buffer.  We'll look at the differences between `readFile` and `readFileSync`, and show examples of how to catch errors if they occur.

Read a File in Node.js with fs.readFile and fs.readFileSync

React Native lets you build mobile apps using only JavaScript. It uses the same design as React, letting you compose a rich mobile UI from declarative components.

react-native

We’ll create a brand new React Native app, and get it to launch on the iOS simulator and Android emulator.  A Mac is required to build for iOS, but Android development can be done on Mac, Windows, or Linux.

Create a React Native App and Run it on the iOS Simulator and Android Emulator

Once your React Native app is up and running, we’ll make a simple change and reload the simulator to show the change.  We’ll look at manually reloading the simulator, reloading with Live Reload and reloading with Hot Reloading, and talk about the pros and cons of each method.

Reload the Simulator when Changes Occur in React Native Apps

Displaying text is a key component of mobile apps, so we’ll look at how to show text on the screen, and how it differs from text on the web.  We’ll also format the text style to change the size, alignment, and more.

Display and Format Text in a React Native Application

React Native uses Flexbox to layout most components, which makes it easy to run your app on devices of many different screen sizes.  We’ll learn the basics of Flexbox in React Native, and how to use it to build a flexible screen layout.  We’ll also look at some differences between flexbox on the web and on mobile.

Layout React Native Components with Flexbox

One way to style React Native components is with a `StyleSheet`, which was designed to be similar to css.  We’ll go over the differences between React Native styles and web styles, and we’ll create a new StyleSheet, and use it to change the style of components in our app.

Style Components in a React Native App with StyleSheet

In this lesson, we’ll accept user input for the first time with a text box.  We’ll operate the text input as a controlled component, and store the text value in our component state.  We’ll use that text input to perform a live search on the elements in the list.

Topics

Instructors

Content Type

Free or Pro