Indoor climbing tracker

Update: I built a new version of the app as an Android and Android Wear native app. The one described on this page is not maintained anymore.

I have been doing outdoor and indoor climbing for five years now. While I enjoy a lot rock climbing and multi-pitch outdoor routes, I also practice every week indoor climbing at my local climbing gym.

Tracking a new Climb
Tracking a new Climb on mobile

I use Foursquare everyday, RunKeeper when running or skiing, a diving computer when diving, but I have nothing to track my indoor climbs.
We were thinking about this with Pierre, a climber friend, and I started working on it as a side project. We imagine it very simple:

  • select a climbing gym
  • “check-in” on routes after each climb saying if it was lead or top-rope, leaving a comment. Of course, gyms and routes need to be user generated.

The value would be that you can track your progress and the app could give route suggestions. You could leave and get comments and tips on routes.

Climbing log on Chrome Desktop
Climbing log on Chrome Desktop

I had great feedback from the /r/climbing reddit community. Telling me if this kind of app would be useful, what people would use it for and pointing me to similar projects.

Technically, the prototype app is a client-side web application, based on Parse because I didn’t want to bother building once again a new dumb backend server that is just storage and user credentials. I like Parse’s phylosophy of being a “backend as a service”, they are right to think that a lot of web or mobile application are structured the same way and do not have a lot of server-side logic. Focusing on the front end was what interested me with this project, and Parse allowed me to prototype things fast and be sure that it is reliable for the future.
It is generated using Yeoman (so uses Bower as client-side library management tool and Grunt as build tool), it uses AngularJS and bootstrap 3.

I think I did the mistake to think that I could target mobile and desktop with the exact same responsive website, while this may not be false, I think I would better have focus only on the mobile application and build a dedicated mobile UI using a mobile web framework, such as ionic framework. This may be the next step.

It is available online at and still needs a nice name and logo.

Try it now

Advertisements

LeCamping Mafia

It has been a 3 years since I took part to the first season of the startup accelerator LeCamping in Paris. The application for the 6th season is starting this week. This creates a large network of “alumni” and a large number of startup created, between us, we call it the Camping Mafia.

Some months ago, we decided to build an alumni website. First goal was to create a summary listing of all the startups, inspired from YC list.

Romain Cochet had initiated a fully working Symfony based website. But I was thinking we could have a simpler solution that would encourage collaboration and not rely on a server-side database and hosting.

Based on the design work from Adrien Dupuy, I created a very simple AngularJS client-side application. This allowed us to easily add new features such as filtering and search.

LeCamping Mafia

The source code is available on GitHub and the website is entirely hosted on GitHub pages. Startups data is stored in a JSON file, which encourage edition and update from anyone through Pull Requests.

Go take a look at lecampingmafia.com.

My Portfolio written with AngularJS

I’ve been working with Backbone.JS for the past two years as front-end JavaScript framework for desktop and mobile web apps. I wanted to try a more structured framework. While I read a lot about Web components, that are for me the future of web programming, I had issues using them in a very simple use case. The Polymer project (based on them) looks interesting, but is still in very early stage. That is how I selected the AngularJS framework.

portfolio made with AngularJS

A refactoring of my simple portfolio at http://steren.fr was a perfect candidate as a simple project to learn this framework. You can check the code on github.

I started with Angular’s great getting started tutorial and was then able to start working using the official Documentation and the rest of the interweb.

The app is very simple :

  • It contains two Views (described in partials), that are using the same Controller
  • The data comes from a JSON file and accessible from a Service.
  • I had to write a custom Filter to filter works based the checked checkboxes.

What is interesting is that I didn’t needed to code any data-binding or manual refresh, Angular is handling this for me since everything is properly wired. For example: clicking on  the sort radio-button changes the ‘sort’ variable that are linked to the works filters.

Read and fork the portfolio code on github.