1
00:00:00,810 --> 00:00:05,610
We've now got our API key all set up inside of our cluster and we have installed the stripe library

2
00:00:05,610 --> 00:00:07,440
into our payments project.

3
00:00:07,570 --> 00:00:12,090
And before we open up our root handler and make use of the stripe library itself we're going to first

4
00:00:12,090 --> 00:00:17,070
create a separate file that is going to be responsible for importing and instantiating a copy of the

5
00:00:17,070 --> 00:00:18,450
stripe library.

6
00:00:18,480 --> 00:00:21,270
Let me show you how to do that inside the SRT directory.

7
00:00:21,270 --> 00:00:25,130
I'll make a new file called stripe T.S. than inside of here.

8
00:00:25,140 --> 00:00:31,820
We're going to import stripe from stripe and we forward make use of this.

9
00:00:31,830 --> 00:00:33,420
This is really a class right here.

10
00:00:33,420 --> 00:00:37,560
And to make use of the stripe library we have to create an instance out of that class.

11
00:00:37,560 --> 00:00:41,460
The entire purpose of this file is to really just create an instance of this stripe library and then

12
00:00:41,490 --> 00:00:42,000
export it.

13
00:00:42,020 --> 00:00:45,360
So can be used in other locations inside of our project.

14
00:00:45,360 --> 00:00:54,990
So I'm going to do an export const stripe is new stripe and then to this object right here or the constructor

15
00:00:55,020 --> 00:00:57,600
we're going to provide two different arguments.

16
00:00:57,600 --> 00:01:01,950
The first argument is going to be our API key and you might recall we already wired that up.

17
00:01:01,950 --> 00:01:10,450
It should be accessible inside our project as process EMV dot stripe underscore key as usual typescript

18
00:01:10,450 --> 00:01:13,860
doesn't really believe that we have properly defined this environment variable.

19
00:01:13,870 --> 00:01:19,750
We're going to tell typescript don't sweat it and put the exclamation on their then as a second argument

20
00:01:19,780 --> 00:01:23,050
we're going to provide an options object inside this object.

21
00:01:23,050 --> 00:01:28,300
We're going to enter an API version when you start to enter a string for the API version.

22
00:01:28,330 --> 00:01:33,520
You might get some autocomplete pop up if you get autocomplete and you see a date different than mine

23
00:01:33,580 --> 00:01:35,130
then go ahead and use it.

24
00:01:35,200 --> 00:01:39,430
Otherwise if you do not see any autocomplete at all then use exactly what I'm using right here which

25
00:01:39,430 --> 00:01:43,840
is 20 20 0 3 0 2 OK.

26
00:01:43,870 --> 00:01:48,190
So we've now got a single file that's going to import stripe create an instance of this library and

27
00:01:48,190 --> 00:01:53,050
make it available to the rest of our project so we can take this back over to our root handler import

28
00:01:53,050 --> 00:01:59,540
the stripe instance and use it to charge a user's credit card back inside my roots directory I'll find

29
00:01:59,560 --> 00:02:10,700
the new test file and at the very top I will add in m import or stripe from up one directory

30
00:02:15,160 --> 00:02:15,400
All right.

31
00:02:15,430 --> 00:02:20,070
Now the question is how do we actually charge users credit card using the stripe library.

32
00:02:20,080 --> 00:02:24,670
Well I pulled up some documentation so we can take a look at it and get a better idea of how we actually

33
00:02:24,670 --> 00:02:30,620
take some token that is going to be incoming to our right handler in charge some money with it if you

34
00:02:30,620 --> 00:02:35,390
want to follow log you can navigate to the official stripe documentation at Starbucks com slash Doc

35
00:02:35,390 --> 00:02:41,070
slash API once here on the left hand side we're going to scroll down a little bit and find a section

36
00:02:41,070 --> 00:02:47,280
called charges the charge once again this is how we actually charge the money to a user's credit card

37
00:02:48,640 --> 00:02:52,600
we want to find the section inside of here called Create a charge that's a we're trying to do right

38
00:02:52,600 --> 00:02:57,240
now you can see a code example over here on the right.

39
00:02:57,240 --> 00:03:02,020
So we've already made our instance of the stripe library and if we want to create a charge and Bill

40
00:03:02,020 --> 00:03:07,100
a user for some amount of money we're going to call stripe charges dot create and then we'll provide

41
00:03:07,130 --> 00:03:13,820
some options inside of an object there are technically only two options that are required or go into

42
00:03:13,830 --> 00:03:16,680
entry and possibly a third or fourth.

43
00:03:16,730 --> 00:03:21,900
The first two things that are required are in a Mount property and it's really important to note that

44
00:03:21,900 --> 00:03:24,710
the amount property is not going to be in units of dollars.

45
00:03:24,720 --> 00:03:31,110
Instead stripe works by the smallest currency unit as they refer to right here which in the U.S. currency

46
00:03:31,110 --> 00:03:34,170
system is sense not dollars does.

47
00:03:34,200 --> 00:03:36,330
We have been handling ticket prices throughout our app.

48
00:03:36,330 --> 00:03:40,230
We've always been treating those ticket prices as dollars and we just need to make sure that before

49
00:03:40,230 --> 00:03:46,000
we create a charge we convert that dollar value into cents which essentially means we just need to multiply

50
00:03:46,000 --> 00:03:47,910
it by 100.

51
00:03:48,070 --> 00:03:50,630
The second required option is a currency code.

52
00:03:50,890 --> 00:03:52,530
So me I'm working with U.S. dollars.

53
00:03:52,540 --> 00:03:57,720
I'm going to put it in a currency code of USD.

54
00:03:57,780 --> 00:04:03,030
Now there is technically another required property even though they really market as optional is the

55
00:04:03,090 --> 00:04:04,090
source property.

56
00:04:04,110 --> 00:04:07,310
So this is where we are going to be charging some money from.

57
00:04:07,380 --> 00:04:12,570
There are many different viable sources we can provide but one viable source to credit charge from is

58
00:04:12,600 --> 00:04:13,710
a token.

59
00:04:13,710 --> 00:04:18,030
And as I've said many times this token is going to be coming into our request and we can essentially

60
00:04:18,030 --> 00:04:21,150
view this token as kind of a pre authorization thing.

61
00:04:21,150 --> 00:04:25,410
Something that says Here is something that represents a credit card and we can bill it for some amount

62
00:04:25,410 --> 00:04:33,550
of money now optionally we can also provide a description property the description property is not really

63
00:04:33,610 --> 00:04:35,830
used for anything related to the charge itself.

64
00:04:35,830 --> 00:04:38,850
Instead it's just a little description to go along with the charge.

65
00:04:38,860 --> 00:04:43,240
It will show up on our street dashboard and possibly show it to users as well when they actually look

66
00:04:43,240 --> 00:04:45,140
at their credit card building statements.

67
00:04:45,160 --> 00:04:48,760
So if we wanted to we could definitely fill in a description as well but I'm not going to include it

68
00:04:50,220 --> 00:04:50,480
okay.

69
00:04:50,480 --> 00:04:54,530
So I thought that all in mind let's go back over to our Ed. We're going to make use of the striping

70
00:04:55,070 --> 00:04:58,160
rated charge and add in a couple of different options.

71
00:05:01,580 --> 00:05:06,200
I'm going to scroll down a little bit and right after we do our three checks right here I'll then do

72
00:05:06,200 --> 00:05:13,370
it in a weight stripe charges dot create will then provide those three different options.

73
00:05:13,370 --> 00:05:18,420
The first is currency which will be at USD.

74
00:05:18,430 --> 00:05:25,950
Next up is the amount of money that we want to charge which will be the amount as order dot price.

75
00:05:26,080 --> 00:05:28,070
Again that is a dollar value right there.

76
00:05:28,090 --> 00:05:32,950
So we need to convert it into sense by multiplying by one hundred.

77
00:05:33,110 --> 00:05:37,850
And then finally we also have to provide a source for this charge where the money is going to come from.

78
00:05:37,850 --> 00:05:41,470
And that's going to be the token that is incoming into our request handler.

79
00:05:41,540 --> 00:05:46,670
We've already D structured off that token property off the request body so we can just enter in token

80
00:05:46,760 --> 00:05:49,090
like so and I should be it.

81
00:05:49,110 --> 00:05:55,280
That should create a charge and build a user for some amount of money it's going to save this as is.

82
00:05:55,320 --> 00:06:01,080
But as you can guess well we probably want to somehow test this out and make sure it works as expected.

83
00:06:01,080 --> 00:06:02,090
Let's take a pause right here.

84
00:06:02,080 --> 00:06:02,490
Welcome back.

85
00:06:02,490 --> 00:06:07,440
Next video we're gonna figure out some way to manually test this and eventually write an automated test

86
00:06:07,470 --> 00:06:07,970
around it.