1
00:00:01,060 --> 00:00:06,580
Right now we're showing a button to add a new blog posts but ideally we would instead have some kind

2
00:00:06,580 --> 00:00:11,740
of new screen called Create screen or something like that that will allow a user to create a blog post

3
00:00:11,740 --> 00:00:17,970
with a customized title this mockup right here also reflects a blog post having content as well.

4
00:00:17,980 --> 00:00:20,400
Right now we don't have any content around a blog post.

5
00:00:20,410 --> 00:00:22,360
We could very easily add that in.

6
00:00:22,710 --> 00:00:27,340
The other thing I want to point out is that the create option right here the create screen can be accessed

7
00:00:27,340 --> 00:00:31,240
by that little plus icon that should be displayed inside the header of the index screen.

8
00:00:32,110 --> 00:00:36,910
So let's first get started by creating a new component for our create screen and wiring it up to our

9
00:00:36,910 --> 00:00:45,110
stack navigator back inside my editor I'll find my screens directory and make a new file of create screen

10
00:00:45,170 --> 00:00:47,870
dot J.S. and then you guessed it.

11
00:00:47,870 --> 00:00:49,400
Let's do some boilerplate.

12
00:00:49,650 --> 00:00:53,840
It's all import and you add actually we don't have a lot of stuff going on in show screen.

13
00:00:53,870 --> 00:00:57,580
Let's just copy this thing over rather than write all that boilerplate out.

14
00:00:57,590 --> 00:01:02,750
Once again Sean's going to copy over everything from show screen to create just to save a little bit

15
00:01:02,750 --> 00:01:08,350
of time and I'm going to update the contents of this new function to just return

16
00:01:11,070 --> 00:01:22,170
a View with a text of create and we'll update the function name to create screen and the expert defaults

17
00:01:22,180 --> 00:01:25,430
as well to create screen now.

18
00:01:25,480 --> 00:01:27,530
Definitely saves a little bit of time.

19
00:01:27,550 --> 00:01:31,750
We'll leave on all this context stuff right now even though we're not presently using it because chances

20
00:01:31,750 --> 00:01:36,200
are we're going to need to make use of it in just a moment to actually create a blog post.

21
00:01:36,390 --> 00:01:37,800
Now we've created the screen.

22
00:01:37,840 --> 00:01:40,570
Let's go back to our app dot j ust file as usual.

23
00:01:40,570 --> 00:01:49,760
We're going to import create screen from source screens create screen and all wired up to our navigator

24
00:01:49,790 --> 00:01:56,710
object right here as create is create screen OK so not bad.

25
00:01:56,720 --> 00:02:00,680
So as usual we've now got the screen wired up but now we need to actually have some way to navigate

26
00:02:00,710 --> 00:02:05,500
over to it figuring out how to place this icon inside this header right here.

27
00:02:05,670 --> 00:02:07,410
It's give you just a little bit complicated.

28
00:02:07,490 --> 00:02:09,100
So let's first take another quick pause.

29
00:02:09,170 --> 00:02:13,250
Come back the next video and then discuss how to add content into the header.

30
00:02:13,250 --> 00:02:14,810
So I'll see you in just a minute.