Feb 28, 2014

Presentation: JS Legos

I'm presenting at jQuery Europe today. The talk is an adaptation from a previous blog post about resuable UI components in JavaScript. I've also given versions of the talk at jQuery San Diego and SSDG.

Slides are posted here: http://tybenz.com/presentation-js-legos

Also, I'm releasing this small open-source UI component library as part of the talk, called lego.js. It's really just meant to be a repository of more in-depth code samples of the kind of components presented in the talk. Feel free to check it out:

http://tybenz.com/legojs

Here's a recording of the talk from jQuery Europe:

Feb 25, 2014

Making Spam Cool Again

I'm an information junky. I spend hours a day on Twitter, Hacker News, UseVim, Giant Robots, DailyJS — if it's about developer-anything, I'm there. So I decided to share the wealth of links that I visit on a daily basis with the world.

Introducing spamthe.net — my very own link spammer. Follow on twitter (@spamthenet), bookmark in your browser (spamthe.net) *, subscribe to the weekly newsletter (here), or join the IRC channel on Freenode (#spamthenet).

The links themselves can be found easily by anyone else who is as obsessed with the above-mentioned resources as I am. But the fun part was building it.

I use GitHub Pages to host the site and a node.js (ew) app to update twitter and the blog simultaneously. Oh, and I wrote a bookmarklet so that I can just click a button from within a site and send it to the spammer.

The node app listens for a request (CORS of course) from the bookmarklet. The title and url are passed in the request, and the app posts to the twitter account and writes a new file into the website's repo, commits, and pushes to GitHub. Now I can share links with the click of a button. Copy + paste is so 2013.

The IRC channel is running a version of hubot that listens to spamthenet's Twitter stream and auto-posts the links. Join the channel if you feel like chatting with cool people while you wait for the links to pour in.

Click here to check out the awful source. If you're interested in helping me collect links, ping me on IRC (tybenz) or Twitter (@tybenz) and be sure to check the contributing section of the README.

Also don't forget to bookmark spamthe.net, sign up for our newsletter, follow @spamthenet, and join us on IRC. Or maybe just one of those, if you feel doing all of them would be redudant.

* I know the site has spam in the title. So here's a screenshot for all you out there who are too scared to actually click on the link:

Feb 22, 2014

Presentation: CSS Layout

I presented on new CSS Layout features at a Game and App Devs Meetup group at Adobe SF on February 4. Here are the slides for my presentation:

Finally! Layout in CSS

Here's a recording of the talk:

Feb 06, 2014

Taking advantage of sessions in Vim

A few months ago, on my daily hunt for new, useful VIM plugins, I discovered vim-startify. Startify is a beautiful and organized startup screen for VIM. It provides shortcuts into files from your working directory, a list of bookmarks to files you edit all the time, and your most-recently edited files. As I was going over its docs, I also discovered that it can list out vim sessions. I'd never read about sessions before. So I began googling.

Vim provides some commands that let you store sessions based on the current state of VIM. You can load in previously created sessions with source (just like any other vim script). The mksession command, out-of-the-box, stores every little detail about your current session — plugins, scripts, which buffers are loaded, what your tabs and windows are doing. Because of this, a mksession file can be really large and really ugly. I actually found that most of the things mksession was saving to be a bit redudant. For the most part, the scripts I want executed when I launch VIM are all present in my .vimrc. So I took the bits that I needed and starting creating my own session files by hand.

The only commands I really need in a project-specific session have to do with changing VIM's working directory, opening files into buffers, and choosing which of those buffers to edit (I usually start with two files in vertical split panes).

Here's one of my session files (vimdeck.vim):

cd ~/src/vimdeck
args lib/* lib/templates/* bin/vimdeck Rakefile Gemfile README.md slides.md
edit slides.md
vertical sb lib/vimdeck.rb

I change the working directory to the project folder, open files into buffers, then I choose which two files I want to start with (in the above case slides.md and lib/vimdeck.rb). And I can execute all of this by typing:

:source ~/.vim/sessions/vimdeck.vim

Now sessions get even cooler when you pair sessions with Startify. Startify will list all session files from a directory and provide keyboard shortcuts to execute them. I put my session files into ~/.vim/sessions and tell startify where they're located with:

let g:startify_session_dir = "~/.vim/sessions"

Now everytime I start VIM, I'm greeted with this:

Note that the first section consists of a list of numbered sessions. Startify assigns shortcut keys to them so if I want to jump into my vimdeck session, all I have to do is open VIM and hit h and it will drop me into the right directory with all of the files I want to be able to edit for that project.

Startify also provides directory-level session file detection. So it will check VIM's working directory for a Session.vim file and write out a shortcut for that session as well. Useful if you'd like to include your session file in your projects git repository.

Make sure you grab startify and start playing around with its session support. Also, hit me up on twitter if you have any questions/suggestions.

Dec 16, 2013

My Hour Of Code

This past week was code.org's first Computer Science Education Week. They set a goal of getting 10 million students worldwide to participate in an hour of code (they ended up with over 16 million). Code.org and many other participating organizations created self-guided tutorials to walk students through the fundamentals of programming.

I was able to help out at a Hickman Charter School by adding a short presentation on what code is all about. I'm extrememly appreciative of code.org's efforts to educate young people on such an important topic. Here's some photos from the event: