1
00:00:02,390 --> 00:00:04,260
So this is the stitch interface,

2
00:00:04,280 --> 00:00:09,170
you can always go back to the cluster screen by clicking on that back button here and on this page,

3
00:00:09,230 --> 00:00:11,560
you can manage the different features

4
00:00:11,600 --> 00:00:18,200
stitch offers. You have that getting started page which actually allows you to move through a couple of steps

5
00:00:18,200 --> 00:00:19,590
to quickly get started,

6
00:00:20,000 --> 00:00:24,470
I'll not move through them right now, at least not through all of them,

7
00:00:24,470 --> 00:00:27,360
let me instead explain what else we got here. Now

8
00:00:27,380 --> 00:00:32,210
the clients page here allows you to choose which kind of client you're using.

9
00:00:32,240 --> 00:00:35,860
Are you building a web app, then you would choose javascript and that is the case

10
00:00:35,870 --> 00:00:42,380
for us, we have a react app as a client, a single page app or if you're building a native mobile app with

11
00:00:42,620 --> 00:00:50,940
Java or swift, so Android or iOS, then you would use these tabs to see how to install mongodb stitch

12
00:00:51,050 --> 00:00:57,350
because you'll need an sdk installed locally to use the many stitch features from inside your client

13
00:00:57,590 --> 00:00:59,320
and all the steps are outlined here.

14
00:00:59,330 --> 00:01:00,520
We'll do this together in a second,

15
00:01:00,530 --> 00:01:01,810
no worries.

16
00:01:01,840 --> 00:01:03,990
Now we can export our configuration if we want,

17
00:01:04,160 --> 00:01:08,510
I'll not do that right now, under configuration for the Atlas cluster,

18
00:01:08,600 --> 00:01:13,610
this is something we can ignore here would allow us to connect to our stitch app differently,

19
00:01:13,610 --> 00:01:15,680
not something we'll do here.

20
00:01:15,740 --> 00:01:23,150
Rules will become important for accessing our data, that will become super important actually, triggers

21
00:01:23,150 --> 00:01:28,460
is what I mentioned on the slides where you can set up some listeners to database or authentication

22
00:01:28,460 --> 00:01:32,570
events and you can then execute functions, services

23
00:01:32,580 --> 00:01:40,590
are these services where you could integrate AWS S3 for example to suddenly add some functionality

24
00:01:40,590 --> 00:01:45,120
which stitch has not built-in but stitch gives you a bridge to other services,

25
00:01:45,210 --> 00:01:53,010
so also services of other companies, AWS is another company in the end. Users, here you can see users who

26
00:01:53,010 --> 00:01:58,230
signed up with your app and that authentication user management is all handled behind the scenes by

27
00:01:58,230 --> 00:01:58,850
stitch,

28
00:01:59,010 --> 00:02:02,990
so you don't need to worry about saving the passwords in a secure way,

29
00:02:03,030 --> 00:02:06,160
you don't even store them in your mongodb collection anymore,

30
00:02:06,210 --> 00:02:09,600
that will all be handled by stitch invisible to you

31
00:02:09,690 --> 00:02:15,240
and this is pretty awesome because it allows us to focus on our core business logic. Values,

32
00:02:15,260 --> 00:02:20,820
these are some static values which you could enter which you could then use in your well, rules and functions

33
00:02:20,820 --> 00:02:25,650
as it says here by accessing this special placeholder. Functions

34
00:02:25,750 --> 00:02:32,190
is then the part where you can create a new function to well define some javascript code that executes

35
00:02:32,190 --> 00:02:35,210
on demand on the server side as it says here.

36
00:02:35,640 --> 00:02:41,150
You can also view some logs for what happened in your stitch app and we'll see, well you can see that later

37
00:02:41,160 --> 00:02:45,430
once we got something to happen. Push notifications is also something I'll not cover here

38
00:02:45,480 --> 00:02:48,870
but you could add push notifications to mobile apps.

39
00:02:48,870 --> 00:02:50,760
So that is the rough overview,

40
00:02:50,760 --> 00:02:53,230
now let's get started by installing the stitch client

41
00:02:53,310 --> 00:02:59,250
therefore on clients browser, if you scroll down we'll use this solution. So we can copy this command

42
00:02:59,250 --> 00:02:59,670
here,

43
00:02:59,790 --> 00:03:05,910
we'll use npm nodes package manager to install another dependency and I will execute this here

44
00:03:05,940 --> 00:03:12,300
or actually in that terminal where I ran npm start, we can ignore these warnings by the way and just

45
00:03:12,300 --> 00:03:18,600
paste in that command you just copied and this will now install a new package, the javascript sdk for

46
00:03:18,600 --> 00:03:24,160
stitch which we need to interact with stitch from inside our browser side application.

47
00:03:24,540 --> 00:03:28,820
So this can take a few seconds until it's downloaded and installed and I'll be back

48
00:03:28,830 --> 00:03:36,710
once it's done. So now it is done and we can therefore restart npm start to bring up that react application

49
00:03:36,710 --> 00:03:37,480
again

50
00:03:37,550 --> 00:03:44,220
and now the important thing is that from now on, we'll be able to work without our backend filter,

51
00:03:44,240 --> 00:03:51,790
so without our node API here on the backend and that is of course pretty pretty awesome.

52
00:03:51,790 --> 00:03:57,770
Now that also means that now we can simply delete that folder,

53
00:03:57,770 --> 00:04:04,400
so now we got no backend and therefore our application will be broken now because well, if we try to log in

54
00:04:04,400 --> 00:04:09,800
and so on, that would not work because all the logic that is required for logging in is now not available

55
00:04:09,800 --> 00:04:16,250
anymore because I deleted the restful API which we used for that in the past but that won't be a problem

56
00:04:16,460 --> 00:04:18,410
because we'll use stitch now.

57
00:04:18,620 --> 00:04:21,840
And here you actually have a short snippet on how to use stitch,

58
00:04:22,010 --> 00:04:28,310
let's dive into using stitch in the next module and let's learn how we can use it to well interact with

59
00:04:28,310 --> 00:04:31,400
our database and fetch data and so on.