Une journée dans la vie d’un ingénieur Frontend Foundations chez Slack
La première alarme sonne. Roupillon.
La deuxième alarme sonne. Roupillon.
La dernière alarme retentit et je sais que c’est la dernière, alors je saute du lit et joue immédiatement de la musique. La musique a vraiment un moyen de me réveiller, et je joue généralement sur la radio Sofi Tukker ou Rufus Du Sol sur Spotify. Je commence à me préparer à me rendre au gymnase pour une séance d’entraînement matinale. Je ne suis pas matinale, mais je suis matinale. J’adore m’entraîner avant le travail car j’arrive très éveillé et prêt à affronter ma journée de travail!
Je suis au gymnase, brouillant des listes de lecture d’entraînement dont je suis très fier. Je commence par quelques étirements, suivis d’un entraînement en force, et je termine par du cardio et plus d’étirements. Ensuite, je me dirige vers la douche et je me prépare pour le travail. Entre attendre la douche et s’habiller, tout cela prend environ une demi-heure.
Une fois que j’ai terminé, je suis prêt pour une marche de 20 minutes jusqu’au bureau. J’aime écouter des podcasts pendant cette période. Mes favoris incluent On Purpose avec Jay Shetty et Armchair Expert avec Dax Shepherd.
Je suis enfin au bureau. Je ne suis généralement pas le premier au bureau, donc je suis accueilli par de nombreux «bonjour!» De mon incroyable équipe. Je me dirige ensuite vers la cuisine et remplis ma grande cantine d’eau et prends le petit déjeuner. De retour à mon bureau, petit déjeuner à la main, je commence à parcourir mes messages Slack non lus. Ils sont généralement un mélange d’annonces à l’échelle de l’entreprise, de messages spécifiques à l’équipe et d’humour hors sujet. Quelques-uns des messages proviennent de Google Agenda, me permettant de savoir ce que j’ai sur mon calendrier pour la journée: une réunion d’équipe, quelques 1: 1 avec mes coéquipiers et une réunion l’après-midi pour discuter de notre migration vers TypeScript.
J’ai préparé notre base de code frontale pour une adoption généralisée de Typescript et l’une des tâches sur lesquelles je travaille est une transformation personnalisée pour webpack qui génère des définitions PropType pour les composants React qui sont écrites en Typescript. Qu’est-ce qu’une transformation, demandez-vous? C’est quelque chose qui transforme le code d’un état à un autre, à l’aide d’un arbre de syntaxe abstraite (AST). Pourquoi fait-on ça? Nous voulons combler l’écart entre les composants React écrits en Typescript (qui manquent de définitions PropType) et React PropTypes pour les composants existants que nous avons dans notre base de code.
Nous voulons une validation cohérente de proptype lors de la migration de notre Javascript vers Typescript, donc avoir cette transformation dans notre configuration de webpack comblera le fossé entre la validation de prop à la compilation et à l’exécution. Alors que je suis assis à mon bureau pour y travailler, je regarde l’AST de Typescript et les nœuds qui représentent la structure de notre code Typescript, y compris le nœud qui représente la façon dont nous appliquons une définition de type pour les accessoires des composants React. Il s’agit du nœud qui m’intéresse, car je vais l’utiliser pour générer une définition PropType correspondante. Chaque fois que j’inspecte un AST, je suis fasciné. Ce n’est pas tous les jours que vous vous retrouvez à regarder à travers un arbre qui représente le code lisible par l’homme que vous écrivez.
Le nœud que j’examine est un objet avec des paires clé-valeur. Ce qui est déroutant, c’est que les valeurs sont toutes des nombres. Certains correspondent et d’autres non. Que pourraient-ils représenter? Hmmm… je vais y jeter un œil après le déjeuner. Pour l’instant, je dois me diriger vers mon standup d’équipe.
Stand-up d’équipe! Beaucoup de gens connaissent ce type de réunion. Cela nous donne la possibilité de partager des mises à jour sur notre travail, de dénoncer les bloqueurs et de partager sur quoi nous travaillerons ensuite. Après cette brève réunion, nous nous dirigeons vers le déjeuner.
Il est temps de prendre le déjeuner! J’ai l’habitude de préparer le déjeuner, mais j’aime profiter de ce temps pour marcher avec mes collègues dans les food trucks à proximité. C’est un excellent moyen de prendre un peu d’air frais et de se promener. Notre bureau a quelques cafés, donc nous retournons généralement à l’un d’eux après avoir pris quelque chose à manger. Le déjeuner est un moment idéal pour mieux connaître mes coéquipiers. Ce jour-là, nous parlons de nos expériences au lycée. Il n’est pas surprenant que j’aie eu des intérêts assez ringards et que j’ai participé au Model United Nations Club, aux concours de mémorisation de Pi et au gouvernement étudiant.
D’accord, je suis de retour à mon bureau. J’ouvre VSCode pour commencer à rechercher ce que ces chiffres dans mon TypeScript AST pourraient signifier. Je demande à mon coéquipier Andrew de s’associer avec moi à ce sujet, et il recommande que je jette un œil au package npm Typescript pour voir si ces numéros existent à l’intérieur du package. Après un rapide grep, je trouve un dictionnaire qui contient des mappages pour les nombres que j’ai vus dans le nœud AST! C’est une victoire, car je ne suis plus perplexe. Je peux clairement voir qu’ils représentent différents «symboles», qui constituent la syntaxe de la langue. Les clés du dictionnaire représentent les types primitifs et non primitifs dans Typescript. Les valeurs du nœud font référence aux types. À partir de là, nous pouvons construire un nouvel objet qui deviendra plus tard notre React PropType.
14h00
Une rencontre avec mon coéquipier, Mark. Mark est un ingénieur principal de notre équipe et m’aide à comprendre comment mon travail a un impact sur Slack d’un point de vue plus large. J’apprécie vraiment nos 1: 1 car cela finit généralement par être une session de mentorat non officielle. Nous nous réunissons une fois toutes les deux semaines et partageons des mises à jour sur ce sur quoi chacun de nous a travaillé et ce qui nous préoccupe. C’est le bon moment pour lui demander son avis et ses conseils sur la manière dont je fais mon travail et sur la façon d’exercer le leadership. J’espère que je lui serai aussi utile qu’il l’a été pendant le temps que j’ai passé dans notre équipe.
Je suis en réunion avec un ensemble diversifié de collègues: deux responsables d’ingénierie, un ingénieur backend et deux ingénieurs frontend (moi y compris). Nous sommes ici pour parler de la récente migration de notre équipe backend pour migrer de PHP vers Hack. Nous sommes curieux de connaître leur avis, car cette migration est analogue à un effort actuellement en cours pour adopter TypeScript dans notre base de code frontale. Le but de cette réunion est pour nous, ingénieurs frontend, de rassembler les apprentissages et les pièges de la migration de PHP vers Hack et, espérons-le, d’éviter certains des mêmes pièges. Comme de nombreux ingénieurs le savent, la seule constante est le changement. Dans ce cas, nous modifions notre base de code frontale pour qu’elle soit plus sûre à utiliser, auto-documentée et plus facilement testée grâce aux types statiques. Nous sommes en train de prendre en charge l’adoption de Typescript dans notre base de code monolithique, et nous sommes impatients d’évangéliser son adoption dans les prochains mois.
Je termine les choses au travail et je rentre chez moi. C’est le pire moment pour quitter notre immeuble: je serai coincé dans ma navette de banlieue pendant les heures de pointe à SoMa. Il me faudra 45 minutes pour rentrer chez moi, même si je ne vis pas loin du bureau. Une fois à la maison, je déballe mon sac de sport et commence à préparer le dîner. Malgré tout mon intérêt pour la cuisine et les activités culinaires, je fais rarement quelque chose d’intéressant pour moi pour le dîner. C’est généralement des œufs et du pain grillé, des restes ou rien du tout (si je rentre juste de notre happy hour hebdomadaire le jeudi). Pendant que j’apprécie le dîner, je vais regarder l’une des émissions de Real Housewives sur Bravo, ou m’aventurer sur YouTube et trouver des vidéos de l’équipe de Bon Appetit. Pendant ce temps, je vais également appeler et envoyer des SMS aux membres de ma famille, ou errer sans but sur Instagram.
Natalie est ingénieur frontend senior chez Slack. Lorsque Natalie a rejoint Slack, elle a travaillé sur les fonctionnalités pour les nouveaux utilisateurs et les nouveaux créateurs d’équipe avec l’équipe New User Experience. Plus récemment, elle a rejoint l’équipe de Foundations et travaille sur l’infrastructure frontale, afin que les autres ingénieurs frontaux de Slack soient aussi productifs que possible. Elle introduit actuellement Typescript dans la base de code frontale de Slack.
Conférencière, Natalie a récemment pris la parole au GraphQL Summit de San Francisco et O’Reilly Fluent à San Jose. Vous pouvez trouver des liens vers ses conférences sur Twitter @natqab.
Avant Slack, Natalie travaillait en tant qu’ingénieur full-stack chez Zillow Group à San Francisco, utilisant React, Typescript, Node et GraphQL pour déployer des applications Web à l’aide de l’infrastructure AWS (je sais, beaucoup de mots à la mode). Avant de déménager à San Francisco, elle a étudié à l’Université de Californie à Davis où elle a obtenu un baccalauréat ès sciences en informatique.
