npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

backbone.atlas

v0.3.2

Published

Extended Backbone.Model and Backbone.Collection

Downloads

15

Readme

About Atlas

Atlas* is an extension for Backbone. It provides improved Model and Collection classes for easier manipulation of nested resources, filters and custom headers.

*In anatomy, the atlas is the first cervical vertebra of the spine.

Table of contents

Installation

Install as node module.

npm install --save backbone.atlas

Usage

Example: Import Module

import Atlas from "backbone.atlas";

To use all Atlas features, application models and collections must extend Atlas' instead of Backbone's.

Example: Extending

const ExampleModel = Atlas.Model.extend(protoProps);
const ExampleCollection = Atlas.Collection.extend(protoProps);

Atlas uses initialize method to assign options like parent and filters. If initialize method is implemented, super initialize must be called.

Example: Overriding Initialize


const ExampleModel = Atlas.Model.extend({
  initialize(attributes, options) {
    Atlas.Model.prototype.initialize.call(this, attributes, options);
      
    // Additional initialization
  }
});

Example: Polymorphic Collections

const ExampleCollection = Collection.extend({
  baseModel: User,

  model(attributes, options) {
    switch (attributes.type) {
      case "1":
        return new Seller(attributes, options);

      case "2":
        return new Traveler(attributes, options);

      default:
        return new this.baseModel(attributes, options);
    }
  }
});

NOTE: Collection's url() and sync() methods check model.prototype to determine urlRoot and headers. Specify baseModel for polymorphic collections.

Features

Nesting Resources

Resources are nested by specifying parent option when instantiating model ot collection.

Example: User Preferences

const User = Atlas.Model.extend({
  urlRoot: "/users",
});

const Preference = Atlas.Model.extend({
  urlRoot: "/preferences"
});

const Preferences = Atlas.Collection.extend({
  model: Preference
});

let user = new User({ id: 1 });
let preferences = new Preferences([], { parent: user });

preferences.fetch(); // Will fetch from `/user/1/preferences`

NOTE: Atlas uses url() method to return nested urls. There is rarely a need to override this method.

Filters

Query parameters can easily be manipulated with filters option.

Example: Filtered Products

const Product = Atlas.Model.extend({
  urlRoot: "/products"
});

const Products = Atlas.Collection.extend({
  model: Product
});

let computers = new Products([], {
  filters: {
    type: "computer"
  }
});
computers.fetch(); // Will fetch from `/products?type=computer`

NOTE: Atlas uses fetch() method to add filters. There is rarely a need to override this method.

Parsing

Atlas uses static, per-attribute parsers to parse model attributes individually.

Example: Attribute Parsers

const Article = Atlas.Model.extend({}, {
  parsers: {
    published(value, options, model) {
      return new Date(value);
    }
  }
});

let article = new Article({ published: "2018-09-28" }, { parse: true });
article.get("published"); // Returns a Date object

If a specific attribute parser is not defined, default attribute parser will be be called. Default parser can be overridden to provide a catch-all parser logic.

Example: Default Parser

const Article = Atlas.Model.extend({}, {
  parse(value, options, model, attribute) {
    return value;
  }
});

Headers

Request headers can easily be manipulated with headers option. Headers added this way will only affect instances of ExampleModel and it's extending classes.

IMPORTANT: Headers are always set to Model. Collection will pickup headers from it's model option.

Example: Custom Headers

const ExampleModel = Atlas.Model.extend({
  headers: {
    "X-Custom-Header": "Hello"
  }
});

NOTE: Atlas uses sync() method to add headers. There is rarely a need to override this method.