WEBVTT 00:00.120 --> 00:05.140 Hello everyone and welcome to the end of the coach project we've January's framework and future yes. 00:05.280 --> 00:09.180 First of all I want to congratulate you on making it this far into the course. 00:09.230 --> 00:14.460 We have surely discussed a lot of interesting topics in the previous sections and it's finally time 00:14.460 --> 00:21.830 to build a full fledged single page application in a real world scenario using both future yes and Django. 00:21.840 --> 00:23.100 With the rest framework. 00:23.160 --> 00:28.620 And specifically we are going to build a complete web application for a quarter like Web site that you 00:28.630 --> 00:35.550 are going to call Question Time what is of course a pretty popular question and as well Web site and 00:35.550 --> 00:42.000 so in our application Question Time once registered users will be able to post questions and receive 00:42.000 --> 00:48.660 answers on any topic they will be able to vote for the best answers added to each question using a like 00:48.660 --> 00:49.370 button. 00:49.530 --> 00:54.610 And there will also be able to edit or delete their questions or answers at any time. 00:54.610 --> 01:00.300 These end of course project is designed to allow you to experiment and significantly deepen all the 01:00.300 --> 01:04.830 knowledge acquired so far in a real world scenario. 01:04.830 --> 01:11.520 Learning to properly connect and rest api backend written with Django and depressed framework to a single 01:11.520 --> 01:14.080 page front end written with Viejo. 01:14.100 --> 01:20.220 Yes we will create the application backend first pass intent to the creation of the front end interface 01:20.310 --> 01:24.880 as soon as the backend part is completed by developing this project. 01:24.900 --> 01:29.480 You will learn how to use Django and Django this framework in combination with Abuja. 01:29.490 --> 01:32.460 Yes to build a real world projects. 01:32.460 --> 01:37.950 As I said to the project itself is designed to allow you to significantly deepen all the knowledge acquired 01:38.080 --> 01:39.180 so far. 01:39.180 --> 01:46.080 You will learn how to use of UCLA and view a router which are no doubt two of the most useful tools 01:46.140 --> 01:48.060 in their view ecosystem. 01:48.090 --> 01:51.700 You will learn how to build that single page applications weave if you J. 01:51.700 --> 01:58.950 Yes and of UCLA you will learn how to keep a wetbacks out model replacement working with UCLA and Django 01:58.980 --> 02:00.250 during development. 02:00.340 --> 02:04.620 And no worries if you've never heard about where but it's a pretty good advanced tool and you're going 02:04.620 --> 02:09.720 to learn about it in this section and you will learn how to use a session authentication in a Django 02:09.710 --> 02:15.330 this framework power where a single page application which is we've come to understand is the most appropriate 02:15.330 --> 02:18.400 authentication scheme for these kind of projects. 02:18.510 --> 02:24.060 And of course any ways our application will also support a token authentication so that you could write 02:24.060 --> 02:26.880 a mobile play client for it in case you need it too. 02:26.910 --> 02:31.820 So let's have a look at a project this is the authentication page for question time. 02:31.880 --> 02:35.210 As you can see it asks us for a user name and password. 02:35.270 --> 02:41.900 We have a logging button and a link to a page that allows us to create in your account visitor indication 02:41.900 --> 02:45.860 pages are the only ones that are rendered directly by Django. 02:45.920 --> 02:51.530 And that's because this is the default behavior provided by Django when he was in session authentication. 02:51.650 --> 02:58.170 Let's now look in one meal which is the name of the user log in. 02:58.850 --> 03:01.940 And now to this main page is loaded. 03:01.940 --> 03:07.710 From now on all the changes to the content of the page are going to up thanks to view. 03:07.760 --> 03:14.720 Yes javascript is going to be responsible for communicating with the rest EPA backend providing us all 03:14.720 --> 03:17.750 the different data that we need as we use the application. 03:17.750 --> 03:23.060 This is the on page of Question Time we see of course that we have a list of questions and for each 03:23.060 --> 03:25.940 one of them we can see how many answers have been added. 03:25.970 --> 03:32.270 We can see the user who posted the question and if we scroll down the page we see that we have a lot 03:32.300 --> 03:37.590 more button that we can click to get more questions from the database. 03:37.640 --> 03:38.780 On top of the page. 03:38.900 --> 03:44.380 We have a navigation bar with three battles on ask a question and log out. 03:44.450 --> 03:50.090 Of course my clicking on the name of a question the content of the page changes of course and we now 03:50.090 --> 03:53.980 see that we have the question details about the question itself. 03:54.200 --> 03:58.580 And at least we have all the answers that have been added to the specific question. 03:58.580 --> 04:05.390 We have a like button that we can click that as you can see terrorists read as soon as it's pressed 04:05.630 --> 04:07.410 and inside of this parenthesis. 04:07.490 --> 04:12.770 We also see that we have a counter with the number of lives that have been added and similarly to what 04:12.770 --> 04:13.930 happens on quarter. 04:14.090 --> 04:20.930 We can click d answered the question button to reveal a form that we can use to add a new answer as 04:20.930 --> 04:26.480 you can see the green button is now being replaced by you've written an answer because each user can 04:26.480 --> 04:29.690 add only one answer for each question. 04:29.720 --> 04:36.860 However as you can see we can both delete the new answer or just edited it we can add something like 04:38.140 --> 04:42.150 updated and if you now click on publish your answer. 04:42.240 --> 04:47.390 Once you of course that content has been updated then of course clicking on these nice red button on 04:47.390 --> 04:52.040 top we can ask a new question to the community such as for example. 04:52.040 --> 05:01.040 What is your favorite food in the world with a space like so publish in of course. 05:01.040 --> 05:06.800 A question has been published how we can now find it here on top of the list in the on page and of course 05:06.860 --> 05:13.100 if we want to go against it click on loads more to get more questions from the rest api backend. 05:13.110 --> 05:15.900 Let's now click on the logout button. 05:15.970 --> 05:17.640 The authentication page is shown. 05:17.660 --> 05:19.560 Let's now create in account. 05:19.610 --> 05:22.840 Let's choose a username something like Neil. 05:22.960 --> 05:27.110 So Neil at my mail dot com. 05:27.110 --> 05:29.160 Let's add a password. 05:31.400 --> 05:32.620 Create Account. 05:32.690 --> 05:37.090 We can now for example add a new answer to the same question we've asked before. 05:37.130 --> 05:40.730 So yeah for example I could say pizza. 05:40.790 --> 05:45.570 Submit your answer and of course it is published right away. 05:45.650 --> 05:48.490 I believe this is a really cool project to develop. 05:48.490 --> 05:54.200 We are going to learn about a lot of new advanced interesting concepts and of course as you can imagine 05:54.410 --> 05:56.410 we have a lot of code to write. 05:56.510 --> 05:58.490 So let's get started.