Week 6, day 5

Use the Super Awesome Bowling Scoresheet online on Heroku

bowling

Added some additional back-end logic and went through my code making it more descriptive and readable. I had hoped to split the functions out of the main JavaScript file into modules but since I'm only using 3 functions in my object I was advised to leave them there but DRY it up a bit.

Read More

Week 6, day 4

Paired up with a new partner today and finished off the front end implementation of their Chitter Challenge remake in JavaScript.
There was heavy use of JQuery and lots of test coverage, of course. It was very interesting to see how they had gone pretty deep into APIs to create a very lightweight and modular server and client.

chitter remake

The first part of the morning was all about tidying up the code and teasing out some added functionality, then we moved on to prototyping in PhotoShop then implementing in HTML and CSS.

Read More

Week 6, day 3

The CSS theme continues! My partner and I decided to take another back-end for Thermostat and finish off the front-end. We picked an image of a thermostat that we liked and then set about recreating it.

iThermo web app on Heroku

iThermo screenshot

The code we used was mine from a few days ago, it was pretty clean and lean so we had a good base to start from and we knew thanks to the 100% test coverage that it worked.
The backend is JavaScript with a barebones Ruby server and a lot of the front-end JQuery stuff was completed already but we wanted to add a few more features to it so we spent the first couple of hours just getting our heads around that.

Read More

Week 6, day 2

This week I've decided to focus on CSS to reinforce some front-end stuff while I still have the time. My partner and I took a version of the Thermostat challenge that he and someone else did last week and styled it up!

Use the Thermostat web app on Heroku

Thermostat with Massud

Post-modern and functional, move over Tracey Emin.

Read More

Week 6, day 1

This week is lab week, which means we are free to do what we want but still encouraged to pair or form small groups. I've made some good plans to pair up with people I haven't had a chance to already.
I intended to finish off the styling on my Bowling challenge but that didn't go according to plan either... sort of like yesterday!
My original app design leaves a lot to be desired, I only started off meeting the minimum requirements, so when I wanted to get a lot more info out of the code to display on the front end I was out of luck.

Read More

Week 5, day 7

This day has not gone according to plan. I expected to be done with the backend to support the frontend but I've had major issues getting the right information to display at the right time.
It has definitely been a solid learning experience in getting Jquery to work and how to test properly in Jasmine. I think I spent about half the day trying to get Jasmine to properly test my front-end. It turns out it's becaue you have to load SpecRunner.html from localhost and not the file request.

My buttons on the index.html:

<button id="btn0" type="button" class="btn btn-default" title="No pins knocked down" style="display: inline;">0</button>

etc... down to id="btn10"

And how I test for their presence in Jasmine-Jquery:

it('has buttons to enter pins scored', function(){
  for (var i = 0; i <= 10; i ++){
    expect('#btn' + i).toContain(i);
  };
});
Read More

Week 5, day 6

Started the weekend Bowling Scoresheet challenge late last night but when I carried on with it today I had major issues getting it to elegantly calculate the final score for a game. So I went back to the drawing board and scoured the web for design ideas. By the end of the day I was passing the basic requirements of the challenge and feeling confident about getting a web interface up and running so I could do some CSS.
One of the issues I faced was getting a concise way to re-run commands in tests. In ruby you can just use .times but we don't have that luxury in JavaScript.

bowling.roll(10);
bowling.roll(10);
bowling.roll(10);
bowling.roll(10);
bowling.roll(10);
bowling.roll(10);

...or...

function helper(rolls, pinsEachRoll){
  for (var i = 0; i < rolls; i ++){
    bowling.roll(pinsEachRoll);
  };
};

helper(6, 10);

Above: How to create a helper function to create multiple actions, replicating .times in Ruby.

Read More

Week 5, day 5

The seniors finished off and presented their final projects today and the place was absolutely packed to the rafters with friends, family, alumni and hiring partners.
Their work inspired awe and dread in us, it is very hard to believe that we'll be in their position just 6 short weeks from now. Much work still needs to be done.

Read More

Week 5, day 4

Yesterday I did an athletic restart of the Thermostat Javascript challenge back-end and today my new partner and I decided to carry on and finish the full-stack off. Perfect timing because our talks today were about how to properly test Jquery with Jasmine and also a pretty in-depth talk about CSS.
Until now I was completely unsure about deploying JS to the web but not only did we test-drive JQ creation but also deployed and began styling in CSS.

picture

A couple of Makers training in the essential art of ping pong.

Read More

Week 5, day 3

We've been continuing with Javascript and Jquery today. Javascript is surprisingly easy to pick up after all our Ruby training, which is definitely good news.
The only thing I'm challenged by at the moment is getting JS deployed to the web but my goal is to change that before this weekend.

$(document).ready(function(){
  $('div').mouseenter(function(){
    $('div').fadeTo('fast', 1);
  });
  $('div').mouseleave(function(){
    $('div').fadeTo('fast', 0.5);
  });
});

A Jquery function to fade a button in on mouseover and off when you leave it.

Read More

Week 5, day 2

Today my pair programming partner and I re-did our Airport challenge in Javascript. There were the expected issues of syntax and learning how JS constructs its functions and tests but it was a very informative and productive day.
The thing that gave us the most trouble was stubbing out behaviour with doubles, we can write mocks in Ruby with our eyes closed but doing it in JS is another story. It took a lot of searching and conferring with more experienced colleagues but we did eventually get there.

1 plane = jasmine.createSpyObj('plane', ['location']);
2 plane.location.and.callFake(function() {
3   return 'air';
4 });

That is how we eventually doubled and stubbed behaviour of a foreign object in a unit test.

Read More

Week 5, day 1

This week's exercises are all about Javascript, a language not entirely alien to a Rubyist. It can be object or function oriented but it doesn't have classes at all, or objects in the same sense as Ruby. The nice thing is that its testing language, Jasmine, is quite similar to Rspec.
The weekly challenge begins with some Javascript exercises including a version of FizzBuzz and then moves on to creating a thermostat app. All test-driven of course.

1 var Thermostat = function () {
2   this.temp = 20;
3 };
4 
5 Thermostat.prototype.increase = function(){
6   this.temp += 1;
7   return(this.temp);
8 };

Above is the beginnings of my partner and I's thermostat app, allowing the unit to be created with a default temperature and endowing temperature increase and decrease functionality.

Read More

Week 4, day 7

Leave me a message on my Chitter website on Heroku

View my Github repo for Chitter

chitter

Another little story from my escapades yesterday is about getting the Travis-CI build to pass on my pull request. I got the following error.

An error occurred while installing do_postgres (0.10.15), and Bundler cannot
continue.

Some searching turned up this.

You should be able to solve this error by adding the following to your .travis.yml:

before_install:
  - sudo apt-get update -qq
  - sudo apt-get install -qq postgresql-server-dev-9.3

Replace 9.3 with the Postgres version being used (9.1 is the default, 9.2 and 9.3 are also supported)

from Source

More tantalising tales of troubleshooting after the break.

Read More

Week 4, day 6

Finished off a working version of our Twitter clone, Chitter, before mid-day and then spent about half of the day refactoring it.
When it came to refactoring I knew I wanted to comply with Object Oriented best practice so I seperated out the:

  • Sinatra GET and POST methods from the server.rb into appropriate files in a new controllers folder.
  • Ruby PostgreSQL stuff into their own files in the models folder,
  • ERB files into their individual paths.
  • Application helper module in its own folder.

This took me most of the day to get right and I had to search for a lot of answers on the web to get it done.
Then I came up against an obstacle in the form of passing around the user session to other parts of the app. It took me until the early evening to go over every line of my code to really understand what was going wrong but I did eventually fix it. This has definitely given me a greater undertanding of the code.

Read More

Week 4, day 5

As per usual we were assigned our latest weekend challenge and it is to create a Twitter clone, aptly titled Chitter.
This will tie in all our practice this week working with databases and creating a full-stack with Ruby and Sinatra.
And, as usual, it is all Test-Driven Development with BDD Rspec. We were given the option of using Rspec or Cucumber, and as much as I love Cucumber I think I'll go with Rspec for this one, with Capybara providing excellent website testing semantics.

Tests provide the only reliable documentation of design. The story they tell remains true long after paper documents become obsolete and human memory fails.

  • Sandi Metz - Practical Object Oriented Design in Ruby (POODR).
Read More