Month: November 2014

Hood.ie

Hoodie, Part 1 – An Intro to Hoodie

Hoodie Some time ago, I was browsing Reddit or Hacker News and I came across a link to something called Hoodie. Of course, that’s an appropriate sounding programmer framework name, but what is it? In their own words, “Hoodie enables you to express yourself through technology by making web app development very fast, easy and accessible. It’s a complete backend for your apps: develop your frontend code, plug it into our API and your app is ready”.

Well, doesn’t that sound convenient? But, who is it for? Quoting their site again, they say, “Currently, Hoodie is mainly for frontend developers who want to build their own applications based on it, and for Node.js developers who want to help us extend Hoodie’s core by building plugins. Hoodie’s future goal is to be accessible for designers and people with few coding skills because we think this matters”.

Okay, well right away, some of you might lose interest because you aren’t designers and you would probably be offended if you were described as having “few coding skills”. However, I do agree with the Hood.ie team and it does seem that web development is still somewhat of a matter of privilege. I wrote a post back in May, 2013 called How Deep is the Rabbit Hole. In the post, I took issue with another blogger who was complaining about all of the things that developers had to know in order to be viable developers.

I still hold to my stance. I believe professional developers can get by knowing a few things, but as they are in the game for awhile, they will learn more and more about their craft. There is no shame in that. At the same time, if someone wants to build a simple functional application, should they have to learn the entire full stack of development – soup to nuts? We aren’t talking about “Enterprise Class™” code here. I’m talking about someone who wants to build a simple application who only knows the basics of Web UI from a design perspective. That’s who Hoodie serves and who my audience is for this series.

At the same time, if you are more of a full stack developer, it doesn’t hurt you to learn more about other tools either. While you may see Hoodie to Web Apps what Access is to Databases, that doesn’t mean that the tool doesn’t have an audience and it doesn’t mean that it hurts to have it in your tool belt to offer as potential solutions to clients or to friends.

So, how do you get started with Hoodie? First, you need to have the following prerequisites installed:

Git
CouchDB
Node.js & NPM

You can find out how to best install those for Windows, Mac, or Linux over here.

Once you have those items installed, you can just install Hoodie from the command line by typing the following:

npm install -g hoodie-cli

That’s all there is to it. You can verify that you have installed it correctly by just calling hoodie from the command line and verifying that you see output like I have here:

A successful Hoodie installation

From there, you can begin to use Hoodie by calling hoodie and passing in an application name to create. For my purposes, I’m going to create a new application called pos_example by executing the following command

hoodie new pos_example

Hoodie App Created

Doing as it suggests, once I cd into the directory and call hoodie start, I get this output.

Peters-iMac:~ pshearer$ cd pos_example/
Peters-iMac:pos_example pshearer$ hoodie start

.d$b.  .d$b.  .d$$$$$$b.    .d$$$$$$b.  .d$$$$$$b.  .d$b..d$$$$$$$$b.
$$$$$..$$$$$.$$$$$$$$$$$b .$$$$$$$$$$$b $$$$$$$$$$b $$$$$$$$$$$$$$$P'
$$$$$$$$$$$$d$$$$$$$$$$$$bd$$$$$$$$$$$$b$$$$$$$$$$$b$$$$$$$$$$$$$$$b.
$$$$$$$$$$$$Q$$$$$$$$$$$$PQ$$$$$$$$$$$$P$$$$$$$$$$$P$$$$$$$$$$$$$$$P'
$$$$$´`$$$$$'$$$$$$$$$$$$''$$$$$$$$$$$$'$$$$$$$$$$P $$$$$$$$$$$$$$$b.
'Q$P'  'Q$P'  'Q$$$$$$P'    'Q$$$$$$P'  'Q$$$$$$$P  'Q$P''Q$$$$$$$$P'

Version: 0.6.3 (node v0.10.33, npm 2.1.10, platform: darwin)

Initializing...
CouchDB started: http://127.0.0.1:6003
Waiting for CouchDB [---*--] SUCCESS 
prompt: Please set an admin password :  
WWW:    http://127.0.0.1:6001
Admin:  http://127.0.0.1:6002
Starting Plugin: 'hoodie-plugin-appconfig'
Starting Plugin: 'hoodie-plugin-email'
Starting Plugin: 'hoodie-plugin-users'
All plugins started.

[hoodie] Hoodie app is running!

You’ll notice that I had to specify an admin password and also, automatically, my browser launched to http://127.0.0.1:6001, where I was greeted with this:

Hoodie Test Page

That’s it. As an introduction, we’ve gotten started with some generic scaffolding, but next time, we’ll look at how we can leverage Hoodie to make something a little more useful.

Podcasts

Podcast Episode 28 – Are We All Narcissists? Am I?

Narcissus Here in Episode 28, I was inspired by Episode 380 of the Podcast Answerman podcast to consider whether or not tech podcasters, bloggers, writers, and speakers were actually narcissists. And, of course, there is no better place to start with those questions than in your own back yard. So, I do some evaluations on myself and share some thoughts about those results and how I believe they compare to the community at large.

Links Mentioned in this Show:
Cliff’s Narcissism Podcast
Narcissistic Personality Disorder Symptoms
The Quiz I took
APIs.io
Explain Visually

You can also subscribe to the podcast at any of these places:

Thanks to all the people who listen, and a special thanks to those who have rated me. I really appreciate it.

The episodes have been archived. Click Here to see the archive page.

JavaScript

Examining Moment.js

Moment.js Recently, I was listening to the .Net Rocks! Podcast and Miguel Castro was on talking about MVVM for the web. I only mildly care about the topic, but I like to listen to things even outside of my normal sphere of interest to broaden my range of knowledge. Another side benefit is that sometimes you get unexpected gold nuggets thrown your way. This was one of those times.

Miguel was talking about some JavaScript libraries that were popular with his circle of friends/peers and he mentioned Moment.js. I had heard the name come up in the list of all of the {{noun}}.js libraries that were out there, but never really paid it any mind. All the while, I was suffering JavaScript date pain and I didn’t have to! 😉

To get started using it, you can either download it from the link above, or you can use npm, NuGet, or bower to install it.

bower install moment --save # bower
npm install moment --save   # npm
Install-Package Moment.js   # NuGet

From there, you can just reference it into your web page. Alternatively, you can just reference it from a CD and never do the install (//cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.3/moment.js is one).

I’m starting out with this shell of a page. I made a div with the id of playground here I can write out output from Moment.js without using alerts all over the place. I’m going to wrap all of the calls to moment in the writeToPlayground method to get the output.

<html>
<head>
<title>Testing Moment.js</title>
</head>
<body>
<div id="playground"></div>

<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.3/moment.js"></script>
<script type="text/javascript">
function writeToPlayground(val) {
	document.getElementById('playground').innerHTML += val + '<br />';
}
</script>
</body>
</html>

I have this shell – including all of the code in this post – as a jsfiddle that you can access at http://jsfiddle.net/PeteOnSoftware/pe4n383h/ to help make it all as clear as possible.

To get started with moment, you just have to create a moment object and then call the format or calendar methods.

writeToPlayground("moment().format() returns " + moment().format());
writeToPlayground("moment().calendar() returns " + moment().calendar());

This gives us:
moment().format() returns 2014-11-15T08:32:47-05:00
moment().calendar() returns Today at 8:32 AM

The format method takes a format string and gives us a lot of power

writeToPlayground("moment().format('dddd') returns " + moment().format('dddd'));
writeToPlayground("moment().format('MMMM') returns " + moment().format('MMMM'));
writeToPlayground("moment().format('MM/DD/YYYY, hh:mm:ss') returns " + moment().format('MM/DD/YYYY, hh:mm:ss'));

This outputs:
moment().format(‘dddd’) returns Saturday
moment().format(‘MMMM’) returns November
moment().format(‘MM/DD/YYYY, hh:mm:ss’) returns 11/15/2014, 08:32:47

But, this isn’t just about date formatting. It also does a lot of date manipulation for you. If you need to subtract time from a date, you can write

writeToPlayground("moment().subtract(10, 'minutes').format('MM/DD/YYYY, hh:mm:ss') returns " + moment().subtract(10, 'minutes').format('MM/DD/YYYY, hh:mm:ss'));

And that outputs: moment().subtract(10, ‘minutes’).format(‘MM/DD/YYYY, hh:mm:ss’) returns 11/15/2014, 08:22:47

But, better than ALL of those things is this next little beauty. If you use .Net as a REST API, whether through WCF or through WebApi, you are probably going to be used to seeing dates returned like this: /Date(1198908717056-0700)/. This is some tainted version of a JS date that doesn’t quite conform to standards that other people are using. If you try to deserialize it in JS, it fails, with or without the -0700 part. The issue is that JSON doesn’t specify a date format, so Microsoft returns *kind of* what you’d need to parse the date. The 1198908717056 part is the number of milliseconds since the Epoch and the -0700 part is supposed to be the timezone offset. Here are some examples of what would happen if you tried to just naively parse what you got back, or if you tried to parse it after doing some manipulation.

writeToPlayground("Trying to parse that as a new Date('/Date(1198908717056-0700)/') gives back " + new Date('/Date(1198908717056-0700)/'));
writeToPlayground("Trying to parse that as a new Date(1198908717056-0700) gives back " + new Date(1198908717056-0700));
writeToPlayground("Trying to parse that as a Date without the -700 as Date(1198908717056) gives back " + new Date(1198908717056));

Gives us:
Trying to parse that as a new Date(‘/Date(1198908717056-0700)/’) gives back Invalid Date
Trying to parse that as a new Date(1198908717056-0700) gives back Sat Dec 29 2007 01:11:56 GMT-0500 (EST)
Trying to parse that as a Date without the -700 as Date(1198908717056) gives back Sat Dec 29 2007 01:11:57 GMT-0500

I’ve run into these same problems trying to parse those kinds of values in Android and iOS applications, too. Here, in the second example, JavaScript just does the subtraction first, which is why the second result is about a second behind the third result (700 milliseconds).

However, Moment.js just takes that .Net value returned and handles it like a champ.

writeToPlayground("moment(/Date(1198908717056-0700)/).format('LLLL') returns " + moment(/Date(1198908717056-0700)/).format('LLLL'));

Brings back: moment(/Date(1198908717056-0700)/).format(‘LLLL’) returns Saturday, December 29, 2007 1:11 AM

That just makes my day! If you want to know more about Moment.js, go check out its page and documentation here. If you just want to play around, go check out my JSFiddle and mess with my examples or just enter sample dates into the textbox and click the PARSE button to see what Moment.js will do with your input.

Podcasts

Podcast Episode 27 – From Slangin Burgers to Slangin Code

McDonalds, Image licensed for reuse Episode 27 finds me on a business trip and being a little introspective with this podcast. In this episode, I give my answers to two questions that I found on the web. First, “I work at McDonald’s but I want to be a professional programmer. Is it possible?” and Second, “What differentiates a programmer and a really good programmer? How is the code considered good or bad?”.

Links Mentioned in this Show:
Podcast Episode 15: Is College Worth It?
Dimecasts (Link Removed)
NSScreencast
Watch Me Code
Pluralsight
Codecademy
Iris Classon
Stackshare

You can also subscribe to the podcast at any of these places:

Thanks to all the people who listen, and a special thanks to those who have rated me. I really appreciate it.

The episodes have been archived. Click Here to see the archive page.

Pete on Software