So let's get started working on the front end and getting a form ready, and then we'll add the JavaScript
in the back in logic in order to allow people to buy a subscription.
So right now I'm looking at my handlers don't go file.
And this is the front end, of course, and this is the handler that will display the bronze plan page.
And last time we put an agent in there and let's make this a little more useful.
Let's go to our database.
And let's go to widgets and let's add a new item, so add new item by clicking the plus sign in my particular
client and I'll call this bronze plan and the description will be get three widgets for the price.
Of two every month, and I'll give it a really high inventory level and the price that will be twenty
dollars a month, which is 20 zero zero and will create it today.
So some date.
And it'll have no image.
OK, so there's a little bit more information we need to store in this database, and of course, that
would be if we go back to our Web browser and we look at our Stripe Products page and I'm looking at
my brons widget plan, I need to store the plan ID this right here in the database somehow.
So what I'm going to do is go back to my I.D. and I'll open my terminal and I'll stop my application,
which is running right now, and I'll generate a new migration.
So I'm in the correct directory at my the top level of my application folder and I'll say so to generate
fears and calls to widgets.
And I'm going to add two columns.
So I'll open the migration's folder and open my up migration.
And what we have here is I want to add a column.
So add underscore column.
I'm going to add it to the widgets table and I'm going to call it, first of all, is recurring and
that will be a boolean which actually gets translated to a tiny aren't on Maria DB in my school and
we'll give it a default
equal to zero.
Then I'll duplicate that row and I'll add another column called Plan Underscore ID.
And this is where that's actually four widgets, not applied widgets.
And here's what I call a priority plan.
Underscore ID and it will be a string.
And it's going to have a default of an empty string, and this is where I'll store the plan for any
recurring charge that I want to make.
OK, so now we'll go to the ad calls to widget down and just say drop column.
On widgets, Drub is recurring and duplicator and drop plan.
OK, so let's clear a screen so to migrate and there it is.
Now go back to my striped dashboard.
I'm going to copy this ID.
And go back to my database and refresh this screen, and now I have two new columns, so for my second
one, I need to I'm going to give it the is recurring value of one and I'll paste in the planet.
OK, now let's go back to our idea and open our models, because we'll have to add that information
to our models.
So that's under internal models, models go and find widget, and I will add right here is recurring,
which will be a boolean and in Jason our call that is recurring.
And then on the next line, I'll have plan ID, which is a string.
And in Jason, I'll call that plan, underscore ID, format this and hide my terminal and let's find
the get widget functionality, get widget.
So after image I will say is recurring and plan id and that with a comma and after image when I scan
the row will scan it into widget is recurring and widget planetree give it a comma.
OK, so now we have a way of getting information out of the database and doing something with it.
Now let's go back to our handlers or close these two migration's because I'm done with those.
Go back to my handlers and let's modify the way we're displaying information on the by a bronze plan
page.
So what I'm going to do, first of all, is to get the widget from the database.
I'm going to get rid of this map and then I'll say widget and potentially an error or assign the value
of Apter did not get widget and I'll get it by ID and I'll hardcoded because I'm going to use this only
for the bronze page and we'll check for an error.
If error is not equal to nil after error log dot print line the error and we'll just return, which
is sufficient for our purposes right now.
Now I'll create a data variable which will be a map make map string interface.
And I'll put the widget in their data widget.
Is equal to.
And I'll stroll up and we'll change this from an egg map to data, which will be there.
OK, so now when we run to the bronze page of the Bronze Plan page, we'll actually have the widget
information.
Now, if we go to the bronze plan page, at the moment, I just have this.
So I'm going to delete that entirely and leave an empty content there.
And instead, I will open up my by one page by one page, and I'll copy the entire contents of the content
div.
Or block and I'll paste in here and modify it as needed.
OK, so the very top, we're still getting our widget from the data variable that's available to us.
So I'll delete the image part because we're not going to display it, which I'm not going to bother
doing that and instead will say Brauns player, OK, and I'll put the price there too.
And I'll do that using format currency.
And it will be dollar sign widget price.
Now, what else do we need to change here?
I'm just going to put a dash temp after the formula because we're not actually going to call that you
earlier, probably.
And this is just a placeholder.
So that stays the same.
The Wichita State stays the same.
The price stays the same.
And here we have the price and the description, which is fine.
And first name, last name, email.
The only other change I'm going to make here right now is on the button where it says charge card.
I want to make it really clear to the user that they're actually paying monthly.
So I'll say pay format, currency, dollar sign widget price.
And close off those curly brackets and put a slash per month like that.
OK, so let's make sure our application is running.
It's not so I'll say make start, underscore back.
It's already running, so let's say it makes a stop.
They're making start underscore back.
And I'll just run here, and once that compiles, I should be able to go back to my Web browser, go
to my bronze plan page and hopefully see the form.
The credit card stuff won't work, of course, but I should at least see a form.
And there it is, so we have the bronze plan displayed twice, probably want to get rid of that one,
and the credit card is not being turned into a straight credit card because we haven't put any JavaScript
in there yet.
But this is a start.
So in the next lecture, we'll start working on the necessary JavaScript to turn this into a by subscription
to allow us to subscribe to a strike plan.
And we'll get started on that in the next election.