You are previewing Ember.js Cookbook.
O'Reilly logo
Ember.js Cookbook

Book Description

Arm yourself with over 65 hands-on recipes to master the skills of building scalable web applications with Ember.js

About This Book

  • This book is your one-stop solution to the key features of Ember.js. Become skilled in the art of building web-apps in a fraction of the code you'd write in other frameworks.

  • Build JavaScript apps that don't break the web! Our 100 recipes will make this a cakewalk for you!

  • This books makes learning Ember.js easy by breaking down each topic into simple-to-understand recipes

  • Who This Book Is For

    Anyone who wants to explore Ember.js and wishes to get hands on making sophisticated web apps with less coding will find this book handy. Prior experience in Coding and familiarity with JavaScript is recommended. If you’ve heard of Ember.js or are just curious on how a single-page application framework works, then this book is for you.

    What You Will Learn

  • Skip the boilerplate code with Ember CLI generators

  • Create a component with actions and events

  • Set up a model with Ember Data using fixture data

  • Create several different types of test cases and run them

  • Manage and set up user authentication using Ember Simple Auth

  • Add animated transitions to your app with Liquid Fire

  • Set up a service and initializer with dependency injection

  • Create a working chat application

  • Set up an Ember Service and initializer with dependency injection

  • Create a working chat application

  • In Detail

    Ember.js is an open source JavaScript framework that will make you more productive. It uses common idioms and practices, making it simple to create amazing single-page applications. It also lets you create code in a modular way using the latest JavaScript features. Not only that, it has a great set of APIs to get any task done. The Ember.js community is welcoming newcomers and is ready to help you when needed.

    This book provides in-depth explanations on how to use the Ember.js framework to take you from beginner to expert. You’ll start with some basic topics and by the end of the book, you’ll know everything you need to know to build a fully operational Ember application.

    We’ll begin by explaining key points on how to use the Ember.js framework and the associated tools. You’ll learn how to effectively use Ember CLI and how to create and deploy your application. We’ll take a close look at the Ember object model and templates by examining bindings and observers. We’ll then move onto Ember components, models, and Ember Data. We’ll show you examples on how to connect to RESTful databases. Next we’ll get to grips with testing with integration and acceptance tests using QUnit. We will conclude by covering authentication, services, and Ember add-ons. We’ll explore advanced topics such as services and initializers, and how to use them together to build real-time applications.

    Style and approach

    Each recipe in this book will make it that much easier to understand Ember.js. Recipe after recipe, you will learn the concepts of Ember.js by following the simple step-by-step processes

    Downloading the example code for this book. You can download the example code files for all Packt books you have purchased from your account at http://www.PacktPub.com. If you purchased this book elsewhere, you can visit http://www.PacktPub.com/support and register to have the code file.

    Table of Contents

    1. Ember.js Cookbook
      1. Table of Contents
      2. Ember.js Cookbook
      3. Credits
      4. About the Author
      5. About the Reviewer
      6. www.PacktPub.com
        1. eBooks, discount offers, and more
          1. Why Subscribe?
      7. Preface
        1. What this book covers
        2. What you need for this book
        3. Who this book is for
        4. Sections
          1. Getting ready
          2. How to do it…
          3. How it works…
          4. There's more…
          5. See also
        5. Conventions
        6. Reader feedback
        7. Customer support
          1. Downloading the example code
          2. Errata
          3. Piracy
          4. Questions
      8. 1. Ember CLI Basics
        1. Introduction
        2. Installing Ember CLI
          1. Getting ready
            1. A one-click installer for Windows or Mac
            2. Homebrew or MacPorts for Mac
            3. A TAR file
            4. The Linux package manager
            5. Test installation
          2. How to do it...
          3. How it works...
          4. There's more...
            1. Commands
            2. Aliases
        3. Creating your first project
          1. How to do it...
          2. How it works...
          3. There's more...
        4. Exploring pods and the folder layout
          1. Getting ready
            1. Pods
          2. How to do it...
          3. How it works...
        5. Asset compilation
          1. How to do it...
            1. CSS and assets
            2. Minifying
            3. Fingerprinting
          2. How it works...
        6. Dependency management
          1. How to do it...
            1. The app.import code
          2. How it works...
        7. Upgrading your project
          1. How to do it...
            1. Updating an existing project
          2. How it works...
        8. Deployment
          1. How to do it...
            1. Deploying to Firebase
          2. How it works...
      9. 2. The Ember.Object Model
        1. Introduction
        2. Working with classes and instances
          1. How to do it...
            1. Accessing properties within the bulb instance
            2. Initializing the Ember object
            3. Reopening classes
          2. How it works...
          3. There's more...
        3. Working with computed properties
          1. How to do it...
            1. Chaining the Light object
            2. Alias
          2. How it works...
        4. Working with Ember observers in Ember.js
          1. How to do it...
            1. Synchronous issues with the Light object and observers
          2. How it works...
        5. Working with bindings
          1. How to do it...
            1. One-way binding
          2. How it works...
        6. Using mixins
          1. How to do it...
            1. Mixins with the Ember CLI
          2. How it works...
        7. Using enumerables with arrays
          1. Getting ready
          2. How to do it...
            1. Using forEach with an array
            2. Using map with an array
            3. Using mapBy with an array
            4. Finding the first and last objects in an array
            5. Fun with filters
            6. Using filterBy with a collection of objects
            7. Using find to get the first match
            8. Using findBy with collections
            9. Learning with the every enumerable
            10. Using any to find at least one match
          3. How it works...
      10. 3. Ember Templates
        1. Introduction
        2. Defining an application template
          1. Getting ready
          2. How to do it...
            1. Using templates with components
          3. How it works...
        3. Working with conditionals in templates
          1. How to do it...
            1. Using inline invocation with templates
            2. Working on nested invocation with templates
            3. The opposite of if is unless
          2. How it works...
        4. Displaying a list of items
          1. How to do it...
            1. Finding the index of the array
          2. How it works...
        5. Binding with element attributes and classes
          1. How to do it...
          2. How it works...
        6. Working with HTML links inside templates
          1. How to do it...
            1. Using link-to helpers with dynamic segments
          2. How it works...
        7. Handling HTML actions
          1. How to do it...
            1. Adding a parameter to an action event
          2. How it works...
        8. Using template input helpers
          1. How to do it...
            1. How to use checkbox helpers
            2. How to use text areas
          2. How it works...
        9. Using development helpers
          1. How to do it...
          2. How it works...
      11. 4. Ember Router
        1. Introduction
        2. Defining an application route
          1. How to do it...
            1. Working with nested routes in your application
            2. Adding a wildcard
            3. Adding dynamic segments to our about application
          2. How it works...
        3. Setting up a route model
          1. How to do it...
          2. How it works...
        4. Handling dynamic segments inside routes
          1. Getting ready
          2. How to do it...
          3. How it works...
        5. Defining routes with templates
          1. How to do it...
          2. How it works...
        6. Using redirection with routes
          1. How to do it...
          2. How it works...
        7. Working with asynchronous routing
          1. How to do it...
          2. How it works...
        8. Loading and error handling
          1. How to do it...
            1. Creating an error substate
          2. How it works...
        9. Using query parameters
          1. How to do it...
            1. Adding a link-to helper with a query parameter
            2. Resetting a controller's query parameters
          2. How it works...
      12. 5. Ember Controllers
        1. Introduction
        2. Storing application properties
          1. How to do it...
          2. How it works...
        3. Handling actions in controllers
          1. How to do it...
          2. How it works...
        4. Working with transitions
          1. How to do it...
          2. How it works...
        5. Managing dependencies between controllers
          1. How to do it...
          2. How it works...
      13. 6. Ember Components
        1. Introduction
        2. Using components in an application
          1. How to do it...
            1. Creating a student component dynamically
          2. How it works...
        3. Using events in components
          1. How to do it...
          2. How it works...
        4. Implementing actions in components
          1. How to do it...
            1. Closure actions with our student component
          2. How it works...
        5. Passing properties to a component
          1. How to do it...
          2. How it works...
        6. Using yield with components
          1. How to do it...
          2. How it works...
      14. 7. Ember Models and Ember Data
        1. Introduction
        2. Understanding the functionalities of Ember Data
          1. Getting ready
          2. How to do it...
          3. How it works...
        3. Creating, reading, updating, and deleting records with Ember Data
          1. Getting ready
          2. How to do it...
          3. How it works...
        4. Using fixtures
          1. Getting ready
          2. How to do it...
          3. How it works...
        5. Customizing the adapter and serializer
          1. Getting ready
          2. How to do it...
            1. Optional customizations in Ember Data
              1. Host customization
              2. Headers customization
            2. Working with serializers
              1. Updating IDs
              2. KeyForAttribute when working a JSON payload
          3. How it works...
        6. Working with relationships
          1. Getting ready
          2. How to do it...
          3. How it works...
      15. 8. Logging, Debugging, and Testing
        1. Introduction
        2. Using Ember.Logger
          1. How to do it...
          2. How it works...
        3. Using Ember Inspector
          1. Getting ready
          2. How to do it...
        4. Verifying deprecations and using advanced features of Ember Inspector
          1. How to do it...
          2. How it works...
        5. Using acceptance testing
          1. How to do it...
          2. How it works...
        6. Using unit tests
          1. How to do it...
          2. How it works...
        7. Testing components
          1. How to do it...
            1. Testing actions in the font-sizer component
          2. How it works...
        8. Testing routes
          1. How to do it...
          2. How it works...
        9. Testing models
          1. How to do it...
          2. How it works...
        10. Testing controllers
          1. How to do it...
          2. How it works...
      16. 9. Real-Life Tasks with Ember.js
        1. Introduction
        2. Using services with a component
          1. How to do it...
          2. How it works...
        3. Managing basic authentication
          1. How to do it...
          2. How it works...
        4. Using OAuth2 with Ember Simple Auth
          1. Getting ready
          2. How to do it...
          3. How it works...
        5. Using Liquid Fire to create transitions
          1. How to do it...
          2. How it works...
        6. Working with HTML5 drag and drop
          1. How to do it...
          2. How it works...
        7. Learning Bootstrap with Ember.js
          1. How to do it...
          2. How it works...
      17. 10. Awesome Tasks with Ember
        1. Introduction
        2. Using Ember validations
          1. How to do it...
          2. How it works...
        3. Using D3.js with Ember.js
          1. How to do it...
          2. How it works...
        4. Using Ember with Sockets
          1. How to do it...
          2. How it works...
          3. There's more...
        5. Using Ember with Firebase
          1. Getting ready
          2. How to do it...
          3. How it works...
        6. Using server side rendering
          1. How to do it...
          2. How it works...
      18. 11. Real-Time Web Applications
        1. Introduction
        2. Using dependency injection
          1. How to do it...
          2. How it works...
        3. Working with application initializers
          1. How to do it...
          2. How it works...
        4. Building a chat application
          1. How to do it...
          2. How it works...
          3. There's more...
        5. Creating and working with add-ons
          1. How to do it...
            1. Testing the sockjs-chat add-on
            2. Publishing the sockjs-chat add-on
          2. How it works...
          3. See also
        6. Learning the Ember run loop
          1. Getting ready
            1. Understanding Ember run queues
            2. When should you change the Ember run loop?
            3. Working with the Ember.run namespace
          2. How to do it...
          3. How it works...
      19. Index