BattleHack 2014 showcases brilliant coding ideas

September 26, 2014

BattleHack has got to be one of the more interesting hackathons around. With a Battle Axe as the grand prize and good food provided for the entire 24-hour coding marathon, it almost doesn’t feel like a programming competition at all.

Last weekend, programmers gathered at event venue Le Danz for BattleHack’s Singapore stop. They were asked to build an app that could solve a local problem, while incorporating a payment or donation feature. Upon being presented with their task, the participating teams rolled up their sleeves and got down to work.

battlehack

After 24 hours of toiling, the Battle Axe trophy went to Team TalkWithMe for their SmoothTalk app. The app incorporates a custom iOS keyboard which translates the input language into a desired language in real time, addressing the issue of multilingualism in Singapore.

Hoiio was there as well to lend our support as one of the event partners. Being an event partner meant that, on top of the three winners chosen by the judging panel, we could also select a winning team of our choice.

Based on criteria of originality, usefulness and level of real-life application, KC chose Team FundForFun to win the Hoiio category.

Using Hoiio’s IVR API, Team FundForFun created an app that allowed the elderly to call to a number and share their dreams, be it lavish or simple, which will then be submitted in the form of voice-recorded requests to the app platform. Users can then vote for their favourites and make donations through the app to fund the realisation of the old folks’ dreams.

battlehack team fundforfun
Team FundForFun receiving their prizes

For their innovative idea, the team received a sponsored prize of FitBit Zips. Being an event partner for BattleHack is meaningful for us because by providing the API, budding coders with the passion to make a difference can build their apps more easily.

Congratulations to all winning teams! To see who else won, click here.

Tags: , ,
Posted by:

Hack & Roll 2014

January 27, 2014

Last weekend was another 24-hour of hackathon, organised by the NUS Hackers, where 18 cool hacks were created.

I personally enjoyed Djengue Unchained (a pun on Django Unchained).

Because firstly, their video reminds me of our video which we created in another hackathon!

And secondly, we blogged about dengue alert in Singapore last year. The solution was x-Dengue, a service that SMS you on the dengue clusters.

Djengue Unchained brings the solution to a new level – detecting before it happens!

Victor introducing Hoiio API

Victor introducing Hoiio API

Hack and Roll 2014

Melvin with his improvised standing desk :)

Tags:
Posted by:

Install Hoiio PHP SDK easily with composer

January 23, 2014

We pushed a commit recently to support composer, a dependency manager for PHP.

This makes installing our PHP SDK into your project a breeze.

After installing composer, create “composer.json” in your project root directory and require as such:

{
    "require": {
        "hoiio/hoiio-php": "0.0.6"
    }
}

To initialize installing of the libraries and dependencies, run:

php composer.phar install

That’s it!

Thanks to composer, installing/updating SDKs is now much easier.

Tags: ,
Posted by:

Under the hood: How the user portal was rebuilt

November 25, 2013

Over the last 6 months, the web team had been hard at work rewriting the user portal from scratch. We have finally finished it last month and are proud to launch it to our users. The upgrade was not just limited to the UI and it’s loading speed – there were also numerous architecture and security upgrades. Read on to find out more.

Why the rewrite

Our previous user portal was written in GWT and had undergone major design and focal changes over its two year life-cycle. Because of it’s single page design, the portal had to download all page components before the page could be rendered. This resulted in a relatively long wait before the user could interact with the page. On the plus side, once the portal was loaded, it was almost as responsive as a native application.

The multiple rounds of changes also resulted in severe code degradation. We noticed that maintenance was starting to become unmanageable and feature addition took far more resources than it should.

What we changed

Architecture

Our implementation with GWT had a very tightly coupled client-server architecture. Requirement changes often involved updating both server and client code. As our application server only acts as a proxy to our actual API server, we decided to simply discard the server side logic entirely and to rewrite our portal using HTML and Javascript: instead of fetching the generated page from a Tomcat application server, we serve a plain HTML document and populate user content via AJAX calls to our API servers. This had a two-fold benefit: (1) it eliminates a round-trip-time to and from the proxy and (2) we no longer have to bother with writing the API wrappers for our application server.

 architecture

Following in the footsteps of our apps team lead, we decided to rewrite our portal using Backbone.js, and use Require.js to optimize our project. By adopting this approach, we could test any code changes easily on our browser without the need to start up any servers. As our client side architecture is very similar to what the apps team had done, we will omit the details here.

Code Partitioning

A major factor in the decision to rewrite was to improve the maintainability of the code. At the end of it’s lifespan, the old user portal had more than 50,000 lines of code. In rewriting our new user portal, we needed to modularize our user portal into sub-modules – each module with it’s own repository, unit tests and continuous integration. The goal was to allow deployment of any module without the need to bring down the whole user portal for maintenance.

We tested the feasibility of this approach by replacing login/registration logic with our new Auth module and the transaction logic with our new Transaction module. The upgrade greatly improved the loading speed of the login page (from around 10s to 1s!) and was a big functional improvement to our transaction module. With our initial successes, we proceeded to rewrite all other components of the user portal.

Our modules are distinguished from apps by how they perform authentication. Our modules use a shared login cookie for API authentication while our Apps uses OAuth for authentication.

Caching User Data

We wanted to further improve user experience by reducing page load speeds. To do that, we decided to cache some non-sensitive data (e.g. installed app list) to give the perception of a quick loading speed. To ensure that what the user see is up-to-date, we load and update user data in the background after it (the cache) has been rendered.

We were surprised by the effectiveness of this simple strategy: instead of showing a loading indicator for a 1 or 2 seconds, the user would see all most of his user information instantly after the page has loaded!

Reliability

The frequent code updates and the lack of proper testing resulted in frequent bug reports – which required bug fix deployments. This usually meant a few minutes of downtime for the server restarts. Additionally, the server may suffer memory leaks or errors and fail catastrophically.

We adopted several approaches for this:

  1. Implement rigorous unit tests via Jasmine which is run automatically as part of our continuous integration
  2. Implement code reviews to ensure proper coding practices
  3. Do away with the server and instead host our entire user portal in Amazon S3. This may seem odd, but this allows us to easily serve our website from the cloud via Amazon Cloudfront. By eliminating the need to maintain our own application server, we have reduced our portal’s point-of-failure to just Amazon (which has very high reliability).

The result is a system that is agile and robust. Deployment is just a single click in our Continuous Integration system – which automatically runs the Jasmine test suites before syncing the files to our S3 bucket. Another benefit is that any user using the system will not notice the deployment because his session will not be interrupted at all.

The fact: Speed comparison

We compare the speed difference between the old portal and the new portal, both loading the company account manager. Our machines are located in US and we are conducting our tests from Singapore

Old Portal
First request (no cache) takes 18.6 seconds to complete.
Second request (with cache) takes 8.3 seconds to complete.

New Portal
First request (no cache) takes 8.5 seconds to complete.
Second request (with cache) takes 3 seconds to complete.

The speed-up is significant – almost a 300% improvement in loading speed for a returning user!

Final Words

We hope that our users are satisfied with the improvements in our new user portal. We will be continuously adding new features and improving user experience. Let us know if you have any feedback for us!


Posted by:

A Guide to Using Heroku PHP to Run Hoiio Sample Code

October 22, 2013

We have provided many PHP sample code in the past, with the most recent being the call forwarding app.

Many developers have webhost providers that support PHP, but we have encountered many developers who wanted to get started with the PHP sample code quickly, yet they don’t have a webhost.

Fortunately, there is always a FREE and GOOD option around – Heroku!

While Heroku does not directly state that they support PHP, they do! This is how you can get started.

1. Register a Heroku account

2. Install the toolbelt

3. Create a project directory e.g. /hoiio-heroku-app

4. Create index.php in the root directory. It can be an empty file, but it MUST be there for Heroku to recognize this as a PHP app.

5. Init git and push. Issue these commands in root directory.

heroku create
git init
git add .
git commit -m "Initial commit"
git push heroku master

6. After pushing to heroku, you will see the URL to your app eg. http://intense-woodlands-1234.herokuapp.com.

7. Use any of Hoiio sample code, for example you can set up auto-attendant to create a Main Line. IMPORTANT: Read the setup instructions for auto-attendant. Your server URL is that you obtained in (6).

8. git push the code again

git add .
git commit -m "Added Hoiio auto-attendant"
git push heroku master

That’s it! Call your Hoiio number and test out!

Tags: , ,
Posted by:

Another Open Source Example: Call Forwarding

October 10, 2013

We have created another sample code for PHP developers.

Call Forwarding is a simple app to forward calls received on your Hoiio number to another phone number.

It is very similar to Auto Attendant, which is another sample code for company extensions. In fact, call forwarding is a simpler app of auto attendant.

Go ‘grab’ your copy now, at https://github.com/Hoiio/hoiio-call-forwarding.

Tags: ,
Posted by:

You will never “forget” to send that SMS, with txtot

September 17, 2013

txtot is an app that helps to send scheduled SMS.

Quoting from lifehacker:

Perhaps you want to text someone, but now isn’t the right time. It’s either too late, too early, you know they’re busy, or you just want to catch them at the best time to ask. Txtot schedules those messages for later so you can compose them now and still remember to send them when the time comes.

Isn’t that useful?

Just last night, I asked my mum to help me run an errand at the bank the next day. As usual, she forgot about it. It’s my fault, as I should have sent an SMS to remind her.

Yet I forgot about it..

With txtot, I could simply schedule the SMS, and avoid the problem!

txtot1

Tags:
Posted by:

Haze Alert

June 25, 2013

For Singaporeans facing the haze issue, this Python script will send you an SMS when the PSI crosses a certain threshold.

Now you don’t have to continuously look out of your window :)

Haze Alert is written by @qxcg, and uses the PSI API written by him as well.

Tags:
Posted by:

Warning: Dengue cases increased 300% this year

May 21, 2013

It was only when I spoke to the guys from x-Dengue that I understood Singapore has an ongoing dengue fever.

In 2012, the number of dengue cases was 4,632.

But in the first 5 months of 2013, there were already 7,000 dengue cases. That is around 300% increase!

It is an ongoing dengue fever, and we all have a part to play to protect ourselves, and our loved ones.

Firstly, you should know the dengue clusters. NEA has a map for that, but I prefer the one from x-Dengue that uses Google Map.

dengue map

You can also download x-Dengue iPhone app, and register your family members so that they will be alerted via SMS when they are in a dengue cluster.

Fight dengue. Stay heathy.

Tags:
Posted by:

FRESH code only hackathon – AngelHack Singapore

May 09, 2013

Coming June 1, AngelHack will debut in Singapore!

AngelHack is different from your average hackathon. They have this outstanding rule:

All code must be FRESH. Prior to the hackathon you can create your design, wireframes, logo, and user flows.

You can prepare anything, but not the code.

Having been to numerous hackathons, it irks me to see teams participating with completed apps. Merely adding another awesome feature is NOT the same as hacking a new app!

angelhack

If you are interested, sign up here for the Singapore event.

You will also be glad to know that Hoiio API is providing $30 credits to each AngelHack team (:


Posted by: