Meteorite

(And Atmosphere)

Atmosphere is home to many useful packages...

• Iron Router for routing
• Kadira for performance monitoring
• Autoform for forms
• Houston for administration
• Various packages for accounts
• Many popular jQuery Libraries
  • Moment and Livestamp
• And many CSS Frameworks
  • Bootstrap and Foundation
• Pagination, Presence Detection, Spinners...
  • You name it!

It even has...

SPARKLINES

However...

"Unipackage"

(Meteor Package Manager)

• Meteor packages have always been different
  • A little bit of frontend, a little bit of backend
• You can't just put that on NPM! Or Bower, or Component...
  • "Namespace Pollution"
• Of course, you need a thriving 3rd-party package community
  • Keeps developers happy! ^___^

Unipackage is Similar

(to npm and Metorite)

• Uses Semver
• Has add, remove commands
• Has search, view commands
• Can be published and maintained
  • All from the command-line!

Unipackage is Different

• Atmosphere packages must be ported
• Each package has its own `username:` prefix
• Single-loading Package System
  • Errs on using oldest known workable version
  • Tries to reduce JS sent to client
• "Repeatable Builds"
  • No shrinkwrapping, but we make Meteor aware of what's going on
• on_test -> onTest
  • It's the small differences...

Don't wait!

As Meteor devs know...

There's no need to wait for the official release!

UNLESS IT ALREADY HAPPENED BETWEEN THE TIME I WROTE THIS SLIDE AND THE TIME I DELIVERED THIS TALK...

Here's how:

Find new releases here:

https://github.com/meteor/meteor/releases

meteor update --release 0.9.0-rc22

Don't be afraid to upgrade!

• In order to temporarily downgrade, you can run any command as an older Meteor version using the           --release option, such as...

meteor --release 0.8.3

Another magical feature of Meteor!

Percolate Interview

So, Dominic Nguyen of Percolate recently interviewed Ekate Kuznetsova, the person who is spearheading the MPM effort. It's highly informative, and well worth a read. But don't take my word for it, check it out on your local internets!

http://blog.percolatestudio.com/engineering/meteor-packaging-questions/

The Package I developed...

meteor-stylus-multi

• in Atmosphere, just `stylus-multi`
• or in Unipackage, `cryptoquick:stylus-multi`

What stylus-multi does...

• Adds latest Stylus support to your project
• Also adds Nib, Jeet, Rupture, Axis, and Platonic
• Powerful
• Tested
• Well-documented
• Eight whole entire stars on GitHub!
• 130+ downloads on Atmosphere

Stylus

// star wars effect
transform: perspective(40px)
    rotateX(-3deg)
transform-origin: 20% 50%;

Nib

(like Bourbon)

Jeet

(like Neat, but it's Jeet)

Rupture

That simple!

Axis

• Powerful!
  • If you haven't found a styling mixin yet...
• You'll probably find it here:
• global-reset()
• normalize()
• various utilities
• typography
• forms, gradients, code, interaction, easing, buttons, ui, animation...

Platonic

CSS3D. 'nuff said.

Well...

@import "stylus-platonic"

.platonic-viewport
  .scene
    .ui-component
      &.grid
        grid()

      &.display-axis
        display-axis(component-id: 1)
        z-index: 2

    .mesh
      &.dodecahedron
        dodecahedron(translate-z: -150px, mesh-id: 0)

      &.icosahedron
        icosahedron(translate-z: 150px, mesh-id: 1)

      &.octahedron
        octahedron(translate-x: -150px, mesh-id: 2)

      &.tetrahedron
        tetrahedron(translate-x: 150px, mesh-id: 3)

(squint)

The Nitty Gritty

• Why didn't I make multiple packages, one for each?
  • There were futures errors I was getting when using multiple Stylus packages on the same project. It's likely it didn't want to have multiple preprocessors. The process of combining them seems ambiguous, but I could be wrong. Also, it would be difficult for me to support many separate projects.

// excerpt from plugins/compile-stylus.js
Plugin.registerSourceHandler("styl", function(compileStep) {
  var f = new Future;
  stylus(compileStep.read().toString('utf8'))
    .use(nib())
    .use(jeet())
    .use(axis())
    .use(rupture())
    .use(platonic())
    .set('filename', compileStep.inputPath)

Testing

Yes.

• Testing is simple, using... Tinytest!
  • Generally packages will use Tinytest, and applications will use Velocity.
  • (it says so in the Velocity README.md... but who reads those?)
  • Remember...

meteor test-packages ./

Humble Beginnings...

DEMO TIME

...