Thoughtless Banter – John Bellone

Programming

May

Towards A Better Code Editor

Posted by JB at 10:35 pm

Most of my day is spent staring at the blinking cursor of my text editor. This is true for many people nowadays as most office work happens on the computer, but for programmers – the very same individuals whose creativeness are the building blocks for software – can’t seem to find a workflow that feels right. As a developer I find myself getting frustrated every time that I have to reach across my desk for a mouse, switch to a separate application to look up some documentation, or drop into a terminal window for some quick bash kung-fu. I am a firm believer of using the proper tool for the job, but I have been writing code for over ten years now and have yet to find something that fits the purpose.

Most web and application developers that I know are using proficient in many text editors. The editor that they are using is either a result of the product that they are working on, or past experience using a particular piece of technology (extension, script, plugin, etc) that makes the daily grind a little better. I rarely find a developer who doesn’t have a problem with some facet of the text editor that they are using, and many of which feel that they are stuck for one reason or another with a particular editor because of the feature set it offers.

One thing that seems to be a common theme among these editors is that they sit somewhere between a simple text editor, providing only basic functionality of text formatting, and a full-blown suite of tools which is offered by enterprise packages such as Microsoft’s Visual Studio which costs thousands of dollars and only works on the Windows platform. Each has its specific use case, and I would never suggest creating a Visual Studio project file to edit a README file using the Markdown syntax, but every time that I have the opportunity to use Visual Studio I always walk away feeling let down the next time I drop into Emacs.

A key feature that I think is necessary in a development environment is the ability for the software package to support live documentation. This means that I want to be able pull up a quick blurb about a particular API call that I am about to make, either be it in a standard library that ships with the language of my choice, or the application project that I am working on. The discoverability of documentation needs to be in depth, but not something which clutters my code window.

The editor software needs to be able to be extended on a per project basis. There are often cases where a particular set of tools is necessary for one web project, let’s say something like CodeIgniter which uses the Sparks package management system, and another application that is written with Ruby on Rails and using the RubyGems system for extensions. And it is not merely easy just to say that all PHP applications will use the mode for PHP, and all the Rails projects will use the mode for Ruby, because often there is a frontend component which shares context between the two and is written in a language such as JavaScript (or more recently, Clojure).

Testing each project now becomes an absolute pain in the ass. I may need to manage the version of Ruby that I am running, or perhaps bounce the Apache instances so that my new configuration is picked up, or even worse the web application needs to be executed from a browser, I need to tail a log file, and pray that the browser debugging software is updated. That’s way too many context switches.

I believe that there can be a much better way of handling the day to day workflow of software development. There is a simple solution to this problem that seems to have been overlooked with fancy editors designed to be visually pleasing on the Mac. What do you think your ideal development environment would be? All developers hate writing documentation, but it is the first that we reach for when we want to understand how to work with a library or call a standard API. We cry out aloud when our text editor doesn’t index the code that I am writing and provide autocomplete. And we bitch when extending the editor becomes a chore which sometimes rivals the problems we’re trying to solve.

There is a better way to handle this.

Apr

Javascript Game Development

Posted by JB at 8:24 pm

About a week or so ago I came across a blog post which redirected me to the Mozilla’s BrowserQuest project. The free multiplayer game, which is completely built with web technologies, was introduced as a demonstration of what we can expect to see in the upcoming years for web-centric game development. BrowserQuest was developed using a mixture of HTML5, CSS3, and Javascript (client and server) to create a multiplayer game that can be experienced wholly through an up-to-date web browser.

The first few days that I was trying to play the game Mozilla’s servers must have been swamped. I was unable to actually get beyond the initial screen, but thankfully Mozilla posted the source code for both the client and server, completely written in Javascript and available on Github, so I was able to satisfy my technology curiosities. The past few years with the introduction of more powerful, freely available, open source Javascript engines such as Mozilla’s own SpiderMonkey and Google’s V8, have paved the way for a language which is interoperable with C/C++ to be easily embeddable and integrated with existing application systems. Node.js was made available to quickly build scalable event-driven servers that can power whole service-oriented backends, and this is precisely the same technology used in BrowserQuest.

This brings me back to my roots. When I was younger what brought me into the realm of programming was both web development, and text-based roleplaying games. Along with a few friends I ran what is commonly referred to as a MUD, or Multi-User Dungeon, a small application which ran on a remote machine allowing players to connect over the Internet. This game was completely driven by text; movement, combat, and storytelling were all expressed with text, sometimes an emphasis using bold and italic font styles, by the time that I got to the game coloring was available as well, but the game itself was completely driven by imagination.

I can see myself getting back involved in a community developing a game that is available for players to connect to, quest with their friends, and being there to generally provide an escape, an alternative, to the high-priced, resource demanding, massive multiplayer games that exist such as Star Wars and World of Warcraft. I can’t wait to see what the development community comes up with, and I hope that I find the time to participate in what I believe to be the reemerging platform that will hopefully spark a new generation of programmers willing to tinker, hack, and make some awesome art.

Nov

Social Integration: Tweeting, +1 and Like

Posted by JB at 11:20 pm

You may have noticed that there are several websites now that included integration with social networking websites such as Facebook, Google Plus and Twitter. These small buttons allow your user’s to share content instantly with their friends. Depending on which you’re including on your site it’ll show up differently, and each has a separate process to include them on your blog’s pages. Since I am using WordPress I will explain how to do this, but if you follow the example it should work in the broad case as well.

This functionality is provided by using meta information that is stored on the user’s browser. Unless you decide to do something nefarious, you do not have to their data by merely adding these buttons, but it does expose your user’s to a potential security risk. There are browser plugins that allow them to turn off this functionality if they have it enabled. If you’re comfortable with all this, then go on ahead and follow the instructions.

A useful wizard is available that provides you with both the XHTML and Javascript necessary to make this functionality work correctly on your site. The Javascript code snippet provides the bridge between the user’s browser and the Facebook social graph that this is using in the background. There are a few routes regarding how to implement it, I chose the HTML5 approach which asked me to add a schema namespace to the HTML element, and then used the custom like button element that is provided to display it.

Javascript snippet Place this after your BODY element

<script src="//connect.facebook.net/en_US/all.js"></script>
        <div id="fb-root"></div>
        <script>(function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) {return;}
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=309698452382243";
        fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));</script>

HTML element Place this where you want the button to appear.

<fb:like href="http://example.com" send="true" layout="button_count" show_faces="true" action="recommend" font="lucida grande" display="inline"></fb:like>

You will be given the exact HTML element tag that you should use based upon your wizard settings. If you want to use this dynamically in the WordPress Loop to display under each post you’ll have to use a PHP function the_permalink(); which will return the URI to the page in question. This can also be done on the single pages if you so desire. One last step is to include meta information at the top of each page to let Facebook know how the post should be described in the user’s activity feed. This is very straight forward and simple. An optional title element should be used on individual pages. Categories can be selected through the wizard.

Meta information Place this in the HEAD element

<meta property="og:type" content="blog" />
<meta property="og:site_name" content="Thoughtless Banter" />
<meta property="fb:admins" content="199800257" />

The Google Plus approach is very similar, and doesn’t require any meta information tags. When a user decides to “+1″ any of your posts they will in a special location on that user’s profile, and in any the subscriber’s feeds as well. You’ll need to include a Javascript snippet, like above, and a special HTML tag element. You can add all of this below the Facebook directives if you desire.

Javascript snippet Place this after the BODY element.

<script type="text/javascript">
  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script>

HTML element tag Place this where you wish the button to appear.

<g:plusone href="http://example.com" size="medium" annotation="inline"></g:plusone>

Finally, the Twitter button is the easiest to place, and they once again provide a wizard for you to change the colors of the background, design, and number of tweets you wish to show (if you do not just want a button, but rather the feed itself). This one-liner can be placed anywhere you want the button to appear.

<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://thoughtlessbanter.com/2011/11/23/furniture-for-men/" data-text="Furniture For Men" data-count="horizontal" data-via="johnbellone">Tweet</a><script type="text/javascript" src="//platform.twitter.com/widgets.js">

That should basically the gist of how to get this functionality working on your website. Facebook offers more comprehensive widgets that take advantage of the social graph to display photos, and even information about user’s actions on your page. There is beta examples of how to post directly to the new Facebook Timeline feature that will be rolling out to your profile shortly. As more and more of these snippets become available you should consider both the advantages and the disadvantages of using them. I know that many user’s are worried about privacy and tracking that all the social sites are beginning to do. It is quite possible in the future that this type of functionality will be opt-in rather than opt-out and it may not work with the breadth of your user’s without their explicit consent. So be wary designing your website around these widgets specifically.

Nov

Visual Studio, WPF and XAML

Posted by JB at 5:30 pm

The last time that I touched C# was about four years ago. I had just finished my first semester at NJIT as a sophomore transfer, and I took a summer course with Daniel Boston where we developed a payment gateway for the Vector newspaper. Since neither of us had ever used any of the .NET languages, and one of our requirements was that this had to run on a Windows server, we figured it would be a very good learning experience. We taught ourselves the ASP.NET and C# syntax in only six weeks, working tirelessly during the nights over Skype (we both had summer jobs), to complete our project on time and present it to the class. Needless to say, we succeeded, but got burned a few times by how much a pain in the ass ASP.NET was back then.

A couple of weeks ago I had the opportunity to get familiar with one of our developer tools at my day job, which is written with C# and WPF, and I have to say that I am quite impressed. Microsoft has identified a key point in the application development pipeline, and as far as I can tell, made a valiant attempt at solving it: the user interface should not be tied directly to the application (business) logic, and using WPF with XAML you give designers the ability to modify the layout of the application through the use of themes. This approach is very similar to how the web development process, through the use of HTML and CSS, allows for web designers to not affect the application logic that sits in the “backend.”

WPF 4 Unleashed

This has been a huge help learning WPF and XAML.

I haven’t yet spent enough time with WPF 4.0, but from what I can tell this is the way to be developing all future Windows-based applications. After a little searching it unfortunately looks like that the team behind Mono will not be supporting WPF in the near future. It would be nice to be able to use XAML and C# to quickly develop cross-platform applications which would use the native API for each platform. That means Aqua for Windows (Vista/7), Cocoa for Mac OS X and either Gnome or KDE for Linux/Solaris/Unix. Not to mention each time that I get a chance to use Visual Studio I feel like any other software development IDE pales in comparison, but I have felt that way for awhile now.

If you’re interested in getting your hands into WPF 4.0, XAML, and the whole caboodle, head on over to Amazon.com and pick up Adam Nathan’s WPF 4: Unleashed which is the first programming book that I have seen that has high quality, full color, code samples. You won’t be disappointed!

Jul

C++ Async HTTP Server

Posted by JB at 12:00 pm

A few days ago to the sweet, sweet melodies of Billy Joel, I woke up in the wee hours of the morning to code up a very crude C web server. Of course, I tried to pass it off as a C++ implementation, but in reality I was pulling the wool over your eyes – the only C++ was used to build error messages, and the actual message to send down to the client. Not to mention it was a very crude, basic, implementation of socket handling in C. Nothing fancy.

Yesterday I was talking with some kind folks at the re:build 2011 conference in Indianapolis, and it got me to thinking that there aren’t enough examples of C++ applications talking to the web. You know, actual C++, using the boost libraries and what not. So this morning, after grabbing my amazing breakfast burrito at Henry’s in downtown Indianapolis I scoured the Internet and re-wrote my example application in Boost.Asio.

The code is much simpler, straight forward, and just damned better to look at. As always it is up and available at my Github account for consumption. If you’re interested in seeing the actual difference in implementations than go no further than right here.

I have a few more ideas on web services written in C++, but that’s for another day. Let me know if you have any questions. As always, enjoy the code and report any bugs.

Jul

C++ Web Server

Posted by JB at 6:54 am

C++
nginx

So, this morning I couldn’t sleep, and around 4:00AM I started messing around with nginx, fastcgi and C++. For awhile now I have been considering the feasibility of an extendable and reusable framework for serving up web content from C++ applications. Of course, all you web programers want to write code in Javascript and Ruby, but sometimes there are applications that can be core to a company that do not need to (or should not) be rewritten merely to service a different type of client. I wrote a little test program that I threw up on my Github.com account.

That’s my reasoning for developing this simple proof of concept application. I didn’t want to actually download the fastcgi libraries that exist for C, mainly because it was 4AM and I am a lazy fuck, so I decided to write up something simple with accept(), recv() and send(). The actual configuration for nginx is quite simple, you can just use their example for proxying to an Apache web server.

For those of you that are just as lazy as I am, click on this big bad beautiful link, and enjoy the show. Later, at some point, I will write up my thoughts on how an actual framework to solve this problem may work (and look), but right now I need to take a shower and go to work.

Mar

Type Aloud Launch

Posted by JB at 9:43 pm

After talking about it for several years now, telling my friends (and family) that I would eventually get around to doing it, and working through some good times (and hard ones) to get it ready, I am both happy and relieved to flip the switch for registration on the Type Aloud. I spent the night putting the final touches on the release candidate while watching Arnold bust some ass in Eraser.

Type Aloud has been a dream of mine for at least four years now. I envisioned a writing and reading community where people will not only be able to share their stories (and poems) but also get collaborative feedback for both editing, and hopefully, print publishing. Some of the most intriguing writing I have read came from people that were not published professionally. I look forward to being able to read (and write!) much more than I have in the past with this service. My primary goal is not to be profitable: Type Aloud is a service that I want to use myself. I am a lucky man if I am able to break even.

For those of you that consider yourselves an amateur writer, or anyone who has the itch to tell a good story, please head on over to Type Aloud where you can sign up and begin writing! Over the next couple of weeks I am going to start posting some of my own work, and I will be (trying) to get some local writers to do the same. The more, the merrier.

Now its time for me to go to bed.