Q : Are you really excited to learn how to develop an n-Tier arch web application using Angularjs, Asp.Net Web API, jQuery, Bootstrap, C#.Net, Entity Framework Code First and MS SQL Server? A: Then you are at right place and you are going to learn it here with me from scratch.. In this course we are going to learn how to break requirements into objects and find relation among them. We will then learn coding models out of this objects and relationships. Moving forward we will also see how to design arch. of the project and implement various layers. We are going to learn implementation of business object layer using POCO and data access layer using repository design pattern and Entity Framework Code First. We will use C#.Net to implement our business logic layer and wrap it up with Asp.Net Web API so that it can be consumed by any client. We are also going to secure our web apis. For user interface we will see Angularjs, jQuery and Bootstrap. We will learn how bootstrap makes our application responsive.We will also see how to implement custom sorting and paging. Moving ahead you will learn forms validations and business rules validations as well. We will also learn how to publish it on web. This project is an EIS - Employee Information System This Web-based information system is designed to allow you to view and maintain your employee information throughout the year. You should use this system to maintain your complete information on employee record. This is an n-tier Single Page Application (SPA) built on .Net platform using various technologies for various layers as given below User Interface: AngularJS1 and BootStrap Service Layer: Asp.Net Web API Business Logic Layer: C#.Net Data Access Layer: Entity Framework Code First Back End: MS SQL Server 2016 Tools: Visual Studio 2015 and SQL Server Management Studio 2016 What are the requirements?(Should be good at) MS Sql Server Any version Entity Framework 6 Asp.Net Web APIs 2 C#.Net AngularJS Visual Studio 2015 or above What am I going to get from this course? understand how to break requirements in to objects create entities out of objects implement data access layer using entity framework code first approach with repository pattern manage data migrations in entity framework implement business logic layer using c#net create service layer using ASP.Net web apis create UI using angularjs, bootstrap and jquery implement validations both client side and server side implement authentication and authorization both on client side and sever side What is the target audience? This course is for the web developers who want to learn layered architecture in SPA Who wants to upgrade their profile with another real time SPA This course is for the web developers who want to learn layered architect.

2. Angularjs-WebApi2-
EFCodeFirst Web App On 3-
Tier Architecture
Mohd Manzoor Ahmed [MCT]
(10+yrs of Training Cum Web Development Experience)

3. What are we going to implement?
Let's see live here http://EIS.ManzoorTheTrainer.com

4. Enroll Here
At 50% OFF - Use Coupon Code as ‘HALF-OFF’

5. Employee Information System - User Story In
DetailNeed a web app which allows Admin to create a short profile of any employee with the
following information i.e., Emp Id and Email and as soon as the profile is created an
email should be generated and send to the employee with login credentials of the
portal. Employee should be able to login and update hisher full profile (except EmpId
and Email). The updated profile should reflect on Admin's dashboard.
Admin should also have an option to upload an excel sheet with multiple employees
information and multiple emails should be generated to the respective employees with
their login credentials.
Admin should also have right to full search and update or delete any record.

6. Defining the Roles & Responsibilities
● Admin
○ Can manage single or multiple employee profiles. (CRUD)
● Employee
○ Can viewupdate their own profile

7. Project Setup
1. Download Source Code
a. EIS
b. Dummy Data
2. Set Connection String
3. Set Gmail UserName And Password
4. Set Build The Project
5. Set StartUp Projects
6. Set API path in EIS.js

8. Design Project Arch.

9. Identifying the Objects
● Admin
○ Can manage single or multiple employee profiles. (CRUD)
● Employee
○ Can viewupdate their own profile
Objects
Employee (role, full profile)
Role

10. Identifying the Objects and Relationships
Object
● Role (A | U)
● Employee
Relationships
● Role : Employee (1 : M)

11. Enroll Here
At 50% OFF - Use Coupon Code as ‘HALF-OFF’

12. Models - BOL
Entity Framework Code First

13. Creating
Solution And
BOL
● Create Class Library → EIS.BOL
● Add Role.cs
● Add Employee.cs

14. Step -2 : Creating
DAL
● Create Class Library → EIS.DAL
● Add Entity Framework 6
● Add Ref Of BOL
● Add EISDBContext.cs
● Repository Pattern
○ Add RoleDb.cs

15. Step -3 : Test DAL
● Console App → EIS.ConsoleUI
● Add Connection String
● Add Ref Of BOL
● Add Ref Of DAL
● Add Ref Of EntityFramework dlls

16. Enroll Here
At 50% OFF - Use Coupon Code as ‘HALF-OFF’

17. Step -4 : Enabling
Code-First
Migration
Enable-Migrations (Install From Nuget
Console) in DAL
1. AutomaticMigrationsEnabled = true;
AutomaticMigrationDataLossAllowed =
true;
2. Database.SetInitializer(new
MigrateDatabaseToLatestVersion<EIS
DBContext,
EIS.DAL.Migrations.Configuration
>());

18. Step -5 :
Creating BLL
1. Create Class Library → EIS.BLL
2. Add Ref Of BOL
3. Add Ref Of DAL
4. Add RoleBs.cs
5. Add EmployeeBs.cs
6. Add Utility.cs
7. Test BLL with ConsoleUI

19. Step -6 :
Creating Web
APIs Project
1. Create Web API → EIS.API
2. Add Connection String
3. Add Ref Of BOL
4. Add Ref Of BLL
5. Add Ref Of EntityFramework dlls
6. Install CORS
7. RoleController

20. Design Project Arch.

21. Enroll Here
At 50% OFF - Use Coupon Code as ‘HALF-OFF’

22. Step -7 :
Creating Web
AngularJS UI
1. Create Web Project→ EIS.AngularJSUI
2. Add AngularJS.Core
3. Add AngularJS.Route
4. Add AngularJS.Cookies
5. Add AngularJS.Utils.Pagination
6. Add angular-loading-bar
7. Add bootstrap (bootswatch.com)

23. Creating
Directory
Structure
Create Directory Structure & Add files (html & js)
● EIS.html (Main page)
● Eis.js (Main js file)
● Views
○ Common
■ Home (html & js)
■ Login ( html & js )
■ RecoverPassword ( html & js )

24. Step -9 :
Creating Sidebar
Menu
● Get The style from
http://bootsnipp.com/snippets/featured/
navigation-sidebar-with-toggle
● Customize it as per our need and add it
in new style bootstrap.custom.css

25. Step -10 :
Creating Route
Mapping Views And Controllers
● Convert To AngularJS App
● EIS.html (Main page)
● Eis.js (Main js file)
● Views
○ Common
■ Home (Home.html & home.js)
■ Login ( html & js )

26. Step -11 :
Employee Mgmt
- Grid
● Get all employees in a grid
● Implement Paging
● Implement Sorting
● Implement Search

27. Enroll Here
At 50% OFF - Use Coupon Code as ‘HALF-OFF’

28. Step -12 :
Employee -
Create
● Create Employee Form
● Implement Insert Operation
● Success message alert

29. Step -13 :
Employee Mgmt
- Validation
● Client Side Validation
● Serve Side Validation

30. Step -14 :
Employee -
Delete
● Implementing Delete Employee

31. Step -15 :
Employee
Update - Panel
● Link Profile List To Details View
● Create Employee Update Tab Panel
● Autofill the employee details in the form

32. Employee
Update -
Validation
● Implementing Update Operation
● Client Side Validation
● Server Side Validation

33. Enroll Here
At 50% OFF - Use Coupon Code as ‘HALF-OFF’

34. Step -17 :
Employee
Update - Image
● Image Upload To Web API
● Read Image from Web API
● Display profile pic in sidebar

35. Step -18 :
Authentication
● Login Functionality
● Logout Functionality
● Display profile pic in sidebar
● API Key Authentication

36. Step -19 :
Authorization
● Role based custom authorization

37. Step -20 : Exception Handling
● Client Side - AngularJS
● Server Side - Asp.Net Web APIs
● Implementing global exception handling.

38. Enroll Here
At 50% OFF - Use Coupon Code as ‘HALF-OFF’

39. Step -20 :
Recover Password
● Implementing Recover Password

40. Step -21 :
Reminders
● Send Email On Create Employee
● Implement Reminders

41. Step -22 : Bulk
Upload - Employee
● Download Sample File
● Upload Excel
● Read Excel For Multiple Create

42. Step -23 :
URL - Rewriting
● $locationProvider.html5Mode(true);
● <base href="/">
● Remove “#/” from all URL
● <system.webServer>
● <rewrite/>
● Replace Cookies with ngStorage

43. Step -24 :
Loading Bar
● Add js
● Add css
● Add dependency

44. Enroll Here
At 50% OFF - Use Coupon Code as ‘HALF-OFF’

45. Step -25 :
Reports - Excel
● Converting JSON to excel file
● alasql.min.js
● xlsx.core.min.js
● Write an alasql query
● + https://github.com/agershun/alasql

46. Step -26 :
Reports - Charts

47. Enroll Here
At 50% OFF - Use Coupon Code as ‘HALF-OFF’

48. Thanks