Front-End JavaScript Frameworks: Angular
Description
When you enroll for courses through Coursera you get to choose for a paid plan or for a free plan .
- Free plan: No certicification and/or audit only. You will have access to all course materials except graded items.
- Paid plan: Commit to earning a Certificate—it's a trusted, shareable way to showcase your new skills.
About this course: This course concentrates mainly on Javascript based front-end frameworks, and in particular the Angular framework (Currently Ver. 4.x). This course will use Typescript for developing Angular application. Typescript features will be introduced in the context of Angular as part of the exercises. You will also get an introduction to the use of Angular Material and Angular Flex-Layout for responsive UI design. You will be introduced to various aspects of Angular including components, directives and services. You will learn about data binding, Angular router and its use for developing single-page applications. You will also learn about designing both template-driven forms …
Frequently asked questions
There are no frequently asked questions yet. If you have any more questions or need help, contact our customer service.
When you enroll for courses through Coursera you get to choose for a paid plan or for a free plan .
- Free plan: No certicification and/or audit only. You will have access to all course materials except graded items.
- Paid plan: Commit to earning a Certificate—it's a trusted, shareable way to showcase your new skills.
About this course: This course concentrates mainly on Javascript based front-end frameworks, and in particular the Angular framework (Currently Ver. 4.x). This course will use Typescript for developing Angular application. Typescript features will be introduced in the context of Angular as part of the exercises. You will also get an introduction to the use of Angular Material and Angular Flex-Layout for responsive UI design. You will be introduced to various aspects of Angular including components, directives and services. You will learn about data binding, Angular router and its use for developing single-page applications. You will also learn about designing both template-driven forms and reactive forms. A quick introduction to Observables, reactive programming and RxJS in the context of Angular is included. You will then learn about Angular support for client-server communication and the use of REST API on the server side. You will use Restangular for communicating with a server supporting the REST API. A quick tour through Angular animation support and Angular testing rounds off the course. You must have either completed the previous course in the specialization on Bootstrap 4, or have a working knowledge of front end web-UI frameworks to be able to navigate this course. Also a good working knowledge of JavaScript, especially ES 5 is strongly recommended. At the end of this course you will: - Be familiar with client-side Javascript frameworks and the Angular framework - Be able to implement single page applications in Angular - Be able to use various Angular features including directives, components and services - Be able to implement a functional front-end web application using Angular - Be able to use Angular Material and Angular Flex-Layout for designing responsive Angular applications - Be able to use Observables and RxJS in the context of Angular applications
Who is this class for: This course is aimed at students with sufficient knowledge of Web technologies like HTML, CSS and JavaScript. A good working knowledge of JavaScript, especially ES 5 is strongly recommended.
Created by: The Hong Kong University of Science and Technology-
Taught by: Jogesh K. Muppala, Associate Professor
Department of Computer Science and Engineering
Each course is like an interactive textbook, featuring pre-recorded videos, quizzes and projects.
Help from your peersConnect with thousands of other learners and debate ideas, discuss course material, and get help mastering concepts.
CertificatesEarn official recognition for your work, and share your success with friends, colleagues, and employers.
The Hong Kong University of Science and Technology HKUST - A dynamic, international research university, in relentless pursuit of excellence, leading the advance of science and technology, and educating the new generation of front-runners for Asia and the world.Syllabus
WEEK 1
Front-End JavaScript Frameworks Overview: Angular
In this module we get a quick introduction to front-end JavaScript frameworks, followed by an introduction to Angular. We will also learn about Angular components and their templates.
19 videos, 23 readings expand
- Video: Welcome to Front-End JavaScript Frameworks: Angular
- Video: How to Use the Learning Resources
- Reading: Welcome to Front-End JavaScript Frameworks: Angular: Additional Resources
- Reading: Full Stack Web Development: The Big Picture: Objectives and Outcomes
- Video: What is Full-Stack Web Development?
- Reading: Full Stack Web Development: Additional Resources
- Reading: Setting up Your Development Environment: Git and Node: Objectives and Outcomes
- Reading: Setting up your Development Environment
- Video: Exercise (Video): Setting up Git
- Reading: Exercise (Instructions): Setting up Git
- Video: Exercise (Video): Basic Git Commands
- Reading: Exercise (Instructions): Basic Git Commands
- Video: Exercise (Video): Online Git Repositories
- Reading: Exercise (Instructions): Online Git Repositories
- Video: Node.js and NPM
- Video: Exercise (Video): Setting up Node.js and NPM
- Reading: Exercise (Instructions): Setting up Node.js and NPM
- Video: Exercise (Video): Basics of Node.js and NPM
- Reading: Exercise (Instructions): Basics of Node.js and NPM
- Reading: Setting up your Development Environment: Git and Node: Additional Resources
- Reading: Introduction to Angular: Objectives and Outcomes
- Video: Front-end JavaScript Frameworks Overview
- Video: Introduction to Angular
- Video: Exercise (Video): Getting Started with Angular
- Reading: Exercise (Instructions): Getting Started with Angular
- Video: Angular Application Architecture Overview
- Video: Exercise (Video): Configuring your Angular Application
- Reading: Exercise (Instructions): Configuring your Angular Application
- Reading: Introduction to Angular: Additional Resources
- Reading: Angular Components: Objectives and Outcomes
- Video: Angular Components
- Video: Exercise (Video): Angular Components Part 1
- Reading: Exercise (Instructions): Angular Components Part 1
- Video: Structural Directives
- Video: Exercise (Video): Angular Components Part 2
- Reading: Exercise (Instructions): Angular Components Part 2
- Reading: Angular Components: Additional Resources
- Video: Assignment 1 Requirements (Video): Angular Components
- Reading: Assignment 1: Angular Components: Additional Resources
- Reading: Ideation: Objectives and Outcomes
- Reading: Ideation Report Template
- Reading: Ideation: Additional Resources
Graded: Angular Components
Graded: Ideation
WEEK 2
Angular Services, Routing and Single Page Applications
In this week, you learn about data binding in Angular. You will learn how to design basic services. You will learn about Angular router and its use in designing single page applications. You will also learn about single page applications and use Angular Router to design single page applications.
14 videos, 18 readings expand
- Reading: Data Binding: Objectives and Outcomes
- Video: Data Binding
- Video: Exercise (Video): Data Binding
- Reading: Exercise (Instructions): Data Binding
- Reading: Data Binding: Additional Resources
- Reading: Angular Service Basics: Objectives and Outcomes
- Video: MVC and MVVM
- Video: Angular Services
- Video: Dependency Injection
- Video: Exercise (Video): Angular Service Basics
- Reading: Exercise (Instructions): Angular Service Basics
- Reading: Angular Service Basics: Additional Resources
- Reading: Angular Routing: Objectives and Outcomes
- Video: Exercise (Video): Header and Footer
- Reading: Exercise (Instructions): Header and Footer
- Video: Angular Routing Basics
- Video: Exercise (Video): Angular Routing Basics
- Reading: Exercise (Instructions): Angular Routing Basics
- Reading: Angular Routing: Additional Resources
- Reading: Single Page Applications: Objectives and Outcomes
- Video: Single Page Applications
- Video: Exercise (Video): Single Page Applications Part 1
- Reading: Exercise (Instructions): Single Page Applications Part 1
- Video: Angular Router: Parameters
- Video: Exercise (Video): Single Page Applications Part 2
- Reading: Exercise (Instructions): Single Page Applications Part 2
- Reading: Single Page Applications: Additional Resources
- Video: Assignment 2 Requirements (Video): Angular Services, Routing and Single Page Applications
- Reading: Assignment 2: Angular Services, Routing and Single Page Applications: Additional Resources
- Reading: UI Design and Prototyping: Objectives and Outcomes
- Reading: UI Design and Prototyping Report Template
- Reading: UI Design and Prototyping: Additional Resources
Graded: Angular Services, Routing and Single Page Applications
Graded: UI Design and Prototyping
WEEK 3
Angular Forms, Angular and Reactive JavaScript
In this module we study Angular support for forms and form validation. Both template-driven forms and reactive forms will be introduced. You will also learn about Promises. Then you will learn briefly about reactive programming, RxJs and its use in Angular.
16 videos, 18 readings expand
- Reading: Angular Template-driven Forms: Objectives and Outcomes
- Video: Angular Template-driven Forms
- Video: Exercise (Video): Angular Template-driven Forms Part 1
- Reading: Exercise (Instructions): Angular Template-driven Forms Part 1
- Video: Angular Template-driven Form Validation
- Video: Exercise (Video): Angular Template-driven Forms Part 2
- Reading: Exercise (Instructions): Angular Template-driven Forms Part 2
- Reading: Angular Template-driven Forms: Additional Resources
- Reading: Angular Reactive Forms: Objectives and Outcomes
- Video: Angular Reactive Forms
- Video: Exercise (Video): Angular Reactive Forms Part 1
- Reading: Exercise (Instructions): Angular Reactive Forms Part 1
- Video: Angular Reactive Form Validation
- Video: Exercise (Video): Angular Reactive Forms Part 2
- Reading: Exercise (Instructions): Angular Reactive Forms Part 2
- Reading: Angular Reactive Forms: Additional Resources
- Reading: Angular and Promise: Objectives and Outcomes
- Video: Promises
- Video: Exercise (Video): Angular and Promise Part 1
- Reading: Exercise (Instructions): Angular and Promise Part 1
- Video: Exercise (Video): Angular and Promise Part 2
- Reading: Exercise (Instructions): Angular and Promise Part 2
- Reading: Angular and Promise: Additional Resources
- Reading: Angular and RxJS: Objectives and Outcomes
- Video: Angular and RxJS
- Video: Exercise (Video): Angular and RxJS Part 1
- Reading: Exercise (Instructions): Angular and RxJS Part 1
- Video: Exercise (Video): Angular and RxJS Part 2
- Reading: Exercise (Instructions): Angular and RxJS Part 2
- Video: Exercise (Video): Angular Reactive Forms Part 3
- Reading: Exercise (Instructions): Angular Reactive Forms Part 3
- Reading: Angular and RxJS: Additional Resources
- Video: Assignment 3 Requirements (Video): Single Page Applications and Angular Forms
- Reading: Assignment 3: Single Page Applications and Angular Forms: Additional Resources
Graded: Angular Forms and Reactive Programming
WEEK 4
Client-Server Communication
In this module you will explore client-server communication using both Angular HTTP module and the REST API. You will get a brief introduction to animation support in Angular and create a custom attribute directive. You will also learn about testing, building and deploying Angular applications.
22 videos, 27 readings expand
- Reading: Client-Server Communication: Objectives and Outcomes
- Video: Networking Essentials
- Video: Exercise (Video): Setting up a Server using json-server
- Reading: Exercise (Instructions): Setting up a Server using json-server
- Reading: Client-Server Communication: Additional Resources
- Reading: Angular HTTP Client: Objectives and Outcomes
- Video: Angular HTTP Client
- Video: Exercise (Video): Angular HTTP Client
- Reading: Exercise (Instructions): Angular HTTP Client
- Video: Exercise (Video): Angular HTTP Client: Error Handling
- Reading: Exercise (Instructions): Angular HTTP Client: Error Handling
- Reading: Angular HTTP Client: Additional Resources
- Reading: Angular and REST: Objectives and Outcomes
- Video: Brief Representational State Transfer (REST)
- Video: Restangular
- Video: Exercise (Video): Angular and REST
- Reading: Exercise (Instructions): Angular and REST
- Video: Exercise (Video): Angular and REST: Saving Changes to Server
- Reading: Exercise (Instructions): Angular and REST: Saving Changes to Server
- Reading: Angular and REST: Additional Resources
- Reading: Animation and Directives: Objectives and Outcomes
- Video: Attribute Directives
- Video: Exercise (Video): Custom Attribute Directives
- Reading: Exercise (Instructions): Custom Attribute Directives
- Video: Angular Animations
- Video: Exercise (Video): Angular Animations Part 1
- Reading: Exercise (Instructions): Angular Animations Part 1
- Video: Exercise (Video): Angular Animations Part 2
- Reading: Exercise (Instructions): Angular Animations Part 2
- Reading: Animation and Directives: Additional Resources
- Reading: Testing Angular Applications: Objectives and Outcomes
- Video: Angular Testing
- Video: Exercise (Video): Angular Testing
- Reading: Exercise (Instructions): Angular Testing
- Video: End-to-End Testing Angular Applications
- Video: Exercise (Video): End-to-End Testing Angular Applications
- Reading: Exercise (Instructions): End-to-End Testing Angular Applications
- Reading: Testing Angular Applications: Additional Resources
- Reading: Building and Deployment: Objectives and Outcomes
- Video: Introduction to Webpack
- Video: Exercise (Video): Building and Deploying the Angular Application
- Reading: Exercise (Instructions): Building and Deploying the Angular Application
- Reading: Building and Deployment: Additional Resources
- Video: Assignment 4 Requirements (Video): Client-Server Communication
- Reading: Assignment 4: Client-Server Communication: Additional Resources
- Video: Conclusions
- Reading: Conclusions: Additional Resources
- Reading: Project Implementation: Objectives and Outcomes
- Reading: Final Report Template
Graded: Client-Server Communication
Graded: Project Implementation and Final Report
Share your review
Do you have experience with this course? Submit your review and help other people make the right choice. As a thank you for your effort we will donate £1.- to Stichting Edukans.There are no frequently asked questions yet. If you have any more questions or need help, contact our customer service.