Lesson Weekend

Note on Homework: Due to the Monday holiday, you have slightly more homework than usual this weekend. Make sure to plan ahead, and read through each lesson carefully. But don't worry about memorizing any of the concepts; simply begin to familiarize yourself with the basics of TypeScript and Angular. We'll spend Tuesday revisiting and reviewing these materials, as we follow along to create our own TypeScript and Angular To Do Lists.

In this section, we will learn how to build basic AngularJS apps using the Angular 2 framework!

First, we'll learn a special flavor of Javascript called TypeScript. TypeScript is a superset of JavaScript. It provides extra tools and syntax for class declarations and data types. This makes code more maintainable.

Then, we'll learn about a type of framework architecture called client-side MVCs. This will provide some context about Angular, and how it works.

Next, we’ll begin creating Angular 2 applications. We’ll start by setting up a basic Angular app from scratch, exploring each individual piece as we go.

Then, we’ll learn how to add content and interactivity to our Angular sites. First, we'll display data dynamically using templates and directives. We'll also add models to organize data, and event-bindings to add interactivity. (Angular has cool tricks for adding loops, conditionals and listeners without jQuery)! We'll also explore how nested components can better organize our applications, and how pipes can filter data in real-time.

By the end of the week, you'll be able to create fully-functional sites in Angular. Next week we’ll explore the framework further by creating multi-page applications using routers, saving information into a databases, and much more.

Independent Project Objectives

This week’s independent project will be evaluated for the following objectives:

  • Application works as expected.
  • Application uses a model to organize data.
  • Components are used to create display and behavior for your templates.
  • TypeScript is used throughout application; including defined data types.
  • Users can create and edit instances of a model.
  • Models can be filtered using a pipe.
  • Edit/update form supports two-way data binding
  • Dependencies are managed with npm and Bower.
  • Application includes a gulp-based asset pipeline with a development server, and all necessary build tasks.
  • Project demonstrates understanding of week's concepts. If prompted, you are able to discuss your code with an instructor using correct terminology.
  • Project is in a polished, portfolio-quality state.
  • Required functionality was in place by the Friday deadline.