Scribd
Upload
26 views

Angular4 Toc

Uploaded by

ClickOnYou
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
26 views

Angular4 Toc

Uploaded by

ClickOnYou
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 9

LEARN WITH

ANGULAR, BOOTSTRAP, AND NODEJS

By Jeffry Houser
https://www.learn-with.com
https://www.jeffryhouser.com
https://www.dot-com-it.com

Copyright © 2017 by DotComIt, LLC


About the Author
Jeffry Houser is a technical entrepreneur that likes to share cool stuff with other
people.
In the days before business met the Internet, Jeffry obtained a Computer Science
degree. He has solved a problem or two in his programming career. In 1999, Jeffry
started DotComIt; a company specializing in custom application development.
During the Y2K era, Jeffry wrote three books for Osborne McGraw-Hill. He is a
member of the Apache Flex Project, and created Flextras; a library of Open Source
Flex Components. Jeffry has spoken all over the US. He has produced hundreds of
podcasts, written over 30 articles, and written a slew of blog posts.
In 2014, Jeffry created Life After Flex; an AngularJS training course for Flex
Developers. In 2016, Jeffry launched the Learn With series with books focusing on
using AngularJS with other technologies. Jeffry has worked with multiple clients
building AngularJS applications.
Table of Contents
Learn With Angular, Bootstrap, and NodeJS
About the Author
Preface
Introduction
What is this Book Series About?
Who Is This Book for?
How to Read This Book
Common Conventions
Caveats
Want More?
Chapter 1: The Application Overview and Setup
Introducing the Task Manager Application
Setup Your Environment
Prerequisites
Get the Project Seed
Understand the Project Seed
Create the Database
Create the NodeJS Application
Create a Web Server in NodeJS
Create a Request Router
Create a Response Handler
Create the Main Application File
Create the Application Skeleton
Start with a Basic HTML Page
Set up the SystemJS Config
Setup the Angular Module
Set up the Routes
Create the Login Component
Create the Tasks Component
Create the Routing Module
Put it all Together
Final Thoughts
Chapter 2: Login
Create the User Interface
Creating Value Objects
The Generic Return Object
Create a User Value Object
Examine the Database
Write the Services
Install MSSQL NodeJS Driver
Creating a DatabaseConnection Package
Creating JSON in NodeJS
Create the AuthenticationService
Test in a Browser
Access the Services
Hashing the Password with Angular
Create the Service
Implement the authenticate( ) method
Turn the Service into a Provider
Wire Up the UI
Creating a UserModel
Accessing Component Values from Within the View
Implementing the Reset Button
Implementing the Login Handler
Final Thoughts
Chapter 3: Displaying the Tasks
Create the User Interface
What Goes in the Grid?
Setup the Grid
Tell Angular how to find the Grid Component
Creating a TaskModel and Other Value Objects
Create a Grid Component
Create the DataGrid
Creating a TaskFilter Object
Examine the Database
Write the Services
Install a DateFormatter
Create the Task Service
Testing the getFilteredTasks() Service
Create the TaskService Stub
Turning the Object into a JSON String
Accessing the loadTask( ) Service
Wire Up the UI
Validate the User before Loading Data
Loading the Tasks
Final Thoughts
Chapter 4: Filtering the Tasks
Create the User Interface
What Data Do We Filter On?
Setup ng-bootstrap
Tell Angular how to find ng-bootstrap
Modify the TaskFilterVO
Create the TaskFilter component
Create the TaskFilter Template
Populating a Select with Angular
Adding a DateChooser
The Filter Button
Adding Styles
Examine the Database
Write the Service
Revisit the getFilteredTasks() Method
Loading Task Categories
Testing Task Categories
Access the Service
Wire Up the UI
Loading Task Categories
Triggering the Filter
Catching the filterRequest Event
Test the Filtering
Final Thoughts
Chapter 5: Creating and Editing Tasks
Create the User Interface
The Task Window
Create the Popup Component
Populate the Popup Template
Opening the New Task Window
Opening the Edit Task Window
Examine the Database
Write the Services
Modify the getFilteredTasks( ) method
Creating a New Task
Testing Task Creation
Updating a Task
Testing Task Updates
Access the Services
Wire Up the UI
Clicking the Save Button
Handle the updateTask( ) Result
Final Thoughts
Chapter 6: Scheduling Tasks
Create the User Interface
The Task Scheduler Window
Create the TaskScheduler component
Create the Scheduler Template
Modifying the Main Screen
Clicking the Expand Button
Adding the Schedule Button to the TaskGrid
Examine the Database
Write the Services
Revisit the getFilteredTasks( )
Scheduling a Single Task
Testing Scheduling a Single Task
Scheduling a Lot of Tasks
Testing Scheduling a Lot of Tasks
Access the Services
Use the scheduleTask( ) Service
Use the scheduleTaskList( ) Service
Wire Up the UI
Loading Tasks when Scheduler is Opened
Loading Tasks when the Scheduler Date Changes
Implement the Delete Task from Scheduler Button
Saving all Scheduled Tasks
Final Thoughts
Chapter 7: Marking a Task Completed
Create the User Interface
The Completed Checkbox
The Checkbox Implementation
Examine the Database
Creating the Service
The completeTask( ) Service Method
Testing the completeTask( ) service
Complete Tasks from Angular
Wire Up the UI
Final Thoughts
Chapter 8: Implementing User Roles
Review User Roles
Role Review
What UI Changes Are Needed?
Modify the UI
Modifying the UserModel
Disabling the Completed Checkbox
Removing the Show Scheduler Button
Removing the Edit Task Column
Final Thoughts
Afterword

You might also like