1
00:00:00,650 --> 00:00:05,240
In the last section we did a quick walk through of how our user will flow through our application.

2
00:00:05,310 --> 00:00:09,930
Remember they're going to sign up with Google Earth give us some money create a campaign.

3
00:00:09,930 --> 00:00:15,810
That campaign will be sent out to all of their users their users will then click some link inside that

4
00:00:15,810 --> 00:00:21,500
email leave some feedback and then we will present that to the person who sent out the original survey.

5
00:00:21,780 --> 00:00:26,640
So I know that it might be already kind of confusing when I use the word user right now because we're

6
00:00:26,640 --> 00:00:32,400
talking about both the product owner and the users who use that product owner's application.

7
00:00:32,460 --> 00:00:37,500
But when we say user we might be referring to the product owner as opposed to that kind of sub user

8
00:00:38,100 --> 00:00:38,640
anyways.

9
00:00:38,670 --> 00:00:40,990
All this terminology is probably confusing right now.

10
00:00:41,010 --> 00:00:46,210
But don't worry over time it's going to become really clear as we start working on the actual app.

11
00:00:46,650 --> 00:00:49,600
So now we know how user will flow through the application.

12
00:00:49,620 --> 00:00:54,950
Let's talk about some of the different technologies we will use to pull this entire thing off.

13
00:00:55,050 --> 00:00:59,700
Now as we talk about these different technologies we're doing so just to give you a sense of some of

14
00:00:59,700 --> 00:01:03,410
the different tack that we're going to be getting through inside this course.

15
00:01:03,450 --> 00:01:08,190
This is not necessarily an exhaustive list and there really is a couple of other libraries that we're

16
00:01:08,190 --> 00:01:13,770
going to be using along the way but I want to give you a sense of what we're going to be doing and vaguely

17
00:01:13,770 --> 00:01:17,970
some what kind of the order in which which we're going to be doing it.

18
00:01:18,090 --> 00:01:22,950
We're not going to follow this order of steps right here exactly throughout the course but you know

19
00:01:22,950 --> 00:01:27,260
kind of it's going to give you an idea of how we might be putting things together.

20
00:01:27,840 --> 00:01:28,200
Okay.

21
00:01:28,230 --> 00:01:34,260
So first off is handling Google authentication for that we're going to be making use of an Express back

22
00:01:34,260 --> 00:01:41,510
in server and storing user information inside of Mongo DB to handle the actual authentication and awat

23
00:01:41,520 --> 00:01:42,170
process.

24
00:01:42,210 --> 00:01:45,980
We'll be using a third party library called passport yes.

25
00:01:46,290 --> 00:01:51,430
Passport G-S is going to make the Along side of things a lot easier for us to set up.

26
00:01:51,600 --> 00:01:56,770
Of course passport itself has its own set of challenges so you know we'll get through that in time.

27
00:01:56,970 --> 00:01:59,340
Next is handling payments.

28
00:01:59,520 --> 00:02:02,570
We're not going to be dealing with credit card numbers directly.

29
00:02:02,580 --> 00:02:05,760
We're not going to be taking credit cards into our application.

30
00:02:05,880 --> 00:02:10,920
Instead we're going to use a third party service called Strype for handling everything around billing

31
00:02:10,950 --> 00:02:12,760
and side of our application.

32
00:02:12,780 --> 00:02:17,730
Strype is somewhat like Passport him that it's somewhat easy to get started with but you also have to

33
00:02:17,730 --> 00:02:23,580
be aware of some real edge cases that make life just a little challenging especially when we're using

34
00:02:23,610 --> 00:02:24,960
react with stripe.

35
00:02:24,960 --> 00:02:28,720
Believe it or not so will be using stripe to handle payments.

36
00:02:28,740 --> 00:02:34,320
And then whenever a user pays up some amount of money will record that inside of our Mongo DB database

37
00:02:36,080 --> 00:02:39,740
next whenever a user attempts to create a new campaign or survey.

38
00:02:39,740 --> 00:02:45,940
However you want to refer to it we'll be making use of react and redux whenever the user starts entering

39
00:02:45,990 --> 00:02:49,370
the list of e-mails or some details about what they want to collect.

40
00:02:49,400 --> 00:02:55,280
As far as surveys or feedback we'll be making use of re-act redux and redux form.

41
00:02:55,280 --> 00:02:57,070
So again these two steps right here.

42
00:02:57,080 --> 00:03:01,640
It's really all about the front end of our application and that's where we're going to see a lot of

43
00:03:01,640 --> 00:03:09,200
work with react and redux form after we've collected all this information about this new campaign or

44
00:03:09,210 --> 00:03:14,080
survey to send out we will send out this list of e-mails to all the survey.

45
00:03:14,460 --> 00:03:18,180
For that we're going to be making use of a third party e-mail provider.

46
00:03:18,720 --> 00:03:23,760
This is still going to take a lot of integration on our site to put the e-mails together to send out

47
00:03:23,850 --> 00:03:28,800
and there's probably going to be the bulk of real complicated stuff inside this course around handling

48
00:03:28,800 --> 00:03:29,810
these e-mails.

49
00:03:29,980 --> 00:03:31,070
But that's going be a lot of fun.

50
00:03:31,080 --> 00:03:37,320
We're going to figure out really truthfully how to handle e-mails very well inside of our application.

51
00:03:37,320 --> 00:03:43,170
Now when a survey gets that actual e-mail requesting some amount of feedback we need to make sure that

52
00:03:43,170 --> 00:03:48,870
we somehow record the feedback that the user is given or presents to us for that we're going to be using

53
00:03:48,870 --> 00:03:57,000
a combination of the e-mail provider our Express back and the Mongo D-B database next to tabulate all

54
00:03:57,000 --> 00:03:58,770
the feedback that we're given.

55
00:03:58,770 --> 00:04:03,300
We're going to store all that data inside of Mongo D-B and whenever a user wants to see that feedback

56
00:04:03,540 --> 00:04:05,070
we're going to use Mago.

57
00:04:05,070 --> 00:04:09,000
Now put Mongo questionmark right here because you know we'll kind of figure this part out.

58
00:04:09,150 --> 00:04:12,310
There's a lot of different ways that we could handle tabulation of feedback.

59
00:04:12,420 --> 00:04:16,650
But we'll just kind of assume right now that we're going to be using Mongo D-B for it.

60
00:04:16,650 --> 00:04:22,830
Finally a user should be able to see a report of all their survey responses and for that yup we'll use

61
00:04:22,830 --> 00:04:23,470
Mongo.

62
00:04:23,490 --> 00:04:28,230
We're going to kind of pull out all the feedback that we've been given out of our database and then

63
00:04:28,230 --> 00:04:31,950
we'll present it to the user by using react and redux.

64
00:04:32,560 --> 00:04:33,320
OK.

65
00:04:33,990 --> 00:04:38,940
So that's essentially again the entire flow and how all these different technologies are going to fit

66
00:04:38,940 --> 00:04:39,560
in.

67
00:04:39,570 --> 00:04:41,480
Again this is not an exhaustive list.

68
00:04:41,490 --> 00:04:45,590
I just want to give you a taste or a sense of what we're doing at this point.

69
00:04:45,600 --> 00:04:51,120
I'm hoping that it's pretty clear exactly how a user is going to flow through our application and what

70
00:04:51,120 --> 00:04:53,330
the purpose of the application is.

71
00:04:53,520 --> 00:04:57,690
So if you're still confused at all about what we're trying to do with this app and what its purposes

72
00:04:58,050 --> 00:05:03,540
feel free to jump over to the Course discussion on you me and just ask me a question just say Hey Stephen

73
00:05:03,870 --> 00:05:05,520
I really don't understand what we're building here.

74
00:05:05,520 --> 00:05:07,820
Can you go into a little bit more detail.

75
00:05:08,280 --> 00:05:13,620
Now having said that we are going to look at some mockups of the front end aspects of this application

76
00:05:13,650 --> 00:05:14,700
and the next section.

77
00:05:14,730 --> 00:05:19,200
So if things are confusing you know maybe check out the markups and last section and then let me know

78
00:05:19,200 --> 00:05:20,200
what you think.

79
00:05:20,310 --> 00:05:21,330
So let's take a break.

80
00:05:21,330 --> 00:05:25,830
We're going to come back to the next section and start looking at some mockups of the front and side

81
00:05:25,860 --> 00:05:27,250
of our application.

82
00:05:27,270 --> 00:05:28,860
I'll see you in just a second.