This idea is based on the fact that open source communities suck as communities.

Seriously. No offense, but there is something called the modern social network – its where people get together online, contribute, discuss and share things with each other; that’s what I expect from a community and its sorely lacking in most open source projects. IRC just doesn’t cut it – its a chatroom for the 90′s. The forum is where newbies spam their bug fix questions. On almost all open source projects, I haven’t found a place where I can call home.

Because there is no community, there is a missed opportunity for growth. I’m not saying growth in the core of the project – you still have code contributors who communicate in their respective mastered languages (Ruby, Python, C…) and who definitely contribute – but there’s a lot of people who are writing reviews, tutorials, benchmark analysis, plugins, forks, etc. on your project, and you don’t have a place for them to ‘hang’, or even showcase their work. So, they write the plugin and then disappear from your project because there is no community. There is nowhere to stay a while, to put their plugin for show in front of the whole community and get comments, appreciation, critique, or just discussion on what they’ve done.

My idea is that open source projects should build their community, and should do it by cloning a very successful model of community building pioneered by ycombinator – creating their own reddit/digg/<project name> News. Example: JQuery News – where people can put all their latest tutorials, plugins, comparisons, tips, and more, and other members can upvote them, start discussions on them, build upon them, etc (at somewhere prominent like JQuery.com/newsfeed, not some hole-in-the-wall subreddit). Like HN does for entrepreneurs, this would create a community for JQuery-ers – all the latest new things to try out (plugins, new versions, revisions, contests, etc) would be accessibly by all users of JQuery. This would foster your community and encourage members who don’t like answering newbie questions or going on IRC to become part of the contributing class in your software project.

By building this community, I imagine that your project will grow much more than it does currently.

Hype aside, we have to admit that the wave team screwed up a bit. They built something that sounds nice but is slow and not usable – in doing so, they built a Microsoft product rather than the next big thing. However, I don’t think they screwed up too much. They acquired Etherpad relatively early, who did what the original wave team intended to do, only much better. With a fast, usable interface and a comet/polling server architecture that is actually responsive, wave will probably get the response that etherpad has had all along – wow, this is pretty awesome.

But Wave is much more than that. I think Google pushed it out prematurely because they believe that is where the next generation of websites is coming from. Wave is the first Web 3.0 app, and it centers around comet/server-side pushes.

First, lets look back at a particular side of Web 2.0 – AJAX. When Web 2.0 was first coined, arguments about AJAX’s usefulness flew all over the web. However, it wasn’t until good AJAX apps came out that it became something substantial rather than just a cool technique. Arguably, Gmail was one of those apps. It set the standard for javascript and ajax use successfully on the web.

Now after the kool-aid has worn off, its easy for a developer to see when, where and how you would use AJAX in your website. Its no longer the next new thing, but the standard.

Comet is a technique that allows server pushes, and it will be the main technology behind web 3.0. Its actually already in use in chat programs all across major social websites, but it has yet to propagate outside that realm. Etherpad is one of the awesome exceptions.

The reason that comet isn’t used right now (or even considered) by many is because the technology isn’t there. Etherpad is built on appjet, the company’s own technology (which they took offline – a shame, seeing the awesome things they’ve built on top of it). Ruby has eventmachine and python has twisted but neither of those has a newbie-friendly framework to work with (yet). Php is hopelessly lost and javascript’s server side development facilities and its event driven frameworks (nodejs) are still far too premature. But the whole comet ecosystem is building up fast. In 6-9 months, I think comet frameworks will be the next thing that first-mover developers play around with. And when the first good app (or set of apps) that uses comet for non-chat purposes comes out, the ecoystem will hit critical mass and will start to take off.

Google wave is already one of those apps.

Now, I’m not predicting that comet will take over the web as we know it – there were silly AJAX supporters who claimed AJAX everything, and that was just incorrect. I’m predicting that comet will open up a new web ecosystem, which is substantial and different enough from the current web ecosystem that is deserves a ’3.0′ tag. A lot of failures will happen initially: people experimenting with comet on everything causing mass confusion. But when people find what comet is good for (maybe pushing ads, dynamic data updates, embedded chats in social mediums, nextgen browser games, etc.), comet will be taken seriously as a new technology.

Personally I have my bets on javascript becoming the next big thing (in programming languages). It needs to get moving on its server side development efforts (go commonjs, go!) but its almost the perfect language for event driven websites.

1) Robot, meet human.

For those who haven’t watched the video – Wave allows you to build robots that can parse what you type and basically write text back (its a bit more complex than that – you’ll have to look at how they structure messaging).
With Wave robots, you have a framework for the real semantic web – humans communicating to robots (and vice versa). The goal of the semantic web was for each element of the web to contain some metadata on it for software to parse and make additional meaning out of. The real problem is with the current web structure – how does the robot receive the information? (you can’t just scrape every website). Because of this, robots are currently hard to build, hard to communicate to and from, and not part of everyday life. Google wave will change that.

2) Human, meet human.

Real time, instant keystroke by keystroke updates.
Google Wave takes away the lag time between conversations, resulting in something that feels like you’re talking. Etherpad did this, but not in such a large scale and without the multimedia element. This restores some more of the human element of socializing that has been lost through text – very important. It makes Google Wave almost compete in the social sphere. Almost. We’ll see what Robots and Gadgets come out.

3) Work Collaboration and Group Productivity.

Wave implements version control on all documents – called playback.
Collaboration is one area that Google Wave dominates almost instantly. Seeing and making changes real time in a versioned environment cuts out the collection process and speeds up group workflow tremendously. Expand version control from coding to everything other document that you make, and you’ve just hit the Wave.

4) Embedding Wave will take over comment systems.

You can embed Wave elements on any external site, and it will include all the wave user functionality (like instant keystroke transmission).
No matter where you are on the web, you can socialize with others using Wave in a way that can provide instant feedback and real time discussions (which is much better than comment systems of today). Or, just use wave like one of the existing comment systems of today.

5) Robots. Oh so many robots.
There are so many custom robots that you can think of to make your personal data accessible to you from the web. Create a robot sitting on your machine that acts like an SSH command line (pm that robot script/generate model and have it reply to you the output). Create a robot can give you every document you have on your computer in Gadget-formatted text. Create a robot to message you whenever something happens to your webservers. It reminds me of the old IRC bots, only much better. So many possibilities that make Google Wave a great protocol for Web based browser applications.

6) Extensability and Openness.

What more do I say? Open source, and specifically open sourcing Wave rocks.

7) Messaging.
Ok, so sure, it does messaging differently too. It merges threads, version control, and instant messaging together in a way that is interesting, to say the least. Its more convenient than email, but nothing I couldn’t live without (We’ll see once I try it). I doubt its an email killer – unless you count the human to human interaction part.

In short, Google Wave is much more than just email – its fundamentally changing the way we interact – with people, software, data, and more.

I’m excited to try it out and to build something with it, and I think that every developer needs to consider a Wave world and what that means.

The ending is a bit weak, but overall I think it has solid content and describes pretty accurately the state of our energy sources.

global-warming

Grid based css libraries have the benefits of rapid design, an easy learning curve, good consistency and minimal markup. They also come with a reset.css (clears default styles), free you from working in pixels and promote thinking about structure, proportions, white space, and scalability.

As an introduction, we’ll look at how to create a 3 column layout in blueprint. Lets get started.

Download blueprint.css from http://www.blueprintcss.org/ (zip next to the logo). extract it and put the blueprint folder into your css folder.

• Create an index.html file and link it up to blueprint.css:

<head>
<link rel="stylesheet" href="css/blueprint/screen.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="css/blueprint/print.css" type="text/css" media="print">
<!--[if IE]><link rel="stylesheet" href="css/blueprint/ie.css" type="text/css" media="screen, projection"><![endif]-->
<style>
.g {background-color:green;}
.b {background-color:blue;}
//g and b to visualize what we're doing and can be removed at any time.
</style>
</head>


• Add a container to the body:

<body>
<div class="container showgrid"> <!--the class showgrid is for debugging and can be removed at any time -->
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/> <!-- all further code goes in this container!!! -->
</div>
</body>


just a normal blueprint grid.

This is our grid. You can see 24 columns, some space in between each column, and some rows corresponding to the breaks that we’ve put in.

• Lets create a header. In the container after the breaks add this div:
  

<div class="span-24 last g">This is a header.</div>


span-24 means this div spans 24 columns. last means its the last one in that row, and is used to let blueprint know when to go to the next row.

a simple header to our simple website

• Lets create a 3 column layout. Since we have 24 columns, lets try 6/12/6 proportions.

<div class="span-6 g">column1</div>
<div class="span-12 b">column2</div>
<div class="span-6 last g">column3</div>

3 column layout, without many hacks, tables, or difficulties.

• Now add a footer:

<div class="span-24 last b">footer</div>


And the layout is finished.

There. The layout is done, but we still have to use css to stylize things, add in content, etc. I’ll show that in a bit, but that’s really all you need to know in order to dive into blueprint.

Before you go off playing around with it, you should look into blueprint/src, and read each of the css files, especially grid.css – they’re tremendously helpful in telling you what blueprint can do for you. Make sure you try out the push, pull, append, prepend, box, border, colborder, and hr classes, as they’re used often. Feel free to add in your own classes – I like to keep my colors as classes so that I don’t get tempted to go color picking for an hour or two.

Do note that blueprint may break if you try to stylize in the same div that you do layouts with. So, don’t do:

<div class="span-10" style="border 1px solid black;"> some content</div>

and instead do:

<div class="span-10"><div style="border 1px solid black;">some content</div></div>

an extra layer, but overall still nothing as bad as tables.

I’ll leave you with a somewhat stylized form of what we had previously. Blueprint has great samples and test pages that show you exactly what it can do for you, so you should check that out. Their sample page shows just how trivially easy it is to nest columns within columns, creating as complex a layout as you want.

Final look: I added in a simple list on the left, a table on the right, a box class for the header, some hr’s, and some lorem ipsum.

Final look of the site! Simple stuff, really...


<head>
<link rel="stylesheet" href="css/blueprint/screen.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="css/blueprint/print.css" type="text/css" media="print">
<!--[if IE]><link rel="stylesheet" href="css/blueprint/ie.css" type="text/css" media="screen, projection"><![endif]-->
<style>
.g {background-color:green;}
.b {background-color:blue;}
#g and b to visualize what we're doing.

</style>
</head>
<body>
<div class="container">
<div class="span-24"><h2 class="box">This is a header.</h2></div>
<hr>
<div class="span-6"><ul style="text-align:right;">
<li><a href="#">This</a></li>
<li><a href="#">is</a></li>
<li><a href="#">my</a></li>
<li><a href="#">friendly</a></li>
<li><a href="#">navigation</a></li>
<li><a href="#">bar.</a></li>
</ul></div>
<div class="span-12"><div style="padding:20px;border:1px solid #d6d6d6;"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse est justo, tincidunt eu, ornare ornare, vehicula id, augue. Proin eu elit. Curabitur dignissim blandit augue. Nam dui nisi, convallis ac, hendrerit at, commodo et, dui. Maecenas consequat, felis eleifend gravida pellentesque, neque purus venenatis tellus, a rhoncus tortor lectus non nisi. Proin sodales, ante faucibus tempor tincidunt, risus leo iaculis velit, sed aliquet sem lacus eget purus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec vestibulum turpis ac neque. Maecenas suscipit orci non nibh. Donec tristique. Donec nec diam ut odio fermentum auctor. Nullam molestie sapien.
</p><p>
Nullam vel quam nec nisi luctus bibendum. Praesent lobortis dui eu augue. Phasellus consectetur, erat a condimentum hendrerit, sem massa elementum neque, sit amet elementum justo ligula vitae nunc. Cras rhoncus libero id purus. Aenean nulla enim, placerat nec, tincidunt id, gravida sit amet, erat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nullam eleifend dolor. Integer massa magna, dignissim ut, semper sit amet, laoreet id, magna. Cras convallis ligula sit amet sapien. Mauris blandit elit sit amet leo.</p> </div></div>
<div class="span-6 last">
<table>
<tr><td><a href="#">This</a></td></tr>
<tr><td><a href="#">is</a></td></tr>
<tr><td><a href="#">Navigation</a></td></tr>
<tr><td><a href="#">Done</a></td></tr>
<tr><td><a href="#">in</a></td></tr>
<tr><td><a href="#">Tables</a></td></tr>
</table>
<div class="box">This is an advertisement!!!<br/><br/><br/><br/><br/><br/><br/><br/><br/></div>
</div>
<hr>
<div class="span-24 last"><div style="text-align:right" class="large">and finally a footer. (c) 2009 by... wait this took less than 15 minutes.</div></div>
</div>

2 great plugins I would recommend: Explorer and html tags. Explorer provides a file structure on the left hand side, with all the features you would expect from a file navigation. Html tags provides a nice functionality, select tag and all content in tag. I tend to use this alot.

The new notepad++ only supports unicode plugins, so I can’t use a lot of the other plugins out there. One more plugin that I use that is unofficial is the colorpicker plugin – its not unicode, but someone did a quick hack to make it unicode. The unicode version is here if you want to try it out.

Arch woke up with the painful realization that he was still alive. He was fine with that – he enjoyed being alive – but it felt as if every nerve on his body was on fire. He nudged his hand upward, felt the pain shoot up his arm, and decided he was better off not moving. He opened his eyes to a well lit hospital room; sun shone through the window, highlighting a flower vase on the sill, and in the far corner, a doctor was looking at a clipboard, back turned talking quietly to a couple sitting next him. The couple looked to be in their mid 40′s – probably the family that rescued me, Arch thought.

“I must have been hit by a truck or something,” Arch mumbled as he acknowledged his consciousness.
The doctor turned to look at him, and the couple stood up.
“Not quite, Arch.” the doctor said. “You’ve suffered a concussion, 15 bee stings, partial drowning and a sprained ankle. You have a slight fever right now, but nothing serious. Give it a week or two and you should be back to normal.”
“Arch, do you feel ok?” the woman asked.
“Just hurting. What am I drugged up on?” Arch asked.
The doctor flipped a page up and scanned his clipboard. “Just an IV. We’ll get you on painkillers shortly if you’re hurting a lot.”
“Please do.” Arch stared blankly into the ceiling. He tried to recall the events that caused his current state, but nothing came up. He looked at the couple in the corner.
“Oh. You’re my parents, right?” he asked. His father and mother stared at him incredulously.
“Doc, I think I have some memory loss – all of it actually. Also, can I get something to eat? I’m really hungry.”

one for ruby and one for rails.

download: (rename it ruby.xml and erb.col)

ruby_xml

erb_col

After it is downloaded, goto (in eclipse) Window->preferences, Ruby, Editor, Syntax color, import, Aptana, edit, erb, colors, import. Read the top, and click on Text Editors, and change the background to black.

Enjoy.

The software you need:

rails, of course.

msysgit – git for Windows

Putty (use this installer)

Step 1: Install heroku gem

open up your command line and type “gem install heroku“

Step 2: create your public and private rsa keys

This is part you may have to google random errors that you find – follow the directions and you should be (mostly) fine.

Open puttygen (from Putty)

Click generate.

Generate some randomness as per instructions.

Add a passphrase.

Click “Save private key” and save it as “heroku_key.ppk“

now, create a new file called C:\documents and settings\(username)\.ssh\id_rsa.pub

open that new file in Notepad (or some other text editor)

paste the contents of the greyed out box (under public key for pasting…) into id_rsa.pub

save and close it.

Now, open pageagent.exe in PuTTY

add a key and browse to heroku_key.ppk.

type in your password.

You’re almost done.

Finally, right click on My Computer, and goto properties, advanced, environmental variables.

Click “new” in system variables.

Add this in:

Variable name: GIT_SSH

Variable value: “C:Program Files\PuTTY\plink.exe”

Phew. Step 2 complete.

Step 3: testing GIT

Open git_bash first, and goto your rails application folder

type “git init“ to initialize a git repo (its just standard procedure)

type heroku create <throwawaytestapp>

heroku will give you a git link

type git clone <link> — it will be something like git@heroku.com:appname.git

IF you get errors:

Error 1) fatal: can not fork (or something like that)

open up git gui and try to add a new repository (URL= link, directory= your rails directory)

if that fails, you need to tweak your system variables. Try lots of things; try adding the putty directory to the PATH variable, or try adding GIT_SSH to your username variables

git gui to test until it works

2) It leads you to a page where you have to type y/n and you can’t TYPE!!!

Don’t panic. open up a console and type “plink git@heroku.com“

enter y

retry it in the git bash.

if all works well, you’re connected to heroku on windows! pat yourself on the back.