Category Archives: Allgemein

The Theory of Responsive Websites

Responsive Webdesign

Here at HolidayCheck responsive web design is a big challenge, although we’re all big fans.

I recently joined the company as a Frontend Developer and I have been a big fan of responsive web design for years. The latest article I wrote about the subject is called the Theory of Responsive Webdesign. (Currently only in German, sorry)

Here you have a small teaser…

There is a big difference between responsive websites and good responsive websites, and of course it takes much more than to only consider some CSS improvements. Principles like mobile first are pretty hyped these days, but the challenge is not only a technical one.

Consider loosing 80% of the available space of a desktop screen and try to put everything important inside the mobile version. Designers have to rethink their concepts to provide a good user experience on small devices. Then, step by step, details can be added (progressive enhancement). One of the main benefits of this principle is that adding details is much easier than removing them from an already blown site.

You don’t have to develop everything by yourself, because there are a lot of frameworks out there. Going from the small ones, which only provide a small set of CSS classes for a responsive grid, to the all-inclusive frameworks, which provide a full set of components like buttons, tables and forms.

One of the biggest and most discussed topics in RWD is performance. As there is only one website, the smallest device has to load the entire HTML code. Also images can become an annoying mess, because loading high resolution images on a slow device can be the overkill for loading time. There are some approaches as partial loading to resolve these problems, but as nearly everywhere, there is a lot of space for improvements.

You can read this and many other responsive things in the full article on heise. In the next few weeks I am going to write the practical part of RWD, stay tuned!

Testing REST-clients with “Jersey Test Framework” in specs2

In a “Microservice Architecture” there will likely be the case, that one service depends on another one. So you normally implement some kind of client in the service that connects to the other service. When writing unit tests you can then mock this client and make it behave like you expect. But how do you test the client itself? Therefore you need to mock the other service and make it response as you expect.

For writing tests against a jersey-server there exists the “Jersey Test Framework”. Here you use the jersey application as the system under test (SUT). But you can easiliy use this framework to use the application as a mocked service and run tests against the client using this mocked service.

We are mainly writing our code in scala and therefore writing our tests in specs2. Thats the reaseon why I wanted to find a way how I can use JerseyTest easiliy in my specs tests. Inspired by the project specs2-embedmongo I created a FragmentsBuilder that injects an embedded JerseyService into a spec.

trait EmbedService extends FragmentsBuilder {
  self: SpecificationLike =>

  //Override to configure the application
  def configure(): Application

  // Create a JAX-RS web target whose URI refers to the Jersey application
  def target(): WebTarget = {
    client.target(tc.getBaseUri)
  }

  private lazy val tc = {
    val baseUri = UriBuilder.fromUri("http://localhost/").port(8080).build()
    val context = DeploymentContext.builder(configure()).build
    val tcf = new GrizzlyTestContainerFactory
    tcf.create(baseUri, context)
  }

  private lazy val client = {
    ClientBuilder.newClient()
  }

  override def map(fs: => Fragments) = startService ^ fs ^ stopService

  private def startService() = {
    Step({ tc.start() })
  }

  private def stopService() = {
    Step({ tc.stop() })
  }

}

To use it you only have to mix in this trait and configure your expected behavior as a jersey application.

class EmbedServiceSpec extends Specification with EmbedService {

  override def configure(): Application = {
    new ResourceConfig(classOf[HelloResource])
  }

  "Embed service" should {
    "be able to return 'Hello World!' on a GET request" in {
      val hello = target().path("hello").request().get(classOf[String])
      hello must be equalTo("Hello World!")
    }
  }

}

@Path("hello")
class HelloResource {
  @GET
  def getHello() = "Hello World!"
}

The last thing you have to do is to inject the WebTarget into the Client you want to test.

class HelloResourceClientSpec extends Specification with EmbedService {

  override def configure(): Application = {
    new ResourceConfig(classOf[HelloResource])
  }

  val sut = new HelloResourceClient(target())

  "HelloResourceClient" should {
    "return 'Hello World!' on getData" in {
      val hello = sut.getData()
      hello must be equalTo("Hello World!")
    }
  }

}

class HelloResourceClient(target: WebTarget) {
  def getData() = {
    target.path("hello").request().get(classOf[String])
  }
}

That´s it. Have fun writing clients from now on!

Profiling MongoDB with Logstash and Kibana

We’re using MongoDB as a storage for our web pages. Because many different background processes are using this database, it’s difficult to find the reason for high CPU or IO load on the server. MongoDB has some built-in tools to investigate the current behavior (like mongotop, mongostat or db.currentOp()), but we missed a single easy-to-use tool, which can be used by every developer and shows statistics over a specific period.

Continue reading

Introducing Tready.js

Tready.js is a JavaScript framework, that allows running components in Node.js and the browser.

We had a problem at HolidayCheck, we loved all of the possibilities that JavaScript had, but we weren’t quite able to make use of it as much as we would have liked to. This was due to the fact that nearly everything needed to be visible in Google’s search results. And I am not telling news when I say Google’s search engine doesn’t do JavaScript as well as the browser. Which is funny considering that Google is pushing JavaScript at the same time.

Continue reading

HolidayCheck’s Journey with Scala and Akka

I was asked by Heiko Seeberger to provide some more information about our work at HolidayCheck using Typesafe’s technologies Scala and Akka. As you may know, we came from a classical LAMP (MySQL, PHP) development stack and turned our company into one, which is using Java/Scala at backend and CoffeeScript/Node.js at frontend side. All this within 10 months (taking into account the 1st class of pages gone live end 2012). Not that bad…

So here is the Typesafe blogpost (or directly to the case study).

Welcome to the HolidayCheck Engineering Blog

HolidayCheck engineering is working on some awesome projects and technologies. This blog is the place where we will write about it.

So tune in, if you want to know how we are solving technical issues, discuss our architecture and system design, see some code samples and checkout our open source efforts.

Some stuff to get you started:

About HolidayCheck

The HolidayCheck idea dates back to 1999 when two guys Markus Schott and Sascha Vasic, frustrated with the lack of authentic information when choosing a hotel, decided to create a website which would give others the opportunity to read real opinions and reviews instead of just catalogue descriptions. They created the first HolidayCheck website as a hobby. In 2004 HolidayCheck was founded as a company in Switzerland. After that HolidayCheck grew even faster and started its first international websites in 2006: www.holidaycheck.com and www.holidaycheck.fr closely followed by Spanish, Italian, Polish, Russian and Dutch in 2007. Today HolidayCheck is available in 10 languages.

Each month 20 – 30 million people visit HolidayCheck websites. On HolidayCheck users inform themselves about hotels and destinations with about 10 million user opinions. Information is available on more than 300 thousand hotels and 100 thousand points of interest in the holiday destinations.
HolidayCheck AG headquarters are located in Bottighofen, Switzerland and has three foreign offices in Warsaw, Paris and Moskow. The majority of HolidayCheck is owned by the listed company TOMORROW FOCUS AG, one of the leading digital media companies in Germany. The main shareholder of Tomorrow Focus AG is the publishing company Hubert Burda Media.