MarcGrabanski.com - Jack of All Trades Web Development

The Conclusion of MarcGrabanski.com

Marc Grabanski — 2011-08-02 14:06:38 UTC

Update Aug 4, 2010: After closing down this website, people have come to me with remarkable stories of how my writings touched their lives. Please tell me your story if you have one: m at marcgrabanski.com

It’s been a fun ride. I am moving onto focusing on MJG International and closing down my personal website (see description on my LinkedIn). I’ve been watching the traffic fade out and I’ll leave this website up for archive purposes, but I’m done writing on it. The purpose it served is now over.

The Road to Knowledge

In three and a half years, I went from a programmer with very little writing skills (just trying to not forget things I learned) to really being listened to by a wide range of people.

Traffic, Oh! So Much Traffic

Millions of people. I can’t imagine how many football stadiums that would fill up! Sure, all I was doing was pushing the knowledge needle forward for people through open source code, but it really sunk deep into my heart what I was doing. I took it seriously and cultivated the traffic making sure it arrived at the right destination through proper wording, titles and headings.

I deeply wanted to progress and receive the right information through my website. By helping others by writing, I progressed greatly.

Thank You, Eager Learners Around the World

I’m honored and humbled to this day by the people who are willing and happy to learn from me. I want to progress peoples’ careers. I’m not a great speaker (I need to work on that), but people listen to me and have changed their careers because of what I’ve showed or taught them through speaking and teaching.

I got to travel around the world doing workshops and speaking engagements!

Think about that. I was just a largely unknown Minnesotan (technology black hole, as I refer to it), who eventually got to receive all-expense paid trips to other countries. Makes me want to cry tears of joy and say “thank you…”

Power of Open Source

It is amazing what open source has done for the world. Open knowledge empowers greatly the earth. I created a script that took off like wildfire. To this day, the jQuery UI Datepicker is one of the world’s most utilized JavaScript / interface components which paved the way for what I’m doing now. I did what I set out to achieve.

Now I get to build user interface components for clients and companies. They’ve made $millions off components I build. It turns out creating nice UI components is mega tough to get right, but when you do they are absolutely indispensable.

Open source taught me how to do this. Thank you, open source.

Power of a Name

When I’d write an article, help someone out, or write open source code my name was being spread around the internet. Spreading your name all over the internet through open source and sharing code snippets is definitely the best way I know to build a career for yourself.

It comes down to this: do what you love to do first, display what you learn and get really good at it and the right career will find you.

This style of learning and sharing is a proven model of career success. Anybody who wants to be great (/ well known) must travel this road. To my surprise, I was put in some sort of unspoken open source hall of credibility. My open source projects gave me instant cred with anyone in the world I worked with. This is an amazing phenomenon! You can work anywhere and even chose your job. The only caveat for me that this freedom is there only if you want to stick to the things you are known for. Even though I can perform up with some of the best coders, I’ve changed now and I’m not known for what I’m best at. I’ll continue to code, but it isn’t my primary focus anymore.

In conclusion, building street cred out in the trenches is an amazing way to build a career. Show your software and improve others! It is the only surefire way of building a successful career in doing what you love.

Archiving the “Marc Grabanski” Brand

I can no longer spread my name through the internet, but I know my name lives on in the hearts and minds of many that my work has touched…and in the links to this website. ;)

Simulating Mouse Click Events in JavaScript

Marc Grabanski — 2011-07-08 18:30:05 UTC

As our interfaces get more complex, JavaScript testing is becoming more critical. With browser testing, you should get as close to native events as you can. Jörn Zaefferer recommended I check out jQuery Simulate. In my case I just needed a pure JavaScript way to simulate browser click events at a given location, so I ripped out the jQuery dependance and created a wrapper just around the mouse events.

Pure JavaScript Click Simulate

function mouseEvent(type, sx, sy, cx, cy) {

  var evt;

  var e = {

    bubbles: true, cancelable: (type != "mousemove"), view: window, detail: 0,

    screenX: sx, screenY: sy, clientX: cx, clientY: cy,

    ctrlKey: false, altKey: false, shiftKey: false, metaKey: false,

    button: 0, relatedTarget: undefined

  };



  if (typeof( document.createEvent ) == "function") {

    evt = document.createEvent("MouseEvents");

    evt.initMouseEvent(type, e.bubbles, e.cancelable, e.view, e.detail,

    e.screenX, e.screenY, e.clientX, e.clientY,

    e.ctrlKey, e.altKey, e.shiftKey, e.metaKey,

    e.button, document.body.parentNode);

  } else if (document.createEventObject) {

    evt = document.createEventObject();

    for (prop in e) {

      evt[prop] = e[prop];

    }

    evt.button = { 0:1, 1:4, 2:2 }[evt.button] || evt.button;

  }

  return evt;

}



function dispatchEvent (el, evt) {

  if (el.dispatchEvent) {

    el.dispatchEvent(evt);

  } else if (el.fireEvent) {

    el.fireEvent(‘on’ + type, evt);

  }

  return evt;

}

There is some good stuff in here, namely document.createEvent and the fallback to document.createEventObject(). As well as el.dispatchEvent and the fallback to el.fireEvent.

Here is an example of using my extracted methods to perform a simulated click.

window.onclick = function(){

  console.log(‘window clicked’);

}



var test = document.getElementById(‘test’);

test.onclick = function(){

  console.log(‘test clicked’);

}



var evt = mouseEvent("click", 1, 50, 1, 50);

dispatchEvent(test, evt);

We are just console logging here, but there is no reason you can’t hitch jQuery simulate or something like this into your current testing framework.

If you do have jQuery, you can use jQuery Simulate as mentioned above, or in the past I’ve achieved virtually the same thing with this method:

jQuery Click Simulate (without a plugin)

var $el = $(selector);

var offset = $el.offset();

var event = $.extend( $.Event( "mousedown" ), {

                                                which: 1,

                                                pageX: offset.left,

                                                pageY: offset.top

                                        });

$el.trigger(event);

Just extend a new mousedown event and set set some properties.

In jQuery 1.6 events, this is even easier.

As of jQuery 1.6, you can also pass an object to jQuery.Event() and its properties will be set on the newly created Event object.

Bonus Testing Method

Scott González also pointed me to another gem for testing, document.elementFromPoint(x, y). Browser support for elementFromPoint seems to be pretty good. With it you can determine what element is positioned in front at a given location.

Now go add some test coverage to your UI.

Exciting Features in CouchDB

Marc Grabanski — 2011-05-16 15:13:01 UTC

The deeper I get into CouchDB, the more I love it. I empathize with the thread on Quora about why isn’t couchDB more popular? started by someone who was blown away like I was when I started using CouchDB.

Quick FYI: this article is a high-level overview of CouchDB features, not a tutorial.

Ok, so what makes me so excited about CouchDB?! CouchDB is a NoSQL, schema-free JSON document storage where JavaScript can access the database directly via HTTP with no middleware required! Let me say that again…

JavaScript can access the database directly.

If you are a web application developer, you know your apps just end up being a REST interface to SQL queries that check a session for permission. I can’t tell you how many times I see application that are just mapping SQL queries to a router of some sort. Welp, no need for that if you use CouchDB (albeit it takes a lot of learning to get there).

CouchDB is HTTP / REST-based in its core.

Here is an overview of more features that make me happy using CouchDB.

Browser-based GUI

Play with your data, permissions and configuration right from the browser with CouchDB’s interface Futon.

Replication

I’ve never seen a database so simple to replicate. Just make a POST request.

{"source":"example-database","target":"http://example.org/example-database"}

And your database is replicated for you. You can even add "continuous": true and your database will sync automatically. You can also add filters to your replication to only sync certain types of data.

JSONP for Free

Update your config to allow_jsonp = true and BAM! Automatically your database is accessible cross domain for GET requests. There an even a code commit recently to add support for full cross-domain XHR in CouchDB.

Changes API

Want to know if your database has been changed and update the UI accordingly? You can open a HTTP socket to /db/_changes?continuous=true and be notified as changes occur in the database. You can even apply filters to only listen for certain types of changes.

Authentication and Session Support

The Authentication features in CouchDB has certainly blown me away multiple times. Not only can you login via basic HTTP Authentication http://username:password@yourdatabase, but you can also keep authentication open via a session cookie. Ok, so we have been doing this in web applications for ever, but this is a database. POST username and password to _session and you get a cookie. =)

Security

It also has database-level security. The permissions per database are separated into readers and admins. Readers can both read and write to the database so I think they are changing the name of that, but admins can also update the _design documents in a database…you don’t want normal users to be able to do that.

Combine auth / session handling with security and you now can allow your normal users to access your database directly from the browser!

validation

The ability to validate inserts is built right into the database. You can combine with authentication to check to make sure the creator of the document is the one who is logged in.

OAuth

CouchDB supports OAuth out of the box too, so if you want to persist your authentication you get that for free too.

Map/Reduce, List and Show

Of course the most difficult hurdle to leap into CouchDB and why so many people just jump into MongoDB is the map/reduce system. You have to learn how to take a bunch of documents, emit what you need and then reduce it down based on grouping relevant data. At that point you use _list and _show methods to get whatever you need from the aggregated data.

But be forewarned…being able to map/reduce and then filter on a dataset with views takes a while to wrap your head around.

Attachments

You can attach blobs to a document and serve them directly out of CouchDB. With attachments you can serve out entire web applications with CouchDB.

Cool Projects in CouchDB Ecosystem

iOS Couchbase lets you package a local CouchDB in an iOS app. This really takes advantage of Couch’s replication and the philosophy of the project.

Geospacial indexing here we go, with GeoCouch

Need to split up your CouchDB across multiple servers? Use Lounge Nginx module

Not 100% Roses

As this guy is annoyed by 10 things in CouchDB and recently GimmeBar moved to MongoDB.

Meets My Needs

But for my needs, I love that JavaScript can interact with the database directly. I love that I get JSONP for free and soon cross-domain XHR. I’ll admit it is taking me a long time to wrap my head around map/reduce and the view / query system, but I’ve been able to do everything I need.

Where to Start?

I got started walking through the CouchDB Guide and also used the CouchDB Reference on the Wiki to dig into the specific parts of the API.

Entrepreneurs are Dead, Long Live the Hacker

Marc Grabanski — 2011-04-01 06:21:06 UTC

Society is moving at an unprecedented pace. A year ago I didn’t have the word “Android” in my vocabulary but now I use an Android phone every day. Entrepreneurs of yesterday have to wake up to this new world and realize that the rules have changed. Entrepreneurs suddenly, “cannot find good talent”. Meanwhile, hackers don’t need idea people when they are the idea people.

Inside the Hacker’s Mind

The job of the hacker is to turn ideas into reality and breathe life into the idea. Without the hacker, the entrepreneur (idea person) is dead — if hackers have their own ideas, they don’t need the typical “entrepreneur” and instead become one. CEO of companies like Etsy, Github and Facebook are all examples of this.

This has created such an environment that many entrepreneurs come to me and ask, “Where are all the developers, it is really hard to find good developers these days.” I am forced to tell them the brutal reality: “They don’t need you anymore since they’d usually work on their own ideas, so you better be able to prove you can close sales and have the cash on hand to hire them to work on yours.”

Hackers Thrive on Progress

The biggest way to interest a hacker beyond money is through providing opportunities to progress in skills. Hackers need progress daily (I’d also argue all of humanity feels this way, but most certainly hackers). Hackers need a project, or five, to hack on to improve their abilities. If you are a business owner, give hackers ways to experiment and own the success of ideas.

Entrepreneurs have only one option for thriving in today’s new society: become a hacker or find hackers and give them liberty to try out their ideas and progress.

"Are You Rich?"

Marc Grabanski — 2011-02-10 01:37:44 UTC

I wrote this article looking out the window of the cheap bedroom I’m renting, while thinking about how I planned to dump significant amount of my business’s profits into creating a conference that is free for everyone. It turned into a whopping success in terms of everyone getting great education and having a good time. If you are curious what I am talking about read coverage of the event.

Choosing Against Profit

Even though I know how to profit and am good at business, I chose not to profit from it this time and instead lose money and lots of it. I can honestly say I did this out of pure intentions without expecting anything in return. Already many good things have come of it, but one thing I know after creating the event is that the world needs more good, genuine events. We plan to do more of them.

“So you must be rich..”

In my life, I’ve had offers to do things that would seem to be the better option because it would keep the $ in my bank account. But honestly, I’m not on this earth to make money. I have dumped every dollar out of my bank account in good faith several times because I believe it is the right thing to do. Money isn’t my mission. My bar for success isn’t money so you will see me spend money in ways that go against the rules of capitalism.

I am simply trying to understand principles that make up a good person and I am trying to be that. Even if at times I have negative numbers in the bank account I am already rich in many ways.

“Negative $ but Rich? ..huh?”

Even though if you look at my bank account it shows some negative numbers, I believe more than ever I’m already rich. I can make financial decisions and could chose at any moment to not have those negative numbers exist, but what I build in peoples’ hearts and minds is more important than my temporary pain, or profit. The fact that you are even reading this says something.

I’m rich in passion to do things I love to do. I fully expect rich people to be jealous of the intangibles I have. A healthy relationship with a woman who loves me very much, a job I feel very strongly about and am good at, and connections that can bring together amazing results beyond if you tried to do the same things with cash. If I can position myself to promote good content, good people, good work, good clients, good projects and good faith that will be a job well done. Not measured by how much $ is in my account because life itself is fragile and temporal to be measured by such things.

“So..are you?”

In terms of actual dollars I am certainly not rich…but in terms of the fact that my mind, skills, knowledge and wisdom are desired by many and at any time I could decide to build something that is very profitable if I feel strongly about it then by that standard I have millions of intangible assets.

The team I have working with me is full of valuable skills and is growing into a large network full of amazing people. The skills and the team around me is a bigger bank account than anything I’ve ever possessed in my life. Entrepreneurs I’ve talked to, even well funded ones only can dream of what we are able to create together without needing money from anyone. We have the power and choice to do things that very few can do. We can create profitable relationships or even give away our talents for the greater good if we so desire, what we do is our choice.

That, my friends, is being rich with something far more valuable than gold itself.