Learn Scikit-learn, Stripe and Tweenmax

### Accept payments & sell products powered by Stripe and the best of the JAMStack

There are as many ways to build an e-commerce store on the internet as there are products to sell. One thing is for certain, e-commerce is here to stay and as professional developers we need to understand how to build fully custom stores for our clients using the best modern tools available.

- React: flexible and customizable while following modern best practices
- Next.js: lightening fast with guide rails to help your project perform as consumers expect
- Stripe Checkout: lets you offload reams of complicated business logic to a trusted third party that maintains regulatory compliance, global payments, and a standard UX.

Your store will have well managed local component state using React Hooks and you'll also have clear and cohesive shared (global) state with React Context.

Finally you'll deploy your custom store to Vercel (the platform behind Next.js) as well as how to make your Next.js e-commerce store portable to deploy to other platforms.

React is one of the web’s most popular frameworks for building JavaScript applications. 

If you know what you’re doing, React can drastically simplify how you build, use, and maintain code.

Whether you’re a React newbie or you’re ready for advanced techniques, you can level-up with egghead. Explore our in-depth courses, lessons, and community resources to build more powerful applications and crack open your career.

react

Create an eCommerce Store with Next.js and Stripe Checkout

Artificial intelligence. Machine learning. Bots. Computers learning and communicating with us to do our bidding. But, where do you start? How do you get a machine to even begin to understand what you speak or type at it? There are several common machine learning algorithms that will help us begin to answer these questions.

In this course we’ll learn about common machine learning algorithms that don’t require implementing a neural network. We will not be going too much into the math behind them, but instead learn what each algorithm is good for, and how to train them. We'll also learn about a few metrics for evaluating models.

We’ll implement these in Python using `scikit-learn` using `scikit-learn`’s built-in data sets. The focus of this course is on implementation and a high-level understanding of these algorithms. 

We'll look at a few ways to evaluate our models, for both classification and regression models. We'll touch on mean squared error and coefficient of determination (for regression), and accuracy score, logarithmic loss, confusion matrices, and classification reports (for classification). 

Python 2.7 is used in the lesson videos but the code provided has Python 3 available. The only breaking change is the `print` statement API.

For additional information on installation, vocabulary, and common errors visit the `README.md` to the course code attached to each lesson.

Simple and efficient tools for data mining and data analysis

scikit-learn

Introductory Machine Learning Algorithms in Python with scikit-learn

Payments infrastructure for the internet.

stripe

Stripe has a variety of solutions that makes it super powerful as a payment provider. We're taking advantage of their Stripe Checkout product because it allows us to get started with an online store without having to manually accept payments.

To do this though, Stripe Checkout relies on the browser to make API requests, which we have to configure to work for our website.

We will set our eCommerce site domain on Stripe's CLIENT-ONLY integration to set us up to add the checkout workflow for our site.

Configure a Stripe Checkout Domain for Client-Only Integration

Next.js is a minimalistic framework for server-rendered React applications.

With Stripe or many other services, their APIs rely on special keys that authenticate requests or allow that service to track usage for things like billing.

Some of these keys are able to be used publicly and some must be kept private, but ultimately we want to have a way to easily manage these keys and not hard-code them into our application, which is where environment variables come in.

We will find our Stripe public key that will be used locally as well as in production on Vercel. You'll learn how to set an environment variable in Next.js (hint, you need to prepend `NEXT_PUBLIC` to the variable name make it available in the client) as well as in production on Vercel.

Add a Stripe API Key as an Environment Variable in Next.js & Vercel

Now that we have an app and our products configure in Stripe, it's time to connect the two and give people a way to purchase our products.

Using Stripe's API, we can initiate a new instance of the Stripe Checkout flow with a simple click of a button.

We'll create an `initiateCheckout` function that handles this flow for us. After loading stripe through `@stripe/stripe-js` we'll `await` a `stripePromise` that will allow us to redirect to stripes checkout flow. You'll notice that we will need to pass in line items with the price id and quantity.

Integrate Stripe Checkout to Purchase Products in Next.js with Stripe @stripe/stripe-js Cl

AngularJS is an open-source JavaScript framework, maintained by Google, that assists with running single-page applications. Its goal is to augment web-based applications with model–view–controller (MVC) capability, in an effort to make both development and testing easier.

angularjs

TimelineLite is a piece of the Greensock TweenMax library that provides the ability to create sequenced animation with very little code or setup.

Greensock TimelineLite Animation Sequences

[Greensock](http://www.greensock.com/tweenmax/) is a powerful animation library for JavaScript. It's also fully compatible with AngularJS. This lesson will get you started using Greensock with AngularJS to provide rich animations for your users.

Basic Animation with Greensock's TweenMax

React's use of the VirtualDOM can make it confusing on how to get actual elements to use in animation libraries like TweenMax. This video shows how to use this.getDOMNode() and this.refs and hook them in to TweenMax to satisfy all of your advanced animation needs.

Using TweenMax with React

Linear regression is a linear model that is used for regression problems, or problems where the goal is to predict a value on a continuous spectrum (as opposed to a discrete category).

We’ll use linear regression to estimate continuous values. In this case, we’ll predict house prices in Boston. We'll also look at how to visualize our results with matplotlib, and how to evaluate our models with different metrics for regression problems.

Use Linear Regression To Estimate Continuous Values with Python and Scikit-learn

Despite its often confusing name, logistic regression is a **linear** model that is used for **classification**, or estimating discrete values.

We'll use an inbuilt scikit-learn dataset of iris data to classify irises into three categories. We'll also look at metrics and tools to evaluate our classification models, including the accuracy score, classification report, and confusion matrix.

Predict Categories in Python using Scikit-learn's Logistic Regression module

We’ll continue with the iris dataset to implement support vector machines, which can be used to find more complex boundaries for classification or regression problems. 

More about Support Vector Machines can be found at [scikit-learn](http://scikit-learn.org/stable/modules/svm.html).

There are several types of kernel function that can be used with SVMs. Scikit-learn supports these kernels:

-linear

-polynomial ('poly')

-rbf (radial basis function) 

-sigmoid 

Custom kernels are also supported. `Rbf` is the default kernel type.

A good overview of kernels can be found [here](https://www.kdnuggets.com/2016/06/select-support-vector-machine-kernels.html), or at the [scikit-learn page](http://scikit-learn.org/stable/modules/svm.html#svm-kernels).

Use Support Vector Machines To Find Complex Decision Boundaries with Scikit-learn

We’ll continue with the iris dataset to implement k-nearest neighbors (`KNN`), which makes predictions about data based on similarity to other data instances. We'll visualize how the `KNN` algorithm works by making its predictions based on its neighbors' labels. We'll also examine the confusion matrix a bit further.

`KNN` can be used for both classification and regression problems. 

`KNN` is good for low dimensional data (data without too many input variables). It is not good for unbalanced data sets, and it can be computationally expensive.

Use K-nearest Neighbors To Find Similar Datapoints with Python and Scikit-learn

We’ll learn about decision trees, also known as CART (classification and regression trees), and use them to explore a dataset of breast cancer tumors. 

We'll also see how to visualize a decision tree using `graphviz`.

Implement Decision Trees in Python with Scikit-learn

We’ll return to the iris dataset to see how to use k-means clustering, an unsupervised learning algorithm, to create  categories for data that doesn't have labels. We'll also visualize these clusters using matplotlib.

More on K-means can be found at [Scikit-learn](http://scikit-learn.org/stable/modules/clustering.html#k-means).

Topics

Instructors

Content Type