On a gagné les Opens du Web

Hier soir, Damien, Kevin et moi avons participé à la troisième édition des Open du Web à Paris. Et nous avons décroché la première place en équipe.

Les Opens du Web, c’est un concours dont les épreuves portent sur différents métiers du Web, à savoir programmation, intégration, design, administration, optimisation de référencement et gestion de communauté… Comme tous les trois, nous avons un profil de développeur, on pensait être mal partis. Les premières heures de l’épreuve nous ont confortés dans cette opinion. Et le dénouement a été une grande surprise…

Le concours avait lieu simultanément à Paris, Lille et Bordeaux. À Paris, il s’est déroulé dans les locaux de Sup’Internet. Et plus particulièrement, dans un parking souterrain digne des LAN de mon adolescence ;-). Ouvert aux quatre vents, il y règne un froid glacial, et la jolie demoiselle qui fait les présentations sur scène a bien du mal enthousiasmer la foule. Tristan Nitot dit quelques mots… Les participants s’installent, nous faisons connaissance avec les PC sous Ubuntu prêtés pour l’occasion… Quelques petits détails techniques réglés et nous pouvons attaquer ! Damien prend la programmation, Kévin, l’intégration, je prends l’administration…

La première épreuve est super simple : mettre en place une authentification par clés sur un serveur SSH. Je demande une machine virtuelle, deux minutes plus tard, je me logue. 30s plus tard, impossible de se reconnecter. Un organisateur vient et m’annonce que le serveur hôte est au bord du suicide, mais que les admins sont en train de lui remonter le moral, il faut patienter un peu. Quelques minutes plus tard, je peux enfin commencer à travailler. Première étape, je me crée des clefs pour pouvoir me connecter avec mon compte administrateur sur la machine. Je ne sais pas si c’est le stress du concours ou le froid, mais je me mélange les pinceaux et bloque au moins 30 minutes sur une erreur de débutant : le dossier .ssh n’avait pas le droit d’exécution ! Une fois cette bêtise réglée, je crée l’utilisateur demandé, copie la clé publique, tente de me connecter, mais rien : connexion impossible… J’active les logs de debug sur le client, puis sur le serveur. Et à force de fouiller, je me rend compte que la machine virtuelle fournie est configurée par défaut via PAM pour aller chercher les comptes SSH dans une base SQL distante. Je n’ai jamais vraiment bidouillé PAM, je tâtonne un peu. Une fois la config de PAM remise à plat, j’ai pu me connecter. Je désactive la connexion par mot de passe et valide mon épreuve. Ouf… Ça fait déjà plus d’une heure trente que je suis sur un exercice aussi trivial !

Pendant ce temps, mes collègues avaient fini depuis belle lurette leur première épreuve, mais un bug dans le système du concours les a empêché de passer à la seconde épreuve… Kévin qui avait fini en premier, pour ne pas perdre de temps, a eu le temps de valider la première étape de design avec un très joli logo. Damien m’a donné un coup de main pour résoudre mes soucis avec ma machine virtuelle… Nous voici donc prêt pour la deuxième épreuve… Il reste un tout petit peu plus d’une heure : c’est pas gagné…

Pour la seconde épreuve, il fallait configurer un pare-feu iptables ; facile ! Sauf que, si je le fais sur la machine virtuelle, je vais couper l’accès à ssh ?!? Après avoir demandé au jury si c’est bien ce qu’ils veulent, et une réponse à moitié satisfaisante, je décide de juste faire un script de configuration, libre à eux de l’exécuter pour se couper l’accès. Le voici :

Hop, épreuve 2 validée, il reste environ 45 minutes… Pour l’épreuve 3, il faut faire un script de backup, qui télécharge des fichiers, vérifie les sommes de contrôle, mail l’admin en cas d’erreur, puis archive le tout en effaçant les archives de plus de 7 jours. Voici ma solution :

Ainsi que le script d’installation, qui a beaucoup plus au jury, malgré un petit bug qui écrase la crontab :

Voilà, il reste à peine 10 minutes, je décide d’aider Kévin dans la réalisation de son CSS. Il le validera quelques secondes avant la fin de l’épreuve.

Damien devait faire un blog en PHP, voici son code et un petit mot de lui :

Première épreuve, on nous donne une base de données et il faut faire une page web qui permet de se logger avec un formulaire (email + password) en créant une session.
Après avoir chargé le .sql dans mysql que je venais d’installer et d’avoir enfin démarré apache avec php activé, j’étais prêt à me lancer.
Globalement pour quelque chose de ce genre là, la partie SQL n’est pas très compliquée, il y avait une petite subtilité ici (1) mais rien de bien méchant. Comme à mon habitude je suis parti sur du PDO (2) pour faire les choses proprement et n’avoir aucun souci d’injection SQL. Un peu de temps pour me remettre dans le bain avec PHP et voilà la première épreuve de dev finie proprement avec tous les points bonus qui fonctionnent (notamment sécurité grâce à PDO et bouton de déconnexion).
Il y avait quelques soucis avec le portail des épreuves donc j’ai essayé d’aider Stéphane sur la partie admin sys (surtout soutenu moralement finalement ;)), une demie-heure plus tard je pouvais enfin passer à l’épreuve d’après.
La deuxième épreuve demandait d’afficher les posts contenus dans la base de donnée comme pour un moteur de blogs, avec possibilité de filtrer l’auteur et une affichage de la date de post un peu évoluée (style « Il y a 35 minutes »). La requète à la base de données est très simple. Après quelques minutes à choisir le format de sortie pour les posts (finalement un div avec titre en h2, sous-titre en h3 et texte derrière) et à fixer l’encoding en utf-8, le plus compliqué a été le formattage de la date, j’ai donc découvert les classes DateTime et DateInterval qui m’ont finalement permis de tout faire proprement !
Pour le filtrage j’ai affichée une petite liste avec les auteurs pour que ça soit plus simple, et puis voilà tout fonctionne bien.
Je m’aperçoit 10 minutes avant la fin en vérifiant le sujet qu’il faut afficher uniquement les 10 derniers posts par ordre chronologique ! Logique pour un blog. Heureusement c’est uniquement une modification à faire dans la requète SQL donc c’est fait sans problème lors des quelques dernières minutes.
Au final c’était assez étonnant de coder dans le froid, les doigts se déplacent moins rapidement ! Et le système d’épreuves m’a un peu rappelé prologin quand j’ai participé il y a plusieurs années ! Un peu de nostalgie, un peu de développement fun, un peu de pression à cause de la limite de temps tout en essayant de faire les choses proprement ! Merci Stéphane de m’avoir invité 🙂
(Petites notes en ce qui concerne le code, en faisant l’épreuve 2 je me suis aperçu que j’avais testé deux fois « user » dans REQUEST au lieu de tester « user » et « pass », et après avoir rendu l’épreuve 2 je me suis dit que j’aurais pu réutiliser la connexion à la base de données au lieu d’en créer une à chaque fois, mais j’ai pas vraiment eu le temps de le faire)

(1) La base de données contenait md5(userid . password). D’habitude on va calculer le hash en php, récupérer le hash depuis SQL et comparer les deux. Mais ici le hash est différent en fonction du userid (et non de l’email). Il y avait donc à mon avis plusieurs façons de faire, la première était de récupérer le userid et le hash, de calculer le hash avec le pot de passe donné et de comparer avec ce qui vient de la base de données, mais j’ai préféré le faire directement dans la base de données puisqu’elle sait le faire.
(2) Le point qui me tient particulièrement à coeur quand je manipule des bases de données, c’est d’éviter les injections SQL, pour ça il existe les « prepared statements » qui sont disponibles notamment dans mysqli, mais je préfère aller encore au-delà en utilisant directement PDO qui est plus intuitive à utiliser et permet même de facilement changer de type de base (mysql/postgresql/sqlite).

Épreuves 1 et 2 du défit « programmation » (zip)

Après avoir discuté un peu avec les recruteurs qui ne se sont pas déjà sauvés en courant ou ne sont pas morts de froid, et avec les autres participants, le verdict tombe : nous somme premier de la catégorie “équipes”… Surprise !

Vu les problèmes de machines virtuelles, le jury a décidé de ne pas nommer tout de suite de gagnant en catégorie admin. La délibération est en cours.

J’ai beaucoup apprécié de jouer ce petit jeu malgré le froid. À refaire !

Maintenant, je pense que l’organisation à encore plein de points a améliorer :
– Trouver un lieu plus accueillant… Je sais avec le concert à la fin, ce n’est pas facile de faire ça dans une salle de cours…
– Ne pas utiliser de Wi-Fi ! Ça lag. Ça se déconnecte. Quand on fait l’épreuve d’admin, avoir un délai de plus d’une seconde entre l’appui sur une touche et le retour à l’écran, c’est affreux…
– Bien tester le moteur de jeu… Les bugs avec les requêtes SQL qui apparaissent au milieu du navigateur, c’est rigolo. On s’est demandé à un moment si déboguer le moteur du jeu n’était pas une épreuve 😉
– Bien vérifier la faisabilité des exercices (les machines virtuelles mal configurées, c’est pas cool)
– Créer des machines virtuelle en avance… Ça évitera de perdre un quart d’heure parce que toutes les machines sont démarrées en même temps
– Préciser dans les exercices ce qui est attendu : pour le premier exercice, je suis partis du principe qu’il fallait configurer directement la machine virtuelle, mais pour les suivants, il a fallu deviner qu’il fallait donner un script et / ou documenter son approche…

Bon, je pinaille peut-être un peu… Mais c’est juste pour que ce soit encore mieux l’année prochaine…