Sign up to get extra content & updates via email!

Thanks for signing up!
I appreciate it!

Getting data from server to client on Meteor

client-341420_640Today I’ll be writing about the easiest way of getting data from server to client on Meteor, data that is not necessarily DB related.

First lets start with the DB related data.
Usually if you want to get data from the server side to the client side on Meteor (assuming autopublish was removed of course) you’d use Publish and Subscribe:


//Publication

Meteor.publish( 'pomodoros', function() {
  return Pomodoros.find({ userId: this.userId });
});

//Subscription
Meteor.subscribe( 'pomodoros' );


//Client side jibber-jabber
Pomodoros.findOne({ userId: Meteor.userId() });


This example was taken from my Meteoro app, and it shows a simple way of getting Collection data from the server on the client side.

In the following scenario however, I was trying to get Stocks Quotes from Yahoo Finance – none DB related.
I found a meteor package called ajbarry:yahoo-finance, which is a simple wrapper for the node-yahoo-finance NPM package.
The example seemed pretty simple (I only care about snapshot for this project):

yahooFinance.snapshot({
  symbols: ['AAPL','GOOG']
  fields: ['s', 'n', 'd1', 'l1', 'y', 'r'],
}, function (err, snapshot) {
  //..
});

But I had a problem, for some reason the yahooFinance object wasn’t defined on the client side.
Later I found out the object is only available on the server side, to expose it to the client, I had to use Methods:
server/methods.js

Meteor.methods({
  getQuote: function( stockname ) {
    return YahooFinance.snapshot({symbols: [stockname] });
  }
})

And now I was able to access it via the client:

Template.stocks.onRendered(function() {
  if ( _.isEmpty(Session.get('GOOG')) ) {
    Meteor.call('getQuote', 'GOOG', function(err, result) {
      Session.set('GOOG', result.GOOG);
    });
  }
})

Template.stocks.helpers({
  stock: function() {
    return Session.get('GOOG');
  }
})

Template:

<template name="stocks">
  <h2>{{stock.symbol}}</h2>
  <ul>
    <li><strong>Name</strong> {{stock.name}}</li>
    <li><strong>Ask</strong> {{stock.ask}}</li>
    <li><strong>Bid</strong> {{stock.bid}}</li>
  </ul>
</template>

Result:

google-stock

Done!

Side Note:
There’s a small problem with the package, the node-yahoo-finance version used (0.1.4) on the Meteor package is quite outdated, and lacks the single stock snapshot (which is why the single stock had to be wrapped with [] when calling the function).

I’m considering forking the package, will try to write about it here.

Tagged with: , , , ,
Posted in Technology

ImageDock – Image Gallery plugin for WordPress with a Dock effect

Since I’m on vacation, this will be a short article (I haven’t forgotten about the Meteor tutorials, they’re coming!).

For now, let me introduce to you ImageDock, an Image Gallery Plugin for WordPress, with a cool Dock effect (similar to OSX).
Check it out in action:

The settings panel is pretty simple, letting you choose some images, after which you can add the gallery using a shortcode

This is how the gallery looks like on the front end:
screenshot-1

Settings Page:
screenshot-2

The GitHub Repo

The Plugin Page on WordPress.org

Tagged with: , ,
Posted in Technology

Meteoro – Pomodoro App on Meteor

logo

In the past 2 weeks or so, I’ve had the pleasure of working with Meteor.

Meteor is a full stack JavaScript framework, that concentrates on being intuitive, wicked fast, and seamlessly integrate between back & front end.

In the future I’ll write some Meteor tutorials & examples based on this app I’ve built.

The App’s name is Meteoro – Pomodoro App on Meteor.

Pomodoro – a time management method that works by dividing your tasks into work time and breaks:

  • Choose a task
  • Start a Pomodoro timer (usually 25 minutes), work on the task without distractions (important!)
  • Take a Short Break (5 minutes)
  • Start another Pomodoro timer
  • After 4 Pomodoros (wrong plural form, I know), take a Long Break (25 minutes)

This is a nice way to divide your tasks up to units of time, and keep track on how much time each task needed.

Meteoro gives you a super clean interface with 3 timers: Pomodoro, Short Break, and Long Break.
Together with a lovely picture of a tomato, you get to work on your stuff distraction free, and the time is clearly visible on the page AND the title field!

It’s possible to Sign In with Twitter, in order to save how many Pomodoros & Breaks you’ve done, saving the time & date for each of those is still on the TODO.

Some visuals:
info

See the App Here

See the Code Repository Here

Tagged with: , , ,
Posted in Technology

WP Plugin Packer – Create Plugin Packs for WordPress

banner-772x250WP Plugin Packer – In the past few weeks (on my free time), I developed an interesting idea of mine into a WordPress plugin called.

The concept is simple: I wanted to group together WordPress plugins, and import/export them to other WordPress websites.
I also wanted to have them in packs for the sake of order, so I could easily disable a bunch of related plugins all at once.

Current Features:

  • Arrange Plugins inside Packs (basically groups) – to better categorize your WordPress plugins.
  • Enable/Disable entire Packs – especially good if you have different plugins that are dependent on each other.
  • Import/Export Packs – you can export multiple packs, single plugins, several plugins, and import it into another WordPress installation.
  • Indication if the imported plugins are not installed – if you import Packs that include plugins that don’t exist in your WP website, WP Plugin Packer will give you a notification with a link to install them.

The export format is a simple JSON file, incredibly simple to understand.
Currently, if you’re importing plugins that don’t exist on your local WordPress website, it will simply show you a notification with a link to the plugin installation.
I tried to have the plugins install automatically in case they don’t exist (thus making the import process a single-step process), but I ran into some issues with the WordPress.org Plugin API.

There were a few problems – the plugins slugs on the WordPress.org website don’t necessarily match the local slugs (which is quite problematic), and on top of that – the way WordPress plugins are installed is still too cumbersome, complex, and will likely change in the near future.

There is also the issue of plugins that are not on WordPress.org.
This is a growing trend because of WordPress.org’s strict approval process & the fact that they still use SVN for their plugin repository (what’s up with that?!).

More and more WordPress plugins are moving to GitHub, there is even a tool – GitHub Updater, that lets you update your plugins directly from GitHub.
This is a pretty good idea, but it mainly shows that the automatic plugin installation process is far from being a stable option, so I settled with giving the user a link to install the missing plugins manually.

Some Screenshots:

screenshot-1

2 Plugin Packs, the Image Galleries plugins are missing (which is why they have a red background & there’s a warning on top with links to install those plugins).

 

screenshot

2 Plugin Packs – Basic Stuff & Social Media.

 

I’m looking forward for some feedback on this, accepting issues/feature requests in the GitHub repository: https://github.com/AZdv/wp-plugin-packer/issues

Tagged with: , , ,
Posted in Technology

Do not send me my password via Email

login-570317_640A few days ago, for the first time in literally years, I received an Email from a website i signed up to, containing the password I used to sign up.

Here’s why it’s a terrible idea:

  • Seeing my password on that Email makes me assume the password is being saved as plain text on the website’s database.
    This means, as soon as someone hacks the DB (happens to the biggest brands in the world, can happen to anyone) – my password is out.
  • The website sends an unencrypted Email – that in itself could be intercepted by someone else.
  • If my Email is hacked, and I manage to eventually get my access back, my account on that website could be easily hacked as well (without the need to reset the password, so I wouldn’t even know about it).

The simplest solution would be encrypting the password via SHA1, but SHA is now breakable.

I suggest using Bcrypt, StackOverflow goes over this (for PHP) solution and it is one of the safest way of storing passwords.
In fact, Meteor Accounts, Meteor’s default User Accounts System, uses Bcrypt out of the box!

If you do encounter a website that sends your password via Email, please submit it to Plain Text Offenders, they have a handy collection of websites that still do that.

Tagged with: , ,
Posted in Technology

Tom Wheeler is not a Dingo!

In a big, massive, amazing move, the FCC has decided to approve the Net Neutrality rules!
This would mean that internet companies don’t have the risk of paying extra to ISPs so they won’t throttle their bandwidth.
Just as a reminder if anyone thinks this is purely a theoretical subject, when Netflix was negotiating with Comcast for an agreement, they throttled the hell out of their speeds:
net speed

So this has been done before, many times actually. Today marks the day where it is (hopefully) no longer a discussion whether ISPs can limit bandwidth to specific services, just because they use a lot of it.
Imagine if YouTube got throttled back in 2005, that site would’ve been down in a matter of months.

So, in conclusion, good day for the internet as a whole, and also, time for John Oliver to apologize, Tom Wheeler is in fact, not a Dingo.

Tagged with: , ,
Posted in Technology
Welcome to KidsIL
A blog for Web Development & Technology


Check out my new series about MeanJS: Take a look at StartCast.
A podcast with the sole purpose of interviewing co-founders of Startups in Europe & around the world.


You should try Berlin On Feier, an App I built for finding the best parties in Berlin.