WEBVTT

00:01.140 --> 00:05.430
In this section of the course, we're going to build a slightly different version of a product that

00:05.430 --> 00:10.090
we sell and this is a recurring monthly subscription for subscribing to a plant.

00:10.110 --> 00:14.220
So we're looking at the page that we're going to build in the section right now, and we're going to

00:14.490 --> 00:19.440
assume that people can buy a monthly subscription to our service that will get them three widgets for

00:19.440 --> 00:21.240
the price of two every month.

00:21.840 --> 00:26.040
Now it looks almost the same as the other form that we built in the previous section.

00:26.040 --> 00:38.010
So I can fill it out, say Diana, Princess Diana at Paradise Island, dot com, Diana Prince and the

00:38.370 --> 00:47.790
credit card number with an expiry date in the future and any three digit code for the CVC when I click

00:47.790 --> 00:51.830
pay twenty dollars a month, it doesn't just do a one time transaction.

00:51.840 --> 00:56.880
It actually subscribes the user to a stripe plan and we'll be going through that in detail.

00:57.270 --> 00:58.500
So I'll buy this.

00:58.930 --> 01:04.740
It does the same sort of client side validation we did last time and it takes us to a receipt page and

01:04.740 --> 01:06.600
I just made it a very simple receipt page.

01:06.600 --> 01:08.880
And of course, you can do whatever you want as you build this.

01:09.270 --> 01:14.370
And if I go over to Stripe and look at my customer list with test data and refresh this page.

01:15.340 --> 01:21.160
I see that Diana at Paradise Island has bought something and away we go so that that succeeded.

01:22.120 --> 01:27.210
Now one of the things to be aware of is the way that we build this page subscription.

01:27.580 --> 01:32.350
And it's actually considerably different than the way we did the one time purchase in the previous section,

01:32.350 --> 01:36.390
because this time almost all of the logic is on the back end.

01:36.400 --> 01:40.780
So our front end application serves services web page and it serves us nothing else.

01:40.790 --> 01:46.120
Basically, it serves us this page and a few little tiny bits of information that we're sharing with

01:46.120 --> 01:47.080
all of our templates.

01:47.530 --> 01:52.450
And it calls the back end, which is a totally different application listing on a different port.

01:52.780 --> 01:57.370
And of course, I'm doing it this way so that you can see both ways of handling this sort of thing.

01:57.610 --> 01:59.220
All right, let's get started.