Meteor Book and updated packages

Its a while since wrote something here, so i will post an update of whats going on in the background.

My book

Over the last 9 months or so i wrote a book called “Building Single page Web Apps with Meteor” and i’m finally almost done. I’m currently writing on the last chapter titled “Testing in Meteor”, which drags a little as velocity – meteors official testing framework is quite not ready just yet.

The book writing experience was long, though it was a very fluid process until the last few months were i basically ran behind every change in the API to keep all chapters updated :) But i finally prevailed and i am proud of the result.

book cover page

So if you want to get a copy buy it from amazon.com, or better directly from PACKT publishing (more money for me, you know big corporations are evil)

Package updates

While working on the tunedin app (which sadly will never see the light of the day again -> insolvency) and on some freelance projects in the last months, i always improved and updated my packages.

To note a few:

animation-helper

Animation are actually thanks to meteor’s _uihooks now easily possible and this package makes it even simpler. You just wrap big chunks of your app or elements you want to animate with {{#Animate}}...{{/Animate}} and then every element which has a .animate class will be animation according to the CSS transitions you defined for the that elements animate class.

What the package does is simply removing the animate class when the element gets rendered, causing the animation to start. Before the element gets taken of the screen (through a template destroy, or a {{#if}} block switch), it puts the .animate class back and waits for the animation to be finishes before it actually takes the element of the DOM.

animation-helper-velocity

If you rather want to use velocity.js for animations you can use the frozeman:animation-helper-velocity package, though it needs a few improvements from the latter package. I personally like to stay native and use CSS transitions.

simple-modal

This package adds a simple modal, anywhere you want to put it and you can then trigger is specifying a “trigger” session variable.

The modal is not really styled like in the picture in the README, though you can easily do it yourself, i don’t like when packages come already styled and then every app looks exactly the same “bootstrap-ish”. I prefer they give you the basics and you can beautify them yourself with a few lines of CSS.

global-notifications

This is a simple global notifications toaster, which will popup from the bottom right (CSS can overwrite this). You can show multiple toaster at the same time, each having its own timeout, or can be clicked away. Additionally they can contain an ok or cancel button which can be renamed and call a callback function. A simple example would be:

GlobalNotification.info({
    title: 'My Title',
    content: 'My Text',
    duration: 2 // duration the notification should stay in seconds
});

Which could look like this:

Screen Shot 2014-11-14 at 14.10.38

reactive-timer

This is the improved version of the package you will write in the book chapter 9 :) It allows you to start a interval timer and call timer.tick() in any reactive function to make it re-run in that interval. Useful for relative timestamps you want to keep updated like 10s ago.

storage

Thats a simple reactive wrapper for local storage, means it stores the objects in local storage, but a t the same time, when they change re-run all functions, which “.get()” them. Additionally it uses chrome.storage when used inside a chrome packaged app, when no localstorage object is available. (thats probably the only difference to the existing reactive local storage wrappers)

Thats it for now. I’ll finish up my book and keep you posted on whats to come and what i’m working on.

The current bitcoin price is 407 USD, so if you’re reading this in the future 😉

  • avalanche1

    Hi, Fabian!
    I’m currently learning Meteor with your book – it’s really good and ‘almost’ easy)
    I have an comment though, for future revision of the book.
    Currently on page 141 (adding permissions); I guess, my-meteor-blog/main.js part should look like this:
    if Meteor.isClient
    Accounts.onLogin ->

    Meteor.subscribe('userRoles')

    • http://frozeman.de/ Fabian Vogelsteller

      The page number you mean is 99, right?

      Actually the ‘userRoles’ publish function on the sever should re-run when the userId changes (means when you log out), as well as when you log back in. So it should actually re-subscribe to the user roles. But your version works as well, as you re-subscribe on every login. i’ll keep it in mind.

      Thank you for the hint and thanks for reading my book!

  • Patrick Kothbauer

    Looking forward to reading your book! Any tips on writing process or how to finish a book as a first time author? Did you write everyday? Cheers

    • http://frozeman.de/ Fabian Vogelsteller

      Create an extensive outline, this helps you in the process of writing. I then took everyday in the morning 2h to write the pages.