1 00:00:00,470 --> 00:00:01,580 Congratulations. 2 00:00:01,580 --> 00:00:05,360 You have reached a very important milestone in the course. 3 00:00:06,080 --> 00:00:10,940 Today, you're going to try to code your first app independently. 4 00:00:12,240 --> 00:00:15,750 So you have all my respect for coming this far in the course. 5 00:00:15,750 --> 00:00:19,740 And let me tell you what this will consist of. 6 00:00:20,390 --> 00:00:26,140 So, so far, I have been showing you how to build real world programs. 7 00:00:26,150 --> 00:00:32,030 So I've been coding on my computer and you've been trying to do what I've done. 8 00:00:32,479 --> 00:00:39,710 Now I'll give you the project requirements, how the app looks like, how the app that you should build 9 00:00:39,710 --> 00:00:40,670 looks like. 10 00:00:41,800 --> 00:00:46,450 So without further ado, let me show you how the app looks like. 11 00:00:47,290 --> 00:00:50,210 So this is the app you should be building. 12 00:00:50,230 --> 00:00:52,260 This is a company website. 13 00:00:52,300 --> 00:00:56,800 Let's say we have Company X, Its name is the best company. 14 00:00:56,950 --> 00:01:01,120 And here we have some text description about the company. 15 00:01:01,330 --> 00:01:03,190 Then we have a header again. 16 00:01:03,190 --> 00:01:08,680 So a header, some text, a header, and then we have the team. 17 00:01:08,680 --> 00:01:13,840 So the the photos of all the team members and their names. 18 00:01:13,960 --> 00:01:20,230 So John Smith, for this member of the company and this is a role for John Smith. 19 00:01:20,710 --> 00:01:22,690 I'll give you all this data. 20 00:01:23,980 --> 00:01:28,690 So that's the final app and it also has a contact us form. 21 00:01:29,050 --> 00:01:34,550 But for today, all you have to build is this page. 22 00:01:34,570 --> 00:01:39,190 So tomorrow you're going to add a second page and that form. 23 00:01:39,610 --> 00:01:42,670 But today all you have to build is this page. 24 00:01:42,670 --> 00:01:44,260 So that's how it looks like. 25 00:01:44,470 --> 00:01:50,050 And that's normally what you see when you get some project requirements. 26 00:01:50,320 --> 00:01:55,300 Normally, you will not see the end product, but you will see some sketch as a developer. 27 00:01:55,300 --> 00:01:58,580 So you'll see that sketch and you'll start to build that. 28 00:01:58,600 --> 00:02:01,510 So in this case, I'm giving you some sort of sketch. 29 00:02:01,510 --> 00:02:03,130 You can see it on video. 30 00:02:03,970 --> 00:02:07,790 So you know what you should be building and I'll give you the delta now. 31 00:02:07,810 --> 00:02:09,789 So in the lecture resources. 32 00:02:11,250 --> 00:02:12,810 You will find. 33 00:02:13,840 --> 00:02:14,880 These delta. 34 00:02:14,980 --> 00:02:17,410 So let me explain you what these are. 35 00:02:18,070 --> 00:02:21,870 Delta that C is, V is a CSV file. 36 00:02:21,880 --> 00:02:25,840 If you open it in pie chart, you should see something like this. 37 00:02:27,540 --> 00:02:35,250 So we have the first name here, a comma last name role image that is the header of the data. 38 00:02:35,250 --> 00:02:38,040 And then we have John Smith. 39 00:02:38,040 --> 00:02:47,130 So John is the first name, Smith is the last name marketing manager corresponds to the role and one 40 00:02:47,130 --> 00:02:51,360 that PNG is the photo for John Smith. 41 00:02:51,630 --> 00:02:54,810 So then we have images, these are all the photos. 42 00:02:54,810 --> 00:02:59,670 So that's the photo for John Smith and then that's the photo for the second. 43 00:03:00,440 --> 00:03:07,690 A member of the company which corresponds to that second row in the Delta. 44 00:03:07,700 --> 00:03:10,310 So that would be Alberto Look. 45 00:03:10,760 --> 00:03:14,240 So those data should be rendered on the web page. 46 00:03:15,750 --> 00:03:23,160 And then we have these topics that see as we file, which is also a CSB file, it has this topic header, 47 00:03:23,160 --> 00:03:25,550 job inquiries, project proposal Other. 48 00:03:25,560 --> 00:03:30,870 This is a file that you will need in the next day so you can ignore this file for now. 49 00:03:30,870 --> 00:03:35,220 You can just keep it on your project folder, but you don't need it for today. 50 00:03:35,220 --> 00:03:36,870 You only need these two. 51 00:03:37,530 --> 00:03:44,220 So what you should do now is you should be creating a passion project. 52 00:03:44,220 --> 00:03:47,070 A new project puts those files. 53 00:03:48,190 --> 00:03:54,040 In that project and create a dot P file and start coding this web page. 54 00:03:54,700 --> 00:03:59,830 This is just some fake text, so just write something or find something from Google. 55 00:04:00,870 --> 00:04:06,890 And in the next video, you will see my solution to this first exercise. 56 00:04:06,900 --> 00:04:08,760 So how I built this page. 57 00:04:12,780 --> 00:04:18,839 But there's only one advice I want to give you in relation to how to create these apps, and that is 58 00:04:18,839 --> 00:04:20,579 start from scratch. 59 00:04:20,579 --> 00:04:24,180 So I know that my apps are similar to what you build. 60 00:04:24,210 --> 00:04:30,990 I know that the portfolio website is very similar to this, but don't copy my code, so don't copy the 61 00:04:30,990 --> 00:04:35,920 code from the previous projects and paste it on your passion project. 62 00:04:35,940 --> 00:04:37,950 Simply start from scratch. 63 00:04:37,950 --> 00:04:39,930 So type in the input statements. 64 00:04:39,930 --> 00:04:45,990 First, go to the next line, write whatever you need to write and if you get stuck, of course you 65 00:04:45,990 --> 00:04:48,470 can see my previous projects. 66 00:04:48,480 --> 00:04:55,800 You can look at the portfolio website code for reference, but you should always be typing in code because 67 00:04:55,800 --> 00:04:59,070 you are learning, so you should be used to the syntax. 68 00:04:59,080 --> 00:05:00,810 That's how you learn the language. 69 00:05:01,230 --> 00:05:06,780 With that, I thank you and I'll see you in the next video where I'll give you my solution to this feature, 70 00:05:06,780 --> 00:05:09,450 to the web page of this app for the day. 71 00:05:09,480 --> 00:05:10,060 See you there.