Mon épopée “The Hacking Project” (1ère Partie)

Dans cette première partie, je vous raconterai mes deux premières semaines à The Hacking Project.

The Strasbourgeois Crew

Mais tout d’abord, il est préférable que je vous situe bien dans mon parcours et ce qui m’a motivé à faire THP.

Qui suis-je ?

J’ai 18 ans, je suis originaire du Haut-Rhin en Alsace, je sors de 3 ans de bac pro SEN (Systèmes Electroniques et Numériques), durant lesquels je pensais apprendre l’informatique.
Sauf que c’est moi qui devais l’apprendre à mes professeurs. En cours, j’apprenais surtout à brancher des alarmes et calculer des résistances.

J’ai toujours été intéressé par l’informatique, et pendant ces 3 ans j’ai appris en autodidacte sur des sites comme Codecademy et Openclassrooms principalement, dès que j’avais du temps libre.
Je me suis surtout concentré sur Python, facile, et très utile pour apprendre la logique du codage, et donc les autres langages par la suite.

L’école 42 à Paris

Une fois sorti de mon bac avec mention assez bien, directement le mois d’après, en Juillet 2018, j’ai fait un mois intensif de Piscine à l’école 42, à Paris.
J’ai rencontré des gens super sympas, mais je n’ai pas été retenu.
Je me suis attardé sur les exercices compliqués, pensant qu’ils montraient vraiment la persévérance et la capacité de la personne, mauvaise stratégie.
Il fallait simplement faire les exercices simples et sauter ceux assez durs.
Mais bon, de toute façon, financièrement je n’aurais pas pu vivre à Paris pendant plusieurs années.

 

Je me suis rendu compte que l’école n’était pas du tout faite pour moi, et que je préférais le concret, des choses intensives, des “bootcamps” qu’on préfère appeler “formations” ici en France.
En 1 mois de piscine j’ai appris beaucoup plus qu’en 3 ans de lycée.

Donc, dans ce fameux mail de refus, heureusement, 42 propose des alternatives. Epitech, Web@cademie, The Hacking Project, Samsung Campus et Coding Factory.

Les alternatives

Je me suis renseigné sur chacune d’elles, j’ai regardé la possibilité d’obtenir une bourse, la distance par rapport à chez moi, etc.
Epitech : Trop cher.
Web@cademie : 2 ans à Epitech dont 1 an en alternance. Gratuit, mais trop long pour moi.
Samsung Campus : Ils regardent les diplômes du candidat, le site offre trop peu d’informations sur l’école, trop flou. Et vers Paris. Trop loin.
Coding Factory : Leur argument principal est “diplôme reconnu par l’état”, et pour une école qui est censée apprendre le PHP et l’HTML5, leur site est sous WordPress. (Il suffit de rajouter “/robots.txt” après l’URL du site internet pour voir une page cachée “/wp-admin” apparaître, qui est la page de connexion d’un site WordPress.) Après bien sûr on peut être compétent et utiliser WordPress mais bon, pas ouf.

Et enfin, The Hacking Project.
A l’heure où j’écris cela, la formation dure 11 semaines, ce que je trouve intéressant car je voudrais travailler et démarrer des projets le plus vite possible en ayant un maximum de compétences.
On y apprend cela :

Source : https://www.thehackingproject.org/

En 11 semaines, apprendre tout cela ? Génial.
Ils mettent en avant les compétences qui sont “enseignées” et non un pauvre niveau “Bac+ Je sais pas combien”, c’est communautaire, ils utilisent la même pédagogie que l’école 42, c’est-à-dire le “Peer-Learning”. Tout le monde s’entraîde, et les gens se corrigent entre eux. Top. ❤️
La formation est gratuite, mais avec une caution de 314,15€.

J’ai parlé de cette formation dans le groupe Facebook de la piscine de Juillet, et à mon grand étonnement, plusieurs personnes admises à 42 l’avaient déjà faite avant, et tout le monde en a dit du bien.

Je suis donc allé à la présentation de la session qui s’est déroulée à Strasbourg début Octobre, présentée par le co-fondateur Charles Dacquay.
Il nous a expliqué un peu plus en détail la formation :

Le vocabulaire

Il vaut mieux vous expliquer les termes qui vont être utilisés, au risque de vous perdre à tout jamais au cours de cette lecture.

Les moussaillons : Ce sont les personnes qui font la formation.
Les corsaires : Ce sont les personnes qui ont fini la formation.
Les renégats : Ce sont les moussaillons qui ont perdu tous leurs jokers ou qui ont arrêté la formation.
Les jokers : On commence avec 3 jokers, qui représentent des vies. (Je vais expliquer un peu plus en détail plus bas.)
Le Slack : C’est l’application de messagerie instantanée qu’on utilise pour communiquer avec la communauté. Elle est divisée en “espaces de travails”, puis dans ces espaces, on y retrouve des “channels”, comme “communauté” où les corsaires parlent, “code-help” pour demander de l’aide à propos de son code, ou encore “code-moussaillon” pour discuter entre moussaillons.

Mais comment ça fonctionne ?

Du Lundi au Vendredi, pendant 11 semaines, tu auras des exercices chaque jour. Certains jours sont validants (le lendemain matin, il faudra te faire corriger par deux personnes), et le jour d’après, ce sont des jours de correction. (Il faudra que tu corriges deux personnes sur le projet de hier, avant midi, sinon tu perds un joker.)

Et un joker j’ai pas compris, c’est quoi ?
Un joker, t’en as 3, et ça représente tes vies durant la formation.
Si tu les perds, tu deviens renégat. Donc officiellement, tu ne fais plus parti de la formation, mais tu peux toujours continuer. Mais adieu ta caution. (Sinon c’est pas drôle voyons).

Et ces jokers comment je les perds Jamy ?
Et bien écoute, ce n’est pas sorcier. T’en perds un :

  • Si tu ne notes pas correctement quelqu’un
  • Si tes exercices rendus n’ont pas été à la hauteur de ce qui était demandé
  • Si tu n’as pas corrigé 2 personnes avant 12h00
  • Si tu ne rends pas un projet validant avant 23h59
  • Si tu manques simplement de respect à une personne de la communauté.

Tu pars de rien, puis à la fin tu sais faire une application web et reproduire un Airbnb.

Cool, non ?


Let’s go !

Après la semaine 0, (assez facile, bien qu’intensive, et faire des balises HTML c’est pas ma tasse de thé (ne parlons même pas du Javascript)), je me suis enfin lancé. J’ai fait ma présentation sur le Slack, comme demandé, et beaucoup de gens venaient de la piscine de 42.
J’ai pu faire connaissance par message avec Mathieu, qui fait aussi la session à Strasbourg, et ma marraine. (love sur toi Soraya).

À The Hacking Project, une marraine ou un parrain est un(e) corsaire qui va nous guider, et nous aider au sein de la formation.

On s’est donc donné rendez-vous à La Taverne Française, à Strasbourg, pour notre premier jour de travail ensemble. C’est un bar, avec wifi, tout le monde y va pour travailler, ça en devient presque un espace de co-working.

Les membres de notre équipe à Strasbourg : Mathieu, Ugo, Simon, Melisande, Thomas, et Thomas (moi cette fois-ci).
Melisande est sur Strasbourg Lundi et Mardi, et le reste de la semaine avec une team THP sur Paris, pour un projet qu’elle doit monter.

Première semaine

Le premier jour était consacré à faire connaissance avec l’équipe, avec des petits jeux de présentation, par exemple, chacun son tour si on avait une baguette magique, qu’est-ce qu’on aimerait changer dans le monde. (J’ai répondu l’éducation en France).
On a aussi dû apprendre à utiliser Git pour push des fichiers sur le repo d’une seule personne d’un groupe. On a donc découvert la galère des Pull Requests.

On notera l‘implacable sérieux de Simon.

C’était le début de l’après-midi, on avait finit, et les exercices du lendemain sont toujours disponibles un jour d’avance, sauf le week-end, ils sont bloqués jusqu’à Lundi.

Donc on a directement enchaîné sur le jour suivant : Reproduire la page d’accueil de Google.
Le but était surtout de nous entraîner sur la disposition d’éléments sur une page web grâce à l’HTML5 & CSS, donc pas de réelles recherches Google possibles sur la page.
Sur l’énoncé, il était demandé de privilégier Flexbox. Un chouette site pour apprendre à utiliser ce dernier : http://flexboxfroggy.com/#fr.

Après des heures de galères, de remises en question sur la façon de s’organiser en travail d’équipe, on avait notre magnifique page Google :

Notre page (https://mxrch.github.io/GooglePage/)
La page de Google (https://www.google.com/)

 

Mon repo : https://github.com/mxrch/GooglePage

Comment on s’est organisés finalement ?
On était 5 ce jour-ci, donc Ugo et Melisande ont fait du pair-programming (un qui code, et l’autre le guide en lui disant quoi faire) et faisaient leur propre version, et nous, nous avons fait un deuxième modèle en parallèle pour voir le plus efficace :
Mathieu a créé le repo initial, Simon et moi avons d’abord “fork” le projet , et chacun a travaillé sur une partie de la page : Moi le haut, Mathieu le milieu et Simon le bas, chacun sur son fork, puis on faisait des Pull Requests pour tout assembler.

Sauf qu’après un moment, on s’est rendu compte que ça n’était vraiment pas optimal.
Finalement, on a travaillé sur des branches du repo de Mathieu, puis il s’occupait de “merge” nos branches dans la master. (Il ajoutait nos modifications sur la branche principale du projet).
Quand le merge donnait une erreur (ce qui était presque toujours le cas) Mathieu recollait nos modifications sur la branche master à la main.

Le soir, je suis un peu repassé sur le code de tout le monde pour utiliser Flexbox partout, et rendre ça plus “responsive”, puis le lendemain matin, un peu de peaufinage, et c’était parfait. 👌

Les 3 jours suivants, c’était surtout du Ruby, apprendre à utiliser des méthodes, les boucles, et toutes les magies du code. Par exemple, on avait ce genre de hashs dans un hash :

MENU={
 WELSH = {
  "Lipides" => 38.4,
  "Glucides" => 18.3,
  "Protéines" => 36.3
 },
 FRITES = {
  "Lipides" => 15,
  "Glucides" => 41,
  "Protéines" => 3.4
 },
 BIERE = {
  "Lipides" => 0,
  "Glucides" => 25,
  "Protéines" => 4
 }
}

Et on devait faire une méthode meal_weight_watchers(menu) qui calcule les calories de tout un menu donné.

Une hache ? C’est quoi ?
Un hash est comme un dictionnaire : vous avez à gauche un nom (=une clé), puis à droite sa définition (=sa valeur).

On avait un jour d’avance à chaque fois, et j’étais assez avantagé, ayant déjà développé quelques trucs en Python auparavant.

Pour les curieux qui veulent savoir quelle distribution Linux j’utilise, c’est Deepin 15.7. Je recommande, la meilleure distribution Debian-based. ❤️

Deepin 💙

J’utilise aussi Oh My Zsh pour le shell, avec comme thème powerlevel9k, et comme plugins zsh-autosuggestions et zsh-syntax-highlighting, puis Atom pour coder.


La deuxième semaine

D’après les corsaires, cette semaine est la plus intensive, et je suis d’accord, elle l’est. Mais la plus intensive de toutes, je ne peux pas encore le dire.

Le premier jour, on a appris à utiliser les TDD (Test Driven Development) avec Ruby. C’est des fichiers de tests qu’on va placer à côté de nos fichiers qu’on veut tester. Ils vont vérifier que la valeur que les fonctions retournent est correcte, sinon, elle compare la valeur attendue à celle retournée.

Source : https://www.techtic.com/test-driven-development-methodology/

Pour l’exercice, on a dû cloner ce repo : https://github.com/felhix/learn_ruby_rspec, puis coder les exercices en fonction de ce qu’attendait le fichier test, et des erreurs qu’on recevait.

Le Mardi, on a appris à faire les Gemfiles (en Ruby, on peut installer des Gems, c’est comme des plugins, faits par la communauté, pour offrir de nouvelles fonctionnalités et simplifier la vie des développeurs).
Un Gemfile est un fichier qui liste toutes les Gems dont dépendent notre projet.
Comme ça, l’utilisateur aura juste à faire un :

bundle install

en étant dans le même dossier que le Gemfile.

Puis, on a fait un code de César.
Connue comme une des méthodes de cryptographie les plus anciennes.

Le texte chiffré s’obtient en remplaçant chaque lettre du texte clair original par une lettre à distance fixe, toujours du même côté, dans l’ordre de l’alphabet. Pour les dernières lettres (dans le cas d’un décalage à droite), on reprend au début. Par exemple avec un décalage de 3 vers la droite, A est remplacé par D, B devient E, et ainsi jusqu’à W qui devient Z, puis X devient A etc.

Et enfin, un petit script pour trouver le meilleur jour pour acheter une action et le meilleur pour la revendre, dans une semaine donnée.

Voici par exemple une array de prix : [17,3,6,9,15,8,6,1,10].Pour cet array par exemple, ce sera le deuxième jour (à l’achat) et le cinquième jour (à la revente).

En code, on appelle ce genre de liste des tableaux, donc arrays en anglais.
La fonction doit ressortir quelque chose comme ça :

> trader_du_dimanche([17,3,6,9,15,8,6,1,10])
=> [1,4]  # $15 - $3 == $12

D’un coup, Thomas reçu un appel inattendu.

Qui était au bout de l’appareil ? C’était Mathieu.

Mais pourquoi donc ? Depuis plusieurs jours, Ugo nous parlait de possibles locaux pour notre team, et ils avaient besoin d’un coup de main ce jour-ci pour repeindre les murs et ranger les lieux.

Ugo et Simon, gros bosseurs

 

         The Hacking Project, de la débrouillardise ? Nooon du tout. 😘

Magnifique image de Simon qui peint un mur

 

Notons quand même l’incroyable ingéniosité de Mathieu pour avoir créé un nouvel outil de peintre : le baton-pinceau fabriqué avec du scotch, pour atteindre les hauteurs de la pièce. Bientôt dans vos magasins de bricolage.

Un homme remplit d’imagination

La team Strasbourg à fond dès le matin. 😏

 

Mais ce travail n’était pas vain, puisque le lendemain, les locaux étaient prêts à l’emploi ! Mille merci à Ugo qui a beaucoup travaillé pour, sans oublier le reste de la team. ❤️

Le lendemain, el famoso Bot Twitter.

C’était la bataille pour avoir les clés API. Depuis le RGPD (la nouvelle loi européenne visant à mieux défendre la vie privée des utilisateurs sur internet), Twitter valide manuellement les demandes de clés API.

Mais je comprends rien c’est quoi ces clés API Jamy ?

L’API est ce qui permet à un programme informatique de profiter des fonctionnalités d’un autre programme informatique, tout comme votre écran (associé à une souris et un clavier s’il n’est pas tactile) est ce qui vous permet de profiter des fonctionnalités d’un programme informatique.

Imaginons, tu veux rentrer chez toi et te faire à manger.
Pour cela, tu auras besoin de ta clé. Donc tu les sors, tu les rentres, et tu as accès à ta maison. Tu peux ensuite faire tes petits plats et te mettre bien.

Pour les API, c’est pareil. Tu demandes à Twitter (par exemple) tes clés, puis dès que tu veux créer ou utiliser une application qui intéragit avec Twitter, tu les rentres, et tu as un accès qui s’appelle un “token”. Tu peux ensuite laisser ton application envoyer des tweets automatiquement à une liste de journalistes par exemple.

Et donc, pour en revenir à l’exercice, certains dans la formation ont pu la recevoir, certains dès le matin, d’autres l’après-midi, et d’autres dont moi ont simplement étés refusés. En même temps, je ne m’étais pas foulé pour la demande écrite, je ne vais pas vous le cacher.

Je ne pouvais pas faire mon Bot Twitter sans clés API, et personne de Strasbourg ne les a eu. Mystère et boule de gomme.
Donc j’ai récupéré mon jour d’avance et je suis passé au lendemain.

On a appris l’art du scrapping.
Cela consiste à analyser le contenu d’une page web et extraire des données précises.

Pour cela, on a utilisé la Gem Nokogiri.
Il nous était demandé de :

  1. Récupérer toutes les adresses email des mairies du Val d’Oise ici.
  2. Récupérer tous les cours des cryptomonnaies sur CoinMarketCap.
  3. Récupérer la liste complète des députés de France, puis récupérer leurs adresses email. Pour ce faire, j’ai choisi un beau fichier XML tout propre de nosdeputes.fr disponible ici.
Mon output pour le premier exercice
 Pour le second exercice

Et le troisième

 

Je me suis bien amusé, le scrapping me plaît bien.
Le repo est disponible ici : https://github.com/mxrch/thp_the-crazy-scrapper.

Je posterais le lien des autres parties ici après les avoir écrites, à bientôt ! 💛

Thomas Hertzog ➡️  mxrch

Laisser un commentaire

Choisissez une méthode de connexion pour poster votre commentaire:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion /  Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion /  Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion /  Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion /  Changer )

Connexion à %s