Build login page with angular material | Reactive Forms| Validation

hello my name is natural design let's create new angular project and the new demo would you like to add angular rocking back Y for yes and SS c SS no go to project CD mo now we will add angle of Metro is N and G at as a weight angle or less material yes you now type coat please stop it will open in be a sport Troodon and the project go to in common trauma No type and the serve does just talk on it will degli upon in from voucher No we are going to add natural boodles in a adding cat mat model you now adding matte bottom Buddha [Music] you now adding input model you we need to add reactive [Music] you now we need to add all models in import net that Moodle matte bottom Moodle matte input model and reactive form model we need to create lock in component moving promenade and close the program yes CD so let's see the app and and gg4 generates component log in its component and skip this is equal to true and future this is our login component now we need to update our accounting Moodle [Music] component children our children is login component component towing component now we need to operate our app open it HTML checked all and till it table class [Music] content body prompter outlet save it and go to in app component as CSS dot content body height is equal to 100% padding 60px 110 background color display come to block let's let it check out an browser and restart open it looks nice now we're need to play login from go to in login component yes in Port Adelaide and form we need to control and [Music] [Music] [Music] require and it was minimum length was six anyway now we need to add material icon model for material icon in port form you now we need to import here also [Music] Savage no we need to write CSS for login component you this requires ESS for lovin component save it now less great noggin calm Matt cut med card con gained TV class header as to login form and submit on login name is equal to log in form [Music] giving class email input mat form field you [Music] you met input required met Adam don't heroes don't require think we're given address now we'll wait for passport DB spend class a link for card passport [Music] form filled class to wait appearance of the line let the whole us out input or control limit to passport met [Music] input time to go to write passport that text require bottom lip icon bottom demand suffix click right click go to hide turn thought area add label right passport enter taught a place change Matt icon right updating of else busy editing fluid out of Patrick nzp logging all allocate out toward eros dot required the passport save it no create autumn bottle let flat bottom color is equal to primary pumpkin-shaped up project open the trauma no and this sort of fun this is the final output of the project into email address and here is a passport and if we saw Mitch require passport it will be ever pod if you type in an address and a passport it'll be gone error and if you click here passport be visible this is the final output if you like this video then subscribe cook with BJ thank you [Music]

Channel: CodeWithBijay

Views: 53,812

Keywords: login form reactive form, material Login page, angular, angular tutorial for beginners, learn angular angular material, angular material tutorial material design, design, login, reactive form angular 9, angular forms, reactive forms angular 9, angular 9 crash course, angular 9 tutorial, angular 9 tutorial for beginners angular authentication, angular material, angular material tutorial, web development, reactive forms, Angular form, angular reactive forms, material design

Id: Y17CTs09ZUQ

Length: 20min 25sec (1225 seconds)

Published: Sat Jul 11 2020