Developing powerful, interactive modern web applications is a complex endeavor. Enter AngularJS, the framework par excellence which has clearly emerged the winning solution, due to its simplicity and extensive range of features, including Two Way Data-Binding and Directives. These features enable a developer to write flexible and testable front-end code, and ultimately to build efficient, photogenic web applications.
Though documentation and online tutorials are available to develop with AngularJS UI, it can be difficult to locate the resources to really take advantage of all the available options for great UI design. Mastering AngularJS UI Development takes you step by step through core AngularJS concepts by demonstrating the build of a TV Show tracking app, before showing you how to enhance and beautify the UI.
Firstly, you will start out with a skeleton application and apply best practices for creating controllers and implementing services. Then, you will learn how to connect the application to an API and add various features to it such as search, tracking, and rating functionalities. You will also learn how to persist data with local storage. Here we move on to beautifying your app by creating various components and reusing them with the help of directives. You'll build attractive forms to validate your users and make your app secure. After that, you will learn different ways to troubleshoot issues with routes, two-way bindings, animations, and isolated scopes.
With best practices engrained throughout, and many advanced concepts explained, after this course you will be able to build better, fantastic-looking AngularJS applications.
About The Author
Leon Revill has over three years of commercial AngularJS development experience and is currently working as a Mobile Architect building complex mobile platform applications using AngularJS and other modern web technologies. As an AngularJS mentor at Thinkful, he tutors students all around the world, taking them from AngularJS novices to ninjas in just a few months.
This video will offer an overview of the course.
Learn how to scaffold an AngularJS application using best practices.
Prevent scope bleed and undescriptive code by implementing controllers using the ControllerAs syntax.
Interact with APIs and share data throughout the application using well-structured services.
This video will explore how to interact with an API and deal with the response.
This video teaches the viewer how to allow users to search for their favorite shows.
Now the user can search for shows. Give them the option to select from all shows and track their selection, which will then be added to a My Shows page.
In this video, the user will learn how to cause the application data to persist, using Local Storage to save the data.
Understand the complex AngularJS directive API and how to create custom directives.
Encapsulate the show overview functionality so that it can easily be reused throughout the application.
Create a reusable component that encapsulates complex logic to display which of the user's tracked shows is showing next.
Allow the user to get a hint of the available TV shows before submitting their search.
Permit the user to navigate through multiple pages worth of search results as opposed to a single, large page.
Let the user add their own personal rating to their tracked shows.
Hardcore TV show enthusiasts will appreciate the ability to track their thoughts as they watch a show, so we will add this to our TvTracker app.
HTML forms can be a hassle to implement when you need robust client-side validation. Learn how AngularJS makes this easier.
There may be times when the standard form directives don't meet your requirements. Understand how you can extend this functionality to provide custom validation mechanisms.
Displaying error messages within forms to users using clever animations can enhance the user experience. Understand how easy this is to do using AngularJS.
As an AngularJS developer, you may spend many hours debugging because your data isn't updating as you would expect. This video will provide a better understanding of AngularJS's two-way data binding, and AngularJS objects can go a long way to prevent these kinds of issues.
When you are dynamically loading images from an API on a slow connection, even if you are able to use small images, you will often get the dreaded waterfall effect.
Now that the user has the ability to freely change URL parameters, they can often break your applications easily by requesting for resources that don't exist.
Recapping what we covered in the course.
Packt has been committed to developer learning since 2004. A lot has changed in software since then - but Packt has remained responsive to these changes, continuing to look forward at the trends and tools defining the way we work and live. And how to put them to work.
With an extensive library of content - more than 4000 books and video courses -Packt's mission is to help developers stay relevant in a rapidly changing world. From new web frameworks and programming languages, to cutting edge data analytics, and DevOps, Packt takes software professionals in every field to what's important to them now.
From skills that will help you to develop and future proof your career to immediate solutions to every day tech challenges, Packt is a go-to resource to make you a better, smarter developer.
Packt Udemy courses continue this tradition, bringing you comprehensive yet concise video courses straight from the experts.