Trying something new .. HAML... I saw it a couple years ago, I was like "ehh.. umm.. nah" ... But working on the DevChix site, it seems like it will be our choice instead of erb for templates so I thought I'd give it a try.

So here's some straight up html + erb

RUBY:
  1. <h1>Listing users</h1>
  2.  
  3. <table>
  4.   <tr>
  5.     <th>Username</th>
  6.     <th>Email</th>
  7.   </tr>
  8.  
  9. <% @users.each do |user| %>
  10.   <tr>
  11.     <td><%=h user.username %></td>
  12.    <td><%=h user.email %></td>
  13.     <td><%= link_to 'Show', user %></td>
  14.     <td><%= link_to 'Edit', edit_user_path(user) %></td>
  15.     <td><%= link_to 'Destroy', user, :confirm => 'Are you sure?', :method => :delete %></td>
  16.   </tr>
  17. <% end %>
  18. </table>
  19.  
  20. <%= link_to 'New user', new_user_path %>

And same with haml:

RUBY:
  1. %h1 Listing users
  2.  
  3. %table
  4.   %tr
  5.     %th Username
  6.     %th Email
  7.  
  8. - @users.each do |user|
  9.   %tr
  10.     %td
  11.       = user.username
  12.     %td
  13.       = user.email
  14.     %td
  15.       = link_to 'Show', user
  16.     %td
  17.       = link_to 'Edit', edit_user_path(user)
  18.     %td
  19.       = link_to 'Destroy', user, :confirm => 'Are you sure?', :method => :delete
  20.  
  21. = link_to 'New user', new_user_path

I am not totally sold, but.. it is an interesting kind of markup!

Let me know if you see a better way to write it or if you prefer another markup language!

Call me crazy, but this is why I classify myself as a language geek. When I learn something fascinating, i wonder hmm how can I do that with X language? My last post I did an example of the Builder pattern as described in Effective Java by Joshua Bloch. The main motivation for me to use Builder is to have flexible parameter lists, without worrying about order of parameters (there are a few other reasons outlined in the book, but this is what I find cool).

Its too easy.

My class:

RUBY:
  1. class Address
  2.   attr_accessor :street, :street2, :city, :state, :zip, :address_type
  3.  
  4.   def initialize(&block)
  5.    
  6.     #set default values
  7.     self.city = "Chicago"
  8.     self.state = "IL"
  9.    
  10.     #set value from block
  11.     instance_eval &block if block_given?
  12.  
  13.   end
  14.  
  15. end

And the usage of it:

RUBY:
  1. def testDefaultValues
  2.     myaddress = Address.new
  3.     assert_equal("Chicago", myaddress.city)
  4.     assert_equal("IL", myaddress.state)
  5.   end
  6.  
  7.   def testStreetStateZip
  8.     myaddress = Address.new do
  9.       self.street = "this is the street"
  10.       self.zip = "11111"
  11.     end
  12.     assert_equal("Chicago", myaddress.city)
  13.     assert_equal("IL", myaddress.state)
  14.     assert_equal("this is the street", myaddress.street)
  15.     assert_equal("11111", myaddress.zip)
  16.   end

Wow, huh? Compare to

JAVA:
  1. public void testBuilderDefaults() {
  2. Address expected = new Address.Builder("Chicago", "IL").build();
  3. assertEquals("State is IL", "IL", expected.getState());
  4. assertEquals("City is Chicago", "Chicago", expected.getCity());
  5. }

then the optional params are chained to that:

JAVA:
  1. public void testBuilderStreetStateZip() {
  2.    Address expected = new Address.Builder("Chicago", "IL").street("this is an address").zip("11111").build();
  3.   assertEquals("this is an address", expected.getStreet());
  4.   assertEquals("11111", expected.getZip());
  5.   assertEquals("IL", expected.getState());
  6.   assertEquals("Chicago", expected.getCity());
  7. }

Full source for Ruby (though I was able to paste it all here!)
Address class in ruby | Address test in ruby

And for Java, if you want to compare ...
Address class in Java | Address test in java

Yes... sometimes its hard not to gloat. :-D

yeah yeah yeah, its not really "fair" to compare strongly typed languages... but as I said, my motivation is to have easy parameter lists without having to remember specific ordering of params for constructor or use multiple set methods.

I have been reading Effective Java by Joshua Bloch and learned something new so I wanted to try it out.

Making long parameter lists in your constructor is not fun and prone to errors. Previously I thought that best way to handle this situation was to make a bunch of setter methods. This can get kind of tedious and hard to follow when there are alot of parameters:

JAVA:
  1. Address myaddress = new Address("Chicago", "IL");
  2. myaddress.setZip("44422");

Using a Builder object:

JAVA:
  1. Address myaddress = new Address.Builder().city("Chicago").state("IL").zip("44422").build();

Using a builder class allows you to specify params in any order too!

Here is the source code for my Address class with Builder. The builder is implemented as a nested class since it will only be used by the Address class.

Address class with Builder

Test for Address class

The required parameters are set in the Builder constructor:

JAVA:
  1. public void testBuilderDefaults() {
  2. Address expected = new Address.Builder("Chicago", "IL").build();
  3. assertEquals("State is IL", "IL", expected.getState());
  4. assertEquals("City is Chicago", "Chicago", expected.getCity());
  5. }

then the optional params are chained to that:

JAVA:
  1. public void testBuilderStreetStateZip() {
  2.   Address expected = new Address.Builder("Chicago", "IL").street("this is an address").zip("11111").build();
  3. assertEquals("Address is this is an address", "this is an address", expected.getStreet());
  4. assertEquals("Zip is 11111", "11111", expected.getZip());
  5. assertEquals("State is IL", "IL", expected.getState());
  6. assertEquals("City is Chicago", "Chicago", expected.getCity());
  7. }

The book goes into more discussion that I haven't quite wrapped my head around yet, but this is interesting stuff .. even though it is java ;)

I was pretty excited to find UiHandler, it makes the organization of code so much cleaner!

I am putting in the full code for both, so you can see the beauty for yourself! Pay attention to the comments where i put the gotchas that got me at first! :)
Before:

JAVA:
  1. package com.rubygeek.sandbox.client;
  2.  
  3. import java.util.ArrayList;
  4.  
  5. import com.google.gwt.core.client.GWT;
  6. import com.google.gwt.event.dom.client.ClickEvent;
  7. import com.google.gwt.event.dom.client.ClickHandler;
  8. import com.google.gwt.uibinder.client.UiBinder;
  9. import com.google.gwt.uibinder.client.UiField;
  10. import com.google.gwt.user.client.Window;
  11. import com.google.gwt.user.client.ui.Button;
  12. import com.google.gwt.user.client.ui.CheckBox;
  13. import com.google.gwt.user.client.ui.Composite;
  14. import com.google.gwt.user.client.ui.Widget;
  15.  
  16.  
  17. public class LanguageList extends Composite {
  18.  
  19.   interface MyUiBinder extends UiBinder<Widget, LanguageList> {}
  20.   private static MyUiBinder uiBinder = GWT.create(MyUiBinder.class);
  21.  
  22.   @UiField CheckBox rubyCheck;
  23.   @UiField CheckBox pythonCheck;
  24.   @UiField CheckBox javaCheck;
  25.   @UiField CheckBox phpCheck;
  26.   @UiField Button button;
  27.  
  28.   public LanguageList() {
  29. // bind XML file of same name of this class to this class
  30. initWidget(uiBinder.createAndBindUi(this));
  31.  
  32. final ArrayList<CheckBox> boxes = new ArrayList<CheckBox>();
  33. boxes.add(rubyCheck);
  34. boxes.add(pythonCheck);
  35. boxes.add(javaCheck);
  36. boxes.add(phpCheck);
  37.  
  38. // add button and handler to alert the values of checkboxes
  39. button.addClickHandler(new ClickHandler() {
  40. public void onClick(ClickEvent event) {
  41. String output = "";
  42. for(CheckBox box : boxes) {
  43. if (box.getValue()) {
  44. output += box.getFormValue() + ", ";
  45. }
  46. }
  47. Window.alert("You checked: "+ output);
  48. }
  49. });
  50.  
  51.   }
  52. }

After:

JAVA:
  1. package com.rubygeek.sandbox.client;
  2.  
  3. import java.util.ArrayList;
  4.  
  5. import com.google.gwt.core.client.GWT;
  6. import com.google.gwt.event.dom.client.ClickEvent;
  7. import com.google.gwt.uibinder.client.UiBinder;
  8. import com.google.gwt.uibinder.client.UiField;
  9. import com.google.gwt.uibinder.client.UiHandler;
  10. import com.google.gwt.user.client.Window;
  11. import com.google.gwt.user.client.ui.CheckBox;
  12. import com.google.gwt.user.client.ui.Composite;
  13. import com.google.gwt.user.client.ui.Widget;
  14.  
  15. public class LanguageList extends Composite {
  16.  
  17.   interface MyUiBinder extends UiBinder<Widget, LanguageList> {}
  18.   private static MyUiBinder uiBinder = GWT.create(MyUiBinder.class);
  19.  
  20.   final ArrayList<CheckBox> boxes = new ArrayList<CheckBox>();
  21.  
  22.   @UiField CheckBox rubyCheck;
  23.   @UiField CheckBox pythonCheck;
  24.   @UiField CheckBox javaCheck;
  25.   @UiField CheckBox phpCheck;
  26.  
  27.   // add ClickEvent handler to button with ui:field="languageButton" in the UiBinder code    
  28.   // !!! note no ; at end of this annotation, and the name of function does not matter, its the annotation that ties it to the
  29.   // body of the method, also this does not go inside the class :) (i spend 40 mins figuring that out...)
  30.   @UiHandler("languageButton")
  31.   void doClick(ClickEvent event) {
  32.       String output = "";
  33.       for(CheckBox box : boxes) {
  34.           if (box.getValue()) {
  35.               output += box.getFormValue() + ", ";
  36.           }
  37.       }
  38.       Window.alert("You checked: "+ output);
  39.  }
  40.  
  41.   public LanguageList() {
  42.       // bind XML file of same name of this class to this class
  43.       initWidget(uiBinder.createAndBindUi(this));
  44.       
  45.       boxes.add(rubyCheck);
  46.       boxes.add(pythonCheck);
  47.       boxes.add(javaCheck);
  48.       boxes.add(phpCheck);
  49.   }
  50. }

See the constructure is further slimmed down!

Note: as of right now, you can only get this feature in Trunk. see here for how to download the source and use it More Info on release

One of the great new features coming out of GWT 2.0 is UiBinder, a way to make a declarative UI without making tons of objects. Reminding you of swing? Yeah, I didn't sign up to be a Swing developer. I was sort of disturbed when I started doing gwt and was writing tons of java to just do simple HTML things.

Full Source

JAVA:
  1. CheckBox rubyCheck = new CheckBox("Ruby");
  2. rubyCheck.setFormValue("ruby");
  3. boxes.add(rubyCheck);
  4.  
  5. CheckBox pythonCheck = new CheckBox("Python");
  6. pythonCheck.setFormValue("python");
  7. boxes.add(pythonCheck);
  8.  
  9. CheckBox javaCheck = new CheckBox("Java");
  10. javaCheck.setFormValue("java");
  11. boxes.add(javaCheck);
  12.  
  13. CheckBox phpCheck = new CheckBox("PHP");
  14. phpCheck.setFormValue("php");
  15. boxes.add(phpCheck);
  16.  
  17. // set up panel
  18. Panel panel = new VerticalPanel();
  19. panel.add(new Label("Choose a language:"));

Compare to the UiBinder code:

XML:
  1. <ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
  2.     xmlns:g='urn:import:com.google.gwt.user.client.ui'>
  3.     <g:VerticalPanel>
  4.       <g:Label>Choose a language:</g:Label>
  5.       <g:CheckBox ui:field="rubyCheck" formValue="ruby">Ruby</g:CheckBox>
  6.       <g:CheckBox ui:field="pythonCheck" formValue="python">Python</g:CheckBox>
  7.       <g:CheckBox ui:field="javaCheck" formValue="java">Java</g:CheckBox>
  8.       <g:CheckBox ui:field="phpCheck" formValue="php">PHP</g:CheckBox>
  9.       <g:Button ui:field="button">Submit</g:Button>
  10.     </g:VerticalPanel>
  11. </ui:UiBinder>

It is somewhat like HTML, each item with attribute "ui:field=" is the reference to the object that gets created in Java. Here's the Java code that uses this:

Full Source

JAVA:
  1. public class LanguageList extends Composite {
  2.  
  3.   interface MyUiBinder extends UiBinder<Widget, LanguageList> {}
  4.   private static MyUiBinder uiBinder = GWT.create(MyUiBinder.class);
  5.  
  6.   @UiField CheckBox rubyCheck;
  7.   @UiField CheckBox pythonCheck;
  8.   @UiField CheckBox javaCheck;
  9.   @UiField CheckBox phpCheck;
  10.   @UiField Button button;
  11.  
  12.   public LanguageList() {
  13.       // bind XML file of same name of this class to this class
  14.       initWidget(uiBinder.createAndBindUi(this));
  15.       
  16.       final ArrayList<CheckBox> boxes = new ArrayList<CheckBox>();
  17.       boxes.add(rubyCheck);
  18.       boxes.add(pythonCheck);
  19.       boxes.add(javaCheck);
  20.       boxes.add(phpCheck);
  21.   }

We still have to add them to the Array (which is use to display checked results) but doesn't that look so much better? And you are able to add the values of the checkboxes to the xml too.

When using UiBinder, make sure you add it as inherits to the xml for the module (i forgot at first and had errors with gwt trying to find UiBinder!)

I didn't do exactly one-to-one comparison between UiBinder and not, but i do have two complete gwt apps you can look at. I find it really helpful when learning something to look at complete apps rather than just snippits of code.

There is some documentation on Ui:Binder on Google Code, but at first I found it hard to follow since it doesn't say what files each piece goes in, it took me awhile to figure it out. Maybe its just me though. :)

Before UiBinder
After Ui Binder

Anyways, just a quick example that might help some people out there. I want to explore more about patterns in GWT and I'll write them up here.

Lately, I have been fascinated with Google Web Toolkit as of late. What you say, you love ruby but doing java?!!? My ruby friends will probably smack me but really i love all languages. The widgets and rpc stuff, that is pretty cool as well as learning how to do MVP. There are some new features in trunk that will be released "this fall" but I don't want to wait that long, so last night i set about to checkout and compile trunk and try it out!

1. I installed the latest version of eclipse Galileo, with the Google plugin
http://code.google.com/eclipse/

2. Checkout the source code
http://code.google.com/webtoolkit/makinggwtbetter.html#workingoncode
Make sure you have ant installed. It takes awhile, i think maybe 20 mins or so on my macbook.

3. Setup the API directory in the Preferences for GWT
It took a while (and many searches) of messing around to figure out how to switch to the trunk version of the API.

Go to Eclipse > Preferences. Find the Google Web Toolkit on the left. It has an interface to add/remove APIs. Click add, add the path like so:
~/gwt/trunk/build/lib
I named it "trunk"

4. Create project
Create a new Web Application Project, select "trunk" as the version of API. And now you are on your way!

Once i've done a little more with it, I'll write about some of the new features that are really awesome.

In my constant battle to get stuff done and feel good about what I did, I am finding the Pomodoro Method very handy.

Basically you set a timer for 25 mins, work unhindered for that time, then take a 5 minute break. Repeat 3 more times, then take a 15-20 min break. This has helped me for a few reasons

  • If my task is BORING.. I procrastinate, go read facebook, email a friend. If I can tell myself, ok 25 mins of this then usually I get into the swing of it and get it done!
  • TOO MANY EMAILS! ... I could sit and watch my inbox fill up before my eyes. Usually, any email can wait at most 25 mins to be read or responded to. Using my break time to glance over email has improved my inbox organization. Knowing i have just 5 mins to sort through the mails that have arrived makes me choose what is most important
  • I use http://www.tomatoist.comto keep track of my timer. It seems to work the best. I like looking at the list for today and seeing "oh wow, I did 7 pomodoros!"
  • I feel good, even when I don't complete the task, it makes me feel good to know I spend some uninterrupted time on that task. I am under alot of pressure from various fronts, and feeling good is something that keeps me going.

I have used other time keeping things, like Awake for mac. Timers on my android. Some people keep a list of tasks and how many pomodoros they believe that task will need. Reading the Pomodoro Method has alot of good tips!

Post in the comments if you have tried this sort of thing before!

Edit: Found a mac app that is cool and integrate with twitter! http://pomodoro.ugolandini.com/

Even though I don't do ruby at work, I do it for fun on weekends. I paid for my own self to go to the WindyCityRails conference and tutorial on Cucumber, RSpec Testing. It was well worth the money!! Not many things can get me to go up to Chicago early in the morning and on a weekend!

I went to a 3 hour tutorial class "Behaviour Driven Rails with RSpec and Cucumber" ... in my limited time I can spent with I've had a hard time getting my head around cucumber. I did rspec alot a few years ago, so thats a piece of cake. David Chelimsky and Corey Haines. 4 days before the conference, they sent an email to attendees of the tutorial with a list of resources to read and libraries to install. I worked all week on watching railscasts.com videos on cucumber, factories, testing. I always like to try things out myself first, then I am familiar with it when I go "to class" :) Dave and Corey did the class pair programming style..which was totally fascinating. There was one laptop, two wireless mice and one wireless keyboard. Dave typed on the laptop keyboard and Corey typed on the external keyboard. One would talk and explain things while the other typed. They took turns. It was really awesome. After watching them program, then they told us to split up in pairs and do the same thing for another scenario. I was sitting between two people so I kinda bounced between them. The one on my left didn't have the same version of rails, so he typed on my keyboard and we took turns. It was awesome, I had not really done pair programming quite like that before. They bounced between cucumber tests and rspec tests. I wish I could have recorded video and played it back in slow motion!

The regular talks:

Better Ruby through Functional Programming
Dean Wampler, Object Mentor, Inc.

I started to learn haskell once.. bought the O'Reilly book (which is excellent with little exercises)... but thats as far as I got with functional programming. This talk was interesting with code samples of ruby. We were challenged to learn a functional programming language. He mentioned others like scala, erlang ... hmm what to choose!

Super-easy PDF Generation with Prawn and Prawnto
John McCaffrey, Pathfinder Development

I have not had to make PDFs with ruby yet...but now I know there are some great libraries. Cool part of this is John was making a PDF of a ruby app, pulling in twitters happening at the conference and using Googles graphs APIs to make pretty graphs! I saw alot of people saying "I didn't know that Google had graph APIs!!!" :)

“Comics” Is Hard: On Domains and Databases
Ben Scofield, Viget Labs

When the talk started Ben asked for a show of hands of who reads comics? I meekly raised my hand. My husband is a comic book fan and I read them on occasion. I sat at his table for lunch and he asked me about it. I was surprised he saw my hand, iwas sitting near the back! This talk didn't have much code, but talked about the number of attributes that comic books have (title, issue, theme, publisher, etc) and how hard it was to model in a relational database. He talked about couch db, mongo ... i haven't tried any of those, but I might now that I know it can be the best choice for some data sets.

Rails 3 Update
Yehuda Katz, Engine Yard

Yehuda talked about whats coming up in Rails3. But by this time I was kinda brain dead and was trying to make plans for dinner!

Devchix!!!
A few of the local chix came to the after party and hung out. There was a few at the conference I had not met yet and a few I invited to join! It was awesome. It was so fun. I caught up some of my ruby buddies I hadn't seen in awhile and made some new friends. I was sad to see it end...

I haven't had a cool toys post about something web related in awhile. I got the idea for this kind post from a friend whom I told him something cool, and he said "HEY you need to share your cool toys!"

It used to be it was cool to have @my-awesome-website.com email addresses. Having your own domain (I'm not a business owner, so I am not considering the cases where you want a certain domain for your email). Ahh, the days of squirelmail and thunderbird. Now you can have gmail on your domain, so that makes gmail even more cool. To have the power of gmail and the cool factor of having your own domain for email. I finally got my mom to switch to gmail from hotmail. I shuddered whenever she was with me and borrowed my laptop, went to hotmail.com ... yikes!!

Here are some cool toys I've found in gmail labs! Labs? wuts that? Go to Settings, click on Labs. Tons of toys.

Multiple Inboxes
I admit, I was resistant to labels for a long time. Where are my folders!?? why is this mail always there? I added labels sometimes, but I never archived. It was still there in my inbox. I always had thousands of emails in my inbox. I used to think that archive was some "compression" thing you could do to zip your mail on googles server. I started reading Getting Things Done book and one way to use that system is with folders in your email. I email myself a task, add a label and archive it. I get an email from someone I need to act on, add the action label. But, then I would have to click on my tasks label on the left, page loads, then I see all my tasks. When I found out about multiple inboxes, I found I was able to divide my inbox screen in two sections: actions, inbox. Now I have my actions visible at all times and I can easily click and remove action label and archive when its complete. This is what really has helped using email as my task list useful. At work I even have a third inbox showing my starred items. I star things I want to read, but don't have time at the moment.

Tip: Send and email to yourself at yourname+action@gmail.com and then you can filter all incoming emails that come to that address to automatically apply a label! It still comes to you as normal. I use this alot.

Chat on the right
I like my chat on the right, so I can have my label on the left. You can enable this in labs too.

Send & Archive
Does both actions at once! Helps keep the inbox cleared out. Though I sometimes have problems with this while on the train, apparently it takes a few more bits of power for teh internet tubes to do do these two actions at same time.

Title Tweeks
Shows the inbox count in the title bar first, easier to see when you have lots of tabs open.

Google Calendar Gadget
Shows your calendar on the left side under labels. Nice to see what is coming up next.


Google Docs Gadget

I dont often use this actually. I should, I'm always typing in docs.google.com in the browser. I do use it to get to a recent document I created.


Gmail offline

I used this before I had an aircard. It was nice to compose emails offline, then send then when i got net access.

I think that's about it!! And the other awesome thing about gmail is that it is super cool on android...but thats another blog post!

Sometime ago a co-worker asked me what my github name was. I had forgotten..I hadn't used it in so long! He was surprised that I didn't have any open source code out there! I said, umm..i haven't written anything I think someone would want!

I tend to start projects, work a bit on them and leave them. I find something new and exciting. I get busy with school, work, and life. But I really want to make something that I can release as open source and work with people. At work, I am on a team of developers and its nice, when I am stuck or not sure if this thing is good idea, I can ask. In previous jobs, I was mostly the sole developer, or at least only one on my project.

How do I get better at programming? I've been thinking about this alot as I am trying to learn java (I have the syntax pretty well but there is more to a language than syntax). Well, its practice! practice and practice. Having someone review your code and get better because of it. I want to get better at Java. I want to make an android app. So I finally started one .. with someone!

I am part of this great group of ladies in DevChix. A group me and 3 others started sometime ago. I had the idea (and this has always been in the back of my mind when I started DevChix) to start a project with someone and commit to 2-4 hours a week. I posted to the list, found someone with some experience in android and also the same desires as me. We started a really simple app (a todo list, how original!) but its a start. I threw something together which was really a collection of all my started and not finished android apps rolled into one. I had listing of tasks, add tasks didn't work quite right. I uploaded what I had and Jessica checked it out and made it work. There is a long way to go ... but... hey we started it!

Our rough design:
http://wiki.devchix.com/index.php?title=Android_Project:_Daily_ToDo_List

Our project:
http://code.google.com/p/devchix/source/browse/

« Previous PageNext Page »