CF

100 Angular Challenge

12h 23m 17s
English
Free

100 Angular Challenge is a 89-lesson 12 hours 23 minutes self-paced course by Udemy. Build 100 Components, Services, Directives, Pipes in Angular and Much More!

Course facts

Lessons
89
Duration
12 hours 23 minutes
Level
All levels
Language
English
Updated
Instructor
Udemy
Price
Free
Build 100 Components, Services, Directives, Pipes in Angular and Much More! We will master all Angular has to offer by building 100 re-usable and practical Components, Directives, Services, Pipes and much more to be used in your personal or professional projects.

Not only will we build 100 items, but we will also go over Jasmine and Unit Testing so we can write the most solid code possible and certify it does what it is supposed to.

As we dive deeper into our Angular application we will hit on its various other technologies in detail including:

  • TypeScript

  • JavaScript

  • HTML / CSS

  • Jasmine and Unit Testing

  • SASS

  • and more

By the end of this course you my goal for you is to 'Get Good. Get Great. Then Get Better' with Angular. Lets go!

Who teaches 100 Angular Challenge? Udemy

Udemy thumbnail

Udemy is the largest open marketplace for online courses on the internet. Founded in 2010 by Eren Bali, Oktay Caglar, and Gagan Biyani and headquartered in San Francisco, the company went public on the Nasdaq in 2021 under the ticker UDMY. The platform hosts well over two hundred thousand courses across software development, IT and cloud, data science, design, business, marketing, and creative skills, taught by tens of thousands of independent instructors. Roughly seventy million learners use it worldwide, and the corporate arm — Udemy Business — supplies a curated subset of that catalog to enterprise customers.

Because Udemy is a marketplace rather than a single editorial publisher, the catalog is uneven by design. The strongest material lives in the long-form, project-based courses authored by working engineers — full-stack JavaScript, React, Node.js, Python data science, AWS, Docker and Kubernetes, mobile development with Flutter and React Native, and cloud certification preparation. The CourseFlix listing under this source is the slice of that catalog that has been mirrored here for offline-friendly viewing, organized by topic and updated as new releases land. Pricing on Udemy itself swings dramatically with the site's near-permanent sales, which is why the platform is best treated as a deep reference catalog: pick instructors with strong reviews and a track record of updating their material rather than buying on the headline price alone.

What lessons are included in 100 Angular Challenge?

  • Space or K: play or pause
  • J: rewind 10 seconds
  • L: forward 10 seconds
  • Left Arrow: rewind 5 seconds
  • Right Arrow: forward 5 seconds
  • Up Arrow: volume up
  • Down Arrow: volume down
  • M: mute or unmute
  • F: toggle fullscreen
  • T: toggle theater mode
  • I: toggle mini player
  • 0 to 9: seek to 0 to 90 percent of the video
  • Shift plus N: next video
  • Shift plus P: previous video
0:00 0:00
#Lesson TitleDuration
1Introduction: What are we building and who is this dude? 06:49
2Tools We Use 00:33
3Github Repo / Source Code 00:33
4Updating Introduction 00:53
5Creating a New Project with Angular CLI 02:10
6Updating Versions 03:26
7Understanding Our Configuration 04:20
8Understanding our src setup 04:59
9Generating Components with CLI 02:04
10Configuring ng generate component to use scss 02:38
11Converting Application to SCSS 01:03
12How to Succeed with this Course 01:25
131. Basic Toolbar 10:18
142. Card 10:22
153. Accordion 11:41
164. Progress Bar 08:27
175. Star Ratings 10:04
186. Top of Page 09:54
197A. Basic Routing Setup 06:26
207B. Basic Routing Setup 04:06
218. Lazy Loading Routes 06:50
229. Truncate Pipe 03:11
2312. Loader Circular Component 08:46
2410. Credit Card Formater Pipe 09:48
2511. Credit Card Input Component 14:15
2613. Loader Loading Component 13:54
2714. Twitter Post Component 11:31
2815. LinkedIn Post Component 05:02
2916. Flatten Pipe 05:52
3017. Modal Component 10:50
3118. Debounce Click Directive 07:57
3219. Quote Component 07:35
3320. Toggle Component 06:48
3421. Filter Term Pipe 03:32
3522. Rich Text Viewer Component 06:37
3623. Debounce Search Component 09:34
3724. Search List Component 12:33
3825. Counter Component 12:14
3926. Simple Table 09:57
4027. Paging Component 20:27
4128. Tabs Component 11:21
4230. Ripple Directive 10:04
4331. Fade In Out Animation 08:20
4433. Sort Table Component 21:34
4534. Reactive Forms Email Component 27:57
4635. Form Dirty Guard 08:07
4736. User Service 12:15
4839. Ribbon Component 12:48
4940. Button Toggle Component 12:49
5041. Banner Cut Out Component 08:53
5142. Scale Directive 03:51
5243. Snackbar Component 14:46
5344. Simple Popup Component 10:17
5445. Countdown Timer Component 19:02
5546. Snackbar Service 07:42
5647. Copy Directive 07:45
5748. Lazy Load Image Directive 15:48
5850. Footer Component 12:31
5951. Slide Right Animation 03:33
6052. Skeleton Loader Component 09:04
6153. Social Media Bar Component 14:19
6254. Bottom Sheet Component 08:42
6355. Fieldset Toggle Component 05:21
6456. Pill Component 08:01
6557. Pill Filter List Component 15:17
6658. Not Found Component 10:33
6759. Password Component 17:33
6863. Title Service 12:09
6970. Rich Text Pipe 04:43
7072. Sort By Pipe 05:50
7173. Sort By Key Pipe 05:29
7275. Overlay Component 03:51
7376. Local Storage Service 10:41
7477. Route Params 07:32
7578. Common Scripts 07:29
7679. Active Route UI 04:27
7780. Auto Focus Input Directive 03:47
78Testing Introduction 01:19
7992. Component Testing 10:33
8093. Guard Testing 09:01
8194. Pipe Testing 04:55
8295. Directive Testing 13:09
8396. Mock 3rd Party (Http) 04:47
8497. Service Testing 10:38
8598. Mock First Party Services 05:05
8699. Abstracting Services for Testing 05:06
87100. Testing Practice x 75 01:28
88Good job! 02:32
89Bonus Lecture 01:09

What courses are similar to 100 Angular Challenge?

More courses by Udemy

Frequently asked questions

What are the prerequisites for enrolling in this course?
This course requires a basic understanding of JavaScript, HTML, and CSS. Familiarity with Angular CLI and version control systems like Git will be beneficial but not mandatory. The initial lessons, such as 'Creating a New Project with Angular CLI' and 'Understanding Our Configuration', are designed to help you set up your development environment and understand the project's structure.
What types of projects will I build during the course?
You will build 100 reusable components, services, directives, and pipes. Projects include a 'Basic Toolbar', 'Card', 'Accordion', 'Progress Bar', 'Star Ratings', and a 'Credit Card Formatter Pipe'. These projects are practical and can be utilized in personal or professional Angular applications. Each lesson focuses on a specific aspect of Angular development, ensuring you gain hands-on experience in various functionalities.
Who is the target audience for this course?
The course is ideal for front-end developers who want to deepen their understanding of Angular. It is also suitable for those who have a basic knowledge of Angular and wish to expand their skills by building practical components and services. Developers looking to improve their Angular-based project efficiency will find this course particularly useful.
How does the depth of this course compare to other Angular courses?
This course emphasizes practical, hands-on experience by having you build 100 distinct Angular components, services, directives, and pipes. Unlike some courses that focus primarily on theory, this course prioritizes real-world application, ensuring you learn by doing. The lessons cover a wide range of Angular features, aiming to provide a comprehensive understanding through extensive practice.
What specific tools and platforms are used in this course?
The course utilizes Angular CLI for project creation and management, and SCSS for styling, as seen in lessons like 'Converting Application to SCSS'. The source code is managed using Git, with a dedicated lesson on using a GitHub repository. These tools are integral to modern Angular development and are covered in the early lessons to set up a strong foundation.
What topics are not covered in this course?
The course does not cover backend development or server-side rendering with Angular Universal. The focus is strictly on front-end development using Angular, including building UI components and services. If you're looking for integrated full-stack development, you may need to supplement this course with additional resources.
What is the expected time commitment to complete the course?
The course consists of 89 lessons, each designed to build a specific component, service, directive, or pipe. Although the total runtime is not specified, students should expect to spend a few hours per lesson, including time for coding practice and revisions. Setting aside consistent time each week will help in steadily progressing through the course content.