NativeScript Animations Course on Pluralsight
If you’re ready to take your animations in NativeScript to the next level, Alex Ziskind has just release another course on Pluralsight…
Take control of your career. Build JavaScript mobile apps.
If you’re ready to take your animations in NativeScript to the next level, Alex Ziskind has just release another course on Pluralsight specifically for NativeScript and Angular animations. You can find the course here
Course Introduction
Course Description
Learn how an app, built using NativeScript that is already in the Apple and Google App stores, can be enhanced by applying newly learned animation techniques using both code animation and CSS animation. In this course, NativeScript: Animation Techniques, you’ll dive deeper into ways you can leverage the power of your environment to get beautiful animations with documented methods. First, you’ll learn how to write plain JavaScript property animation code without frameworks. Next, you’ll learn creating animation from sprite images using pure JavaScript. Then, you’ll learn leveraging code-based animation classes and function that get shipped with NativeScript and Angular 2. Finally, you’ll dive deep into the basics of CSS animation and applying them to your sample application and tapping into the raw power of Native platforms. By the end of this course, you’ll know more about NativeScript with Angular and how to build beautiful animations for your mobile applications.
Audience
This course is for web developers who are already proficient with TypeScript and CSS, and are familiar with NativeScript. They want to expand their NativeScript knowledge to focus in on animation.
What you’re doing
In this course, in addition to the documented instructions you'll find on the NativeScript and Angular websites, we're going to dive deeper into ways you can leverage the power of your environment to get beautiful animations with documented methods, as well as some less known techniques.
Some of the major topics that we will cover include:
- Writing plain JavaScript property animation code without frameworks
- Creating animation from sprite images using pure javaScript
- Leveraging code based animation classes and functions that get shipped with NativeScript and Angular 2
- Deep diving into the basics of CSS animation and applying them to our sample application
- And finally tapping into the raw power of the native platforms to perform incredible animation gymnastics
Course Link
NativeScript Animation Techniques
Curriculum
| Course Introduction | |
|---|---|
| 1 | Course Introduction |
| 2 | Prerequisites |
| 3 | About Accompanying Code |
| 4 | RPS Conference Application Design |
| 5 | RPS Application: Before and After |
| 6 | Course Outline |
| Core Animation Concepts | |
|---|---|
| 1 | Introduction |
| 2 | Pure JavaScript Animations |
| 3 | Generic Animation |
| 4 | The Law |
| 5 | What Problem We are Solving for RPS |
| 6 | Demo: Applying Pure JavaScript Animation |
| 7 | What You Cannot Do |
| 8 | Summary |
| Applying Imperative Animations | |
|---|---|
| 1 | Introduction |
| 2 | About Sprites |
| 3 | Demo: Sprite Animation |
| 4 | The NativeScript Way |
| 5 | Demo: Using the Animate Function |
| 6 | Animation Class |
| 7 | Demo: Using the Animation Class |
| 8 | Animating Multiple Properties |
| 9 | Demo: Curves and Multiple Properties |
| 10 | Angular Animations |
| 11 | Demo: Applying Angular 2 Animations |
| 12 | Summary |
| Applying Declarative Animations | |
|---|---|
| 1 | Introduction |
| 2 | Why CSS Animations? |
| 3 | CSS Animation Types |
| 4 | Animatable Properties |
| 5 | Demo: Applying Keyframe Animations |
| 6 | Demo: Taking Keyframe Animations Further |
| 7 | Pseudo-Selectors |
| 8 | Demo: Pseudo-Selector |
| 9 | Demo: Session Card with Keyframes |
| 10 | 3rd Party Libraries |
| 11 | Demo: Animate.css |
| 12 | Summary |
| Calling Native Animation APIs | |
|---|---|
| 1 | Introduction |
| 2 | Why Use Native Animations? |
| 3 | Demo: Applying Native Animations |
| 4 | Summary |
| Course Summary | |
|---|---|
| 1 | Staying up to Date |
| 2 | Extending Your Toolkit |
| 3 | Course Summary |
