All language subtitles for 1. App Overview4

Well we wrapped up our ID cards application.

Now it's time to discuss the next applet that we're going to be working on in this next application

is going to be optional though you do not have to build this application if you don't want to.

Let me tell you why the next application we're going to work on is going to be very similar to the last

two that we worked on.

That's going to be really similar to the password generator that's going to be rather similar to the

card's application as well.

Now when I say similar I just mean to say that we're going to cover a lot of the same topics and angular

so we're not going to cover a lot of new stuff.

Instead the goal this application is to reinforce what we've learned so far.

In addition we're going to have a very different way of presentation of this application.

In other words the actual videos I'm making are going to be a little bit different as well.

In each video I'm going to lay out some series of steps that need to be done.

I'm going to say hey we need to generate our application or we need to create a new component or whatever

else.

I'll give you some general tips on what we need to do.

And then I'll end the video there and you'll have the opportunity to put that step together on your

own.

Well then come back together in the following video and we'll go over the solution to each of those

steps again on a percent optional.

If you are kind of bored or feel like you've already got a really good idea of how all this stuff we've

discussed so far works no problem.

You can just skip over this application go to the next one.

Otherwise stick around and let's discuss what we're going to be building.

All right.

So let's take a look at a mockup and understand what we're going to make.

We're gonna make a sort of typing challenge for the user.

This is going to be kind of like a little game when a user first starts up the application.

We're gonna show a little card that looks like this right here.

We're gonna say typing challenge at the top and then underneath that we're going to show some randomly

generated text.

This is some Lorem Epsom text in other words some Latin.

So the user is then going to click into this text and put right here that is a text input and they're

going to try to type out that exact random string as quickly as possible.

So in this case they would type out Lorem Epsom lower sit on that.

Like so once the user types everything out well then show them a success message and say Congratulations

you did it let alone sounds kind of boring.

So what's the real purpose of this app.

Well we're going to validate every character at the user types in we're going to make sure that the

user actually types in the correct sentence for example as a user starts to type in Lorem.

Right here we're going to take a look at the text that the user types in character by character.

We're going to make sure that it is an exact copy of the string as user types in the correct text.

Every character that they type in correctly will be recovered as Green never user ever makes a typo.

It's like let's say right after Lorem if I accidently typed k instead of I we will color the eye as

red to let the user know that they typed in something incorrectly.

If I then continued to type out incorrect stuff we would color each subsequent letter as red as well

like so that the user types out more stuff it's going to appear as red until they put the correct text

inside their though.

That's pretty much it.

That's the application as the user types everything out.

Yep.

We're going to eventually show the U Win message.

Look at this thing.

You can kind of see some similar elements to the last applications we worked on the civically say the

styling is similar.

We've got some content at the bottom that is going to be conditionally displayed.

So you win is only going to show up after user has entered in everything successfully.

We obviously have to do some styling as well.

We have to handle some text input and so on.

You get the idea.

So that's it.

Well let's take a pause right here.

If you want to work on this application come back in the next video and we're going to outline step

number one that you're going to go through.

Otherwise again if you don't want to go through all this earlier stuff again no problem.

Just keep on to the next application.

Either way I'll see you in just a minute.