Complete Angular 7 Step By Step User CRUD with Java 8 REST, MongoDB 2019 Tutorial Step 8

Step 8 Resources: Blog http://pmkent.com/index.php/angular-6-java-rest-user-crud-application/ Source Code https://github.com/pmkent/angular-6-REST-userapp

Complete step-by-step Angular 7 front end User CRUD (Create, Read, Update, Update, Delete) utilizing JAVA REST back-end and MongoDB NoSQL database.

In this step of the tutorials we'll build the final Angular Material Design sign-up (register) screen using Angular Reactive Forms starting with a typescript component then the HTML form. This screen is similar to the Step 6 (edit-user) and Step 7 (add-user) screens so we are going to copy and re-use the code from the add-user screen. Then we'll change the code to make this screen one column based just to show you how you can do that if that's your requirement. We introduce the Angular Material Design toolbar component. As usual we start by building the add-user component typescript file before building the HTML form based on the component elements.

After the sing-user we'll begin wrapping up the front end Angular application by adding a header and a footer to the application that will affect all screens. We'll have two menus on one of the header tool bars that will give you menu list options to login, logout, change the entire application theme. Another header bars will display the user login status and give you a link to login or out. The footer toolbar will display the app name and the current year.

You'll get to see us struggle through the module's coding errors and successes using the Microsoft Visual Studio Code IDE tool.

A blog of this code can be found online at http://pmkent.com/index.php/angular-6-java-rest-user-crud-application/

For access to the source code please visit our GitHub source code site at https://github.com/pmkent/angular-6-REST-userapp

We couldn't have all the tutorial steps into one video so we split it into 11 steps. You can start from Step 1 to 11.

If you decide to build the back-end first start with Steps 9, 10 and 11 then return to Step 1 to build the Angular 7 front-end.

Front-End:
1. Install user (Angular 7 user CRUD) application | https://youtu.be/7qPwFlwKeqM
2. Install Angular Material, Material Icons | https://youtu.be/nBUTidmTPT0
3. Generate components, services, guard, utilities | https://youtu.be/LQ3AEZD1boI
4. Build sign-in page (Component, HTML form) | https://youtu.be/qlbdpmuzm1o
5. Build list-user page (Component, HTML form) | https://youtu.be/Po8Qe57Vi7c
6. Build edit-user (Component, HTML form) minus Date of Birth | https://youtu.be/PU5weWrp0eY
7. Build add-user page (Angular Material moment date, Component, HTML form) | https://youtu.be/sa9iA0LaSf8
8. Build sign-up, header, footer pages (Add theme and favicon) | https://youtu.be/TpuDhyBSs9M

Back-End:
9. Code backend Java web-app https://youtu.be/wKIt24ZJRKw
10. Code Java REST back-end, services, utilities, model | https://youtu.be/GOs8oOxJ_Dc
11. Implement REST searchUsers auto-complete

Hope tutorial helped you learn more about my new favorite coding language - Angular. Go ahead and hit that subscribe button if you haven't done so already or if you are new to this channel. We are going to be making more tutorials like this.

Could you follow the tutorial? Got questions, comments? We are always willing to listen and improve. Please comment!

Want me to make more videos on this topic? Please subscribe and like us!

See you next time ...