Smashing Podcast Épisode 18 Avec Mina Markham : Comment puis-je apprendre à réagir ?

Dans cet épisode du Smashing Podcast, nous parlons d'apprendre React. À quoi ressemble React et comment les développeurs expérimentés peuvent-ils commencer ? J'ai parlé à Mina Markham pour le savoir.

Afficher les remarques

• Mina Markham sur Twitter
• Site personnel de Mina

Mise à jour hebdomadaire

• Des sites statiques aux applications JAMstack de l'utilisateur final avec FaunaDB par Bryan Robinson
• Votre site Web stresse-t-il les visiteurs ? par Suzanna Scacca
• Mirage JS Deep Dive : Comprendre le timing, la réponse et le passthrough (Partie 3) par Kelvin Omereshone
• Construire une application Web de reconnaissance faciale avec React par Adeneye David Abiodun
• Internationalisation dans Vue avec le plugin Vue I18n par Timi Omoyeni

Transcription

Drew McLellan : Elle est architecte front-end, conférencière et organisatrice de conférences, et amoureuse des systèmes de conception. Son travail sur la bibliothèque de brevets Pantsuit pour la campagne présidentielle Hillary for America d'Hillary Clinton a marqué un tournant pour les systèmes de conception au sein de l'industrie et a été présenté dans des publications telles que Wired, Fast Company et Communication Arts. Comme beaucoup d'entre nous, elle écrit du code pour gagner sa vie, actuellement en tant qu'ingénieur senior chez Slack. Nous savons donc qu'elle est une développeuse talentueuse et avant-gardiste, mais saviez-vous qu'elle a déjà été confondue avec Patrick Swayze ? Mes meilleurs amis, veuillez accueillir Mina Markham. Salut Mina. Comment vas-tu?

Mina Markham : Je suis fracassante.

Drew : C'est bon à entendre. Maintenant, parfois sur le Smashing Podcast, nous parlons aux gens du sujet pour lequel ils sont le plus connus. Et parfois, c'est amusant de parler de quelque chose d'un peu tangentiel. Maintenant, je pourrais discuter avec vous toute la journée des bibliothèques de modèles, des systèmes de conception, du travail incroyable que vous avez accompli dans ce domaine particulier, et je pourrais vous parler de sujets dont vous avez peut-être parlé, d'événements, tels que l'événement À part, des choses comme la direction artistique. Et on pourrait évidemment parler de CSS jusqu'à ce que les vaches rentrent à la maison. Mais vous avez tweeté il y a quelques jours, et j'ai réalisé que nous étions tous les deux dans le même bateau en ce sens que nous sommes tous les deux des ingénieurs expérimentés et que nous avons tous les deux commencé à travailler avec React. Donc, avant de passer à React lui-même, où en étiez-vous jusqu'à présent ? Avez-vous travaillé avec d'autres bibliothèques et frameworks pour le développement JavaScript ?

Mina : Non, en fait, je fais principalement du JavaScript vanille depuis un moment. Et avant cela, bien sûr, je me suis mis à JavaScript. Permettez-moi de reformuler cela. J'ai commencé à travailler avec Java script en utilisant jQuery parce que c'était le plus logique pour moi. C'était quelque chose qu'il était très facile pour moi d'analyser pour comprendre ce qui se passait. Et puis à partir de là, je suis revenu à faire juste de la vanille, du JavaScript simple, de l'ESX, et je n'avais pas vraiment trop pénétré dans les guerres de framework. Je n'avais pas, comme je n'avais pas de favori. Je n'avais pas de chien dans le combat. Je me disais: «Pour toi, React, peu importe. Je ne m'en soucie pas vraiment. Mais les temps changent.

Drew : Et dans ce genre de façon de travailler avec du JavaScript vanille, parce que j'en ai fait beaucoup moi-même aussi. J'ai travaillé avec différents frameworks. J'ai fait beaucoup de choses avec jQuery à l'époque. J'ai travaillé avec YUI, Yahoo User Interface Library. Avez-vous ressenti de nombreux points douloureux que quelque chose comme l'architecture de React essaie de résoudre ?

Mina : Je ne pense pas que j'ai jamais eu. J'ai passé la majeure partie de ma carrière à créer des sites Web plutôt que des applications Web et des choses comme ça. Donc tout ce que je faisais était assez statique jusqu'à un certain point. Je n'ai donc jamais vraiment eu à m'occuper de la gestion de l'État, des choses comme ça. Donc, les points douloureux que React tente de résoudre, je ne les avais jamais vraiment appliqués au type de travail que je faisais.

Drew : D'une manière générale, quelle est la nature des projets que vous avez avec React jusqu'à présent ?

Mina : Ce n'était en fait qu'un seul projet, sur lequel je travaille actuellement et je ne peux pas donner trop de détails parce que l'entreprise publique et toutes ces bonnes choses.

Drew : Bien sûr.

Mina : Mais essentiellement, ce que j'essaie de faire, c'est d'utiliser React, c'est un type de produit très interactif où j'ai besoin que les gens puissent entrer et enregistrer des données à un certain état, puis les manipuler et générer autre chose avec lesdites données. Et c'est juste quelque chose qui n'est pas une simple manipulation du DOM à ce stade. C'est vraiment beaucoup plus complexe, la gestion frontale des données et la gestion de l'état desdites données. Il n'y avait donc vraiment pas d'autre alternative que d'utiliser une sorte de bibliothèque qui tente de résoudre ce problème. Je savais que je ne serais pas capable de passer avec du JavaScript tout simple. J'ai envisagé de gérer peut-être quelque chose du côté serveur, mais encore une fois, en raison de la nature très interactive de ce avec quoi je travaille, cela doit être dans le client. Et donc nous utilisons déjà React chez Slack pour diverses autres choses. Et donc je me suis dit: "D'accord, eh bien, nous devrions simplement aller de l'avant et adopter la même chose que le reste de la société mère que les entreprises utilisent et partir de là."

Drew: L'une des choses qui me semble toujours être un point douloureux pour les gens qui choisissent React est de maîtriser la chaîne d'outils nécessaire pour faire fonctionner les choses, Webpack étant un éléphant évident dans la pièce. Avez-vous eu à faire beaucoup de configuration de la chaîne d'outils ou comme moi si vous aviez le luxe d'avoir des coéquipiers le faisant pour vous ?

Mina : Oh, j'adore l'équipe d'infrastructure de Slack the data. L'équipe d'infrastructure frontale de Slack a géré tout cela. Je n'ai pas eu à y penser. C'était super. Parce que j'ai essayé d'apprendre React avant dans le passé. Habituellement, la meilleure façon d'apprendre est de travailler et de mettre en œuvre des choses. Et nous utilisons React pour construire beaucoup de hillaryclinton.com en 2016. Ce n'est donc pas comme si je n'avais jamais travaillé avec des gens qui l'utilisent. C'est juste que mon travail n'a jamais eu directement besoin de moi pour m'impliquer. Mais cette base de code était très complexe et très sophistiquée, et il se passait tellement de choses qu'il y avait une telle barrière à l'entrée pour essayer d'apprendre quoi que ce soit là-dedans si vous ne saviez pas déjà comment React et Redux et tout cela fonctionnent, ce que je pas. Je n'étais donc pas vraiment efficace pour apprendre dans cet environnement.

Mina : Heureusement, ici, j'ai des gens qui aiment en retirer un peu plus des éléments complexes. Je n'ai pas du tout à me soucier de la configuration Webpack. Cela a été mis en place. Cela a été essayé et testé et prêt à partir. Je suis dans un bateau similaire où nous utilisons également Redux en plus de React, dont je ne savais pas qu'il s'agissait de deux choses différentes. Je ne savais pas quelle partie gérait quoi. Tomber dans une base de code comme celle-là, c'était un peu désorientant parce que je n'avais pas réalisé qu'ils étaient tous la même chose. Des développeurs chevronnés de React m'ont dit : « Oh, nous utilisons également Redux, ce qui rend un peu plus difficile pour vous d'apprendre vraiment ce que React peut faire si vous partez de zéro. Et je n'ai jamais vraiment su ce qu'ils entendaient par là parce que je ne savais pas de quoi ils parlaient.

Mina : Pour répondre à votre question initiale, j'ai encore un peu plus d'obstacles à l'entrée, car il ne s'agit pas seulement d'apprendre React. Je dois apprendre React et aussi comment utiliser le magasin Redux. Donc, ces deux choses en même temps peuvent être un peu trop.

Drew : Ouais, j'ai trouvé exactement la même chose dans une base de code existante que mon premier projet React qui utilise Redux. Et je pense que comme c'est la nature de n'importe laquelle de ces sortes de technologies quand elles sont jeunes, elles itèrent très rapidement, et ce qui est la meilleure pratique à un moment donné, 6 mois plus tard a évolué et il y a une façon différente de faire les choses. Et lorsque vous avez une base de code qui s'étend sur de nombreuses années, vous pouvez parfois avoir différents styles d'implémentation. Il ne reste pas toujours synchronisé. Et bien sûr, si vous suivez un tutoriel ou quoi que ce soit pour apprendre, vous lisez des livres, vous utilisez des ressources, elles seront dans la version la plus moderne de la façon de faire les choses. Et cela ne correspond pas nécessairement à ce que vous voyez lorsque vous regardez un produit existant et mature. Est-ce quelque chose que vous avez expérimenté ou avez-vous réussi à maintenir votre base de code vraiment à jour ?

Mina : Je pense que c'est quelque chose que j'ai vraiment vécu. Quand j'ai essayé d'apprendre à faire React par moi-même, j'ai regardé divers tutoriels et des choses comme ça. Et j'ai remarqué, ou du moins des gens m'ont dit qui ont travaillé avec moi que certaines des choses que nous faisons ou une sorte d'anti-modèle ou pas tout à fait comment les choses fonctionnent maintenant, parce que cette base de code est légèrement, eh bien mûrir nous relative, mais c'est quelques années. Et donc il y a des façons qui, je suppose, sont plus faciles à faire que la façon dont nous les faisons actuellement parce que cela a été écrit il y a des années. C'est donc un peu un tapis roulant essayant de suivre l'actualité et de m'assurer que je veux faire les choses de la meilleure façon, mais je ne veux pas non plus casser une base de code établie parce que je veux jouer avec des trucs.

Drew : Évidemment, l'une des choses avec React que des gens comme vous et moi y arrivons, ça peut sembler un peu choquant comme tout ça avec JSX. Utilisez-vous JSX dans votre projet ?

Mina : Nous le sommes. J'utilise JSX.

Drew : Avez-vous fait la paix avec ça ?

Mina : J'ai l'impression qu'un petit morceau de moi meurt à chaque fois que j'ouvre un de ces fichiers. C'est toujours un sacrilège de mettre mon code HTML dans le fichier JavaScript. Je sais que c'est un peu révolutionnaire et c'est tout l'intérêt, mais j'ai l'impression que j'écris mon balisage dans un fichier JavaScript. J'ai fait la paix avec ça, mais chaque fois que je le fais, je me dis juste, "..." Les soucis de séparation, c'est une chose. Je voudrais le récupérer, s'il vous plaît.

Drew : C'est un point valable, n'est-ce pas ? Mon expérience lorsque j'ai commencé à travailler plus sérieusement avec JavaScript, et c'était probablement lorsque j'étais de retour chez Yahoo, les choses étaient vraiment sur le modèle des pages HTML rendues par le serveur, puis en adoptant une approche d'amélioration progressive, en superposant JavaScript pour améliorer L'interface. Et si l'état de quelque chose dans l'interface devait changer, votre code devait connaître toutes les parties de l'interface qu'il devait mettre à jour, ce qui vous conduit évidemment à une approche étroitement couplée avec ces grandes vues monolithiques où le code que vous écrivez doit connaître tous les autres codes qui l'entourent. Et je suppose que cela ne se prête pas vraiment à une approche par composants que vous adopteriez lorsque vous travaillez avec une bibliothèque de modèles ou un système de conception, ce qui correspond davantage à votre domaine d'expertise particulier. Je suppose que React se prête davantage à cette approche, n'est-ce pas ?

Mina : Je pense que oui, surtout avec la possibilité de coupler le CSS très spécifique à un composant JSX ou React. Et de cette façon, il est beaucoup plus facile de séparer ou de ne prendre que ce dont vous avez besoin pour la bibliothèque et de laisser le reste, alors qu'une bibliothèque de modèles ou un système de conception qui tente de faire quelque chose de plus monolithique avec un seul gros fichier CSS de style ou quelque chose comme ça , cela rend les choses très difficiles. Il faut en quelque sorte tout prendre ou rien. J'apprécie donc que React nous permette de faire un développement plus individualisé et plus composant, même si je souhaite toujours qu'il y ait un moyen pour moi de vraiment séparer ma couche de présentation et ma couche de contenu de ma couche d'interactivité. Mais peut-être que c'est juste moi qui suis un peu old school dans ce sens.

Drew: Je ressens définitivement la douleur là-bas. L'idée est que, venez me corriger si je me trompe, ma compréhension est que plutôt que de séparer les technologies, le CSS, et le JavaScript, et le HTML, c'est séparer la fonctionnalité. Donc, tout ce qui est un composant existe tous ensemble-

Mina : Ouais.

Drew : … ce qui, je suppose, est utile si ce composant n'est plus nécessaire. Vous pouvez simplement le supprimer, et il est parti, et il ne laisse pas d'empreinte autour de votre application. Ce n'est pas toujours le cas avec CSS. Comment travaillez-vous avec CSS avec React ? Avez-vous regardé des choses comme les composants stylés ou quelque chose comme ça ?

Mina : Non, nous ne l'avons pas fait. J'ai entendu parler de composants de style, mais je ne les ai jamais vraiment étudiés de manière très approfondie pour être parfaitement honnête. Donc, la façon dont nous travaillons avec CSS avec React est que nous écrivons Less, et nous avons juste un fichier Less attaché à chaque composant individuel qui est importé dans ce composant. Et puis il est lié via Webpack et servi au client.

Drew : Utilisez-vous un système comme BEM ou quelque chose pour transformer l'espace de noms ?

Mina : Ouais. Nous utilisons BEM pour l'espacement des noms, bien que le respect de celui-ci varie en fonction de qui écrit quoi. Mais nous essayons d'utiliser un modèle d'espacement de noms BEM pour clarifier un peu le but de chaque classe et composant individuel.

Drew : Et cela semble-t-il fonctionner avec succès pour vous ?

Mina : Je pense que oui. Parfois, il a un peu le même vieux problème de parfois je ne sais pas comment nommer quelque chose. Après un certain temps, les choses quotidiennes ont toujours été et seront toujours difficiles pour le maître. C'est donc le seul problème que j'ai avec, c'est que je n'ai parfois aucune idée de ce que je devrais appeler un composant particulier.

Drew : Absolument. C'est une bataille constante, n'est-ce pas, comment nommer les choses ?

Mina : Ouais.

Drew : Je finis toujours par travailler sur une nouvelle fonctionnalité ou quelque chose comme ça, vous donnez à un composant et à toutes les classes et à tout le nom que la fonctionnalité a pour le moment. Et puis au moment où vous venez de lancer, il a été renommé quelque chose d'autre. Vous avez donc des références à l'ancien nom dans le code et l'interface a le nouveau nom. Et …

Mina : J'essaie de toujours nommer les choses en fonction de leur fonction ou de leur objectif par rapport à des choses un peu plus éphémères, car il est moins probable que l'objectif réel de ce composant change. J'ai oublié de mentionner, mais en plus d'utiliser BEM, je suppose que nous utilisons les BEMIT si vous êtes familier avec cela. Il s'agit essentiellement de l'ITCSS plus BEM, tous deux créés par Harry Roberts. J'utilise donc la notation hongroise pour indiquer si quelque chose est ou non un composant, par rapport à un objet de mise en page, par rapport à un modèle plus large composé de plusieurs composants. Et puis à partir de là, nous utilisons la convention BEM pour signifier comme l'élément de bloc et tout ça.

Drew : Et avez-vous dû faire beaucoup de refactorisation et de suppression de composants et d'éléments dans votre base de code et avez-vous dû faire face au problème du CSS laissé pour compte ?

Mina : Ouais. Donc, la partie non-React de mon travail, de maintenir slack.com, c'est juste un tas de fichiers Less qui sont compilés pour CSS. Et je vous garantis qu'il y a beaucoup de code zombie là-dedans, parce que nous itérons certainement beaucoup au-dessus des choses depuis que je suis là-bas. Et nous n'avons pas toujours le temps de revenir en arrière et de faire le nettoyage par rapport à la refonte d'une page ou quelque chose du genre. Il est donc en retard pour une vérification, je dirai que.

Drew : C'est quelque chose que nous venons d'examiner dans notre projet React, en examinant comment nous abordons CSS. Pour le moment, nous avons quelques gros fichiers CSS globaux pour l'ensemble de l'application, et nous obtenons cette situation où la taille de notre bundle ne fait que croître, et croître, et croître et ne devient jamais plus petite, même si les choses deviennent supprimé. Nous avons donc examiné des éléments tels que les composants stylés. Tailwind est également une autre option que nous envisageons sérieusement. Avez-vous beaucoup regardé le vent arrière?

Mina : Je ne l'ai pas beaucoup regardé. J'étais curieux à ce sujet, mais encore une fois, je n'ai jamais vraiment eu le temps de creuser pour voir si c'est quelque chose que je veux essayer d'intégrer à notre base de code.

Drew : J'ai été en fait assez surpris, car comme vous, je suis un peu de la vieille école avec la façon de faire ces choses. J'aime bien la séparation des préoccupations. Et j'aime écrire mon CSS en CSS, et bien sûr l'approche avec Tailwind est que vous avez tous ces noms de classe, qui ressemblent un peu aux styles en ligne que vous appliquez. Et s'il se sent sale.

Mina : Ouais.

Drew : Et je me suis porté volontaire au sein de l'équipe, nous avons chacun pris une technologie pour déterminer si elle serait adaptée à nos problèmes, et je me suis porté volontaire pour regarder Tailwind parce que j'étais absolument certain que j'allais le détester.

Mina : Non, non.

Drew : Mais il s'avère que je pense en fait que cela résout beaucoup de problèmes. J'ai été assez impressionné.

Mina : Ouais. Je suis en quelque sorte venu à une façon de penser similaire, parce que dans le passé, je préférerais de loin qu'une classe comprenne tous les styles dont j'avais besoin pour un composant particulier et ne fasse pas une classe par propriété, comme je pense que Tailwind le fait ou des langues comme ça. Pour les mêmes raisons, cela ressemblait beaucoup à "Eh bien, je n'utilise que du CSS en ligne à ce stade. Pourquoi ferais-je cela ? Mais au fur et à mesure que je développais de plus en plus, à l'intérieur de notre système de conception Slack, j'ai créé un tas de ce que j'appelle des classes utilitaires qui font des choses comme ajouter un peu de marge avec un motif. J'ai remarqué que de plus en plus, j'utilise ces classes en plus des classes de composants. Donc je me dis, "D'accord, eh bien, je devrais peut-être revoir tout cela pour faire un CSS comme une déclaration à la fois." Je ne sais pas si j'irais aussi loin, mais cela vaut vraiment la peine d'être considéré.

Drew : L'informatique semble faire volte-face en termes de tendances entre les clients légers et les clients lourds. Nous avons commencé avec les ordinateurs centraux avec des terminaux, puis l'ère du PC avec Windows et Office et toutes ces sortes de grosses applications. Et ils devenaient tous très lents, et le Web est arrivé, et ce n'était qu'un navigateur, et tout le travail était effectué sur le serveur. Et tout était à nouveau rapide et rapide. Et maintenant, nous avons recommencé à remettre tout ce travail dans le navigateur, tout étant fait avec JavaScript, des choses comme React et l'approche JAMstack où nous revenons à une sorte de gros client. Je crains parfois que nous en demandions trop au navigateur. Est-ce une erreur ? Est-ce que nous demandons trop au navigateur qui essaie de faire tout cela dans React ?

Mina : Je veux dire oui avec la mise en garde, encore une fois, mon expérience est très limitée aux sites Web principalement statiques. Je ne fais pas beaucoup de développement de produits. Alors peut-être que dans ce domaine, cela a plus de sens. Mais de mon point de vue, j'ai l'impression que nous utilisons souvent une hachette alors que nous n'avons besoin que d'un couteau à beurre. Je ne sais pas pourquoi nous devons mettre tout cela dans le navigateur, mettre autant de travail et tant de pression sur le client. J'ai l'impression qu'on pourrait faire ça beaucoup plus simplement. L'une des choses qui m'a toujours fait un peu hésitant à utiliser React, ou je dis hésitant, mais ce que je veux dire quand cela m'a mis viscéralement en colère et que je m'y suis activement opposé, c'est quand j'allais sur un site Web et que rien ne rendrait littéralement parce qu'il y avait était une erreur ou quelque chose, comme, « Vraiment ? La page entière est cassée parce qu'une fonction est tombée en panne ? »

Mina : Ça m'a un peu ennuyé que souvent c'était une approche tout ou rien. L'une des conférences que j'ai données à l'AEA dans le passé et à d'autres endroits dans le passé parlait de la façon d'inclure l'amélioration progressive et pas seulement votre développement, mais aussi la direction artistique et la conception des sites. Et je soulignerais spécifiquement des exemples de sites Web qui n'ont pas fait d'amélioration progressive ou de toute sorte de dégradation gracieuse. C'était comme si vous aviez le JavaScript en cours d'exécution dans le navigateur ou que vous n'obteniez absolument rien. Et ce serait comme un simple site qui représenterait des informations sur l'histoire de la conception Web, qui était l'un des sites dont on parlait réellement, l'histoire de la conception Web de 1990 à aujourd'hui. C'était un beau site Web avec beaucoup de chronologies, d'animations de choses. Mais il aurait également pu être rendu statiquement avec juste une liste. Il y avait des étapes entre ne rien montrer et montrer cette expérience magnifiquement améliorée qui, je pense, s'est perdue à cause de la façon dont nous abordons le développement Web moderne maintenant.

Drew : Donc, diriez-vous qu'il existe absolument certaines catégories de projets qui conviennent à une solution comme React et d'autres où elle ne devrait vraiment pas être utilisée et où vous devriez utiliser des méthodes plus traditionnelles ?

Mina : Je pense que si votre site est principalement statique, il ne faisait que fournir des informations, je suppose que je ne comprends pas pourquoi vous avez besoin d'un projet comme React pour rendre quelque chose qui n'a pas beaucoup d'interaction au-delà de la simple manipulation du DOM . Je suppose que je ne vois pas quel avantage vous en retirerez. Encore une fois, je ne travaille peut-être pas sur les projets appropriés. Je n'ai peut-être pas simplement vu ou trouvé ce cas d'utilisation, mais j'ai du mal à voir s'il s'agit simplement d'un site principalement statique, présentant du contenu, pas beaucoup d'interaction, pas beaucoup d'interaction au-delà du DOM manipulé et des animations. Je ne vois pas en quoi le fait d'avoir une bibliothèque React vous aide à atteindre cet objectif.

Drew : C'est intéressant parce que je n'en parle pas mal parce que je ne l'ai pas vraiment utilisé, mais je vois beaucoup de projets Gatsby et Gatsby étant un générateur de site statique qui utilise un front-end React. Et je vois que tous les exemples de thèmes et de choses dont ils disposent sont tous des sites basés sur le contenu, ou des blogs, et un site de recettes, et un portfolio, et ce genre de choses. Et il y a quelque chose que je pense en fait que ce n'est pas nécessairement la bonne solution pour quelque chose comme React. Pourquoi cela n'est-il pas rendu statiquement puis progressivement amélioré ?

Mina : Ouais.

Drew : Ce n'est pas un logiciel.

Mina : Ouais. Je n'ai pas non plus utilisé Gatsby. J'ai entendu beaucoup de bonnes choses à ce sujet, mais c'est probablement l'un des exemples auxquels je penserais : « D'accord, je suppose que je ne vois tout simplement pas pourquoi cet outil est nécessaire pour faire ce travail particulier. ” Encore une fois, je ne sais pas. C'est peut-être simplement parce que plus de gens sont à l'aise d'écrire dans React lorsqu'ils écrivent autre chose, et cela fournit simplement un outil qui rencontre les gens là où ils se trouvent. J'ai entendu de bonnes choses sur les générateurs de sites statiques qui utilisent React pour les personnes qui les ont utilisés et les aiment, mais ce n'est pas un cas d'utilisation que j'aurais immédiatement dit, "Oh, ça a du sens."

Drew : Il semble qu'il y ait toujours eu cette bataille entre ce que nous appellerions un site Web et ce que vous pourriez appeler une application Web. Et le gouffre entre les deux semble s'élargir de plus en plus, alors qu'une approche d'amélioration progressive tente de combler l'écart en prenant quelque chose de statique et en ajoutant du JavaScript et en ajoutant de l'interactivité. Il semble que des choses comme React conviennent parfaitement aux logiciels que vous exécutez dans le navigateur. Serais-tu d'accord avec ça?

Mina : Je serais tout à fait d'accord avec ça parce que j'ai l'impression qu'il a été construit pour ce type d'environnement ; il a été conçu pour exécuter des logiciels. Il a été construit par Facebook pour Facebook. Il a donc été construit pour un produit. Il a été conçu pour exécuter ce que vous appelez une application Web dans le navigateur et pas nécessairement pour le type de travail que, comme je l'ai mentionné, j'ai l'habitude de faire. Je pense donc que dans ces scénarios, il est tout à fait logique de l'utiliser si vous créez un logiciel plus complexe et plus sophistiqué destiné à s'exécuter dans un navigateur. Mais si vous construisez un site marketing ou quoi que ce soit, je suppose que j'aurais encore du mal à comprendre pourquoi ce sera nécessaire là-bas.

Drew : Alors, donnons-nous aux gens la permission de continuer à créer des sites Web décents et rendus de manière statique ?

Mina : J'aimerais voir plus de cela se produire. J'ai l'impression que c'est un peu perdu et que c'est en quelque sorte perdu, si jamais c'était cool ou quoi que ce soit. J'ai l'impression que nous avons perdu cette partie du développement Web. C'est tellement drôle : vous et moi avons tous les deux dit que nous étions un peu de la vieille école, et j'en rigole parce que je fais du développement web depuis, quoi, six ans maintenant ? Comment suis-je vieille école? Cela ne fait pas si longtemps pour moi. Et pourtant, je fais partie de la vieille garde qui n'aime pas les choses nouvelles et brillantes. Je ne comprends pas.

Drew : Donc, en fait, React existe depuis que vous êtes développeur Web.

Mina : Peut-être que j'ai juste une vieille âme. Je ne sais pas.

Drew : Je pense que c'est probablement le cas. Je n'ai pas regardé personnellement, il existe des approches rendues côté service que vous pouvez adopter avec les applications React. Avez-vous vécu l'un de ceux-ci?

Mina : Je n'en ai pas connu. Je les ai brièvement examinés pour le projet sur lequel je travaille actuellement, car j'ai l'impression qu'il y a des parties de l'opération qui fonctionneraient mieux sur un serveur que sur les clients. Mais je pense qu'en raison de mes connaissances limitées et du fait que la base de code est un peu plus compliquée que je ne peux le comprendre, je n'étais pas tout à fait capable de comprendre comment faire fonctionner cette partie. J'adorerais finir par le découvrir, mais j'ai passé une journée à creuser dedans. Je me disais : "Tu sais quoi ? Je ne suis pas en train d'oublier ça, j'en ai besoin. Donc je vais juste reculer et prendre un itinéraire différent.

Drew : Ouais. Je pense que nous sommes tous passés par là.

Mina : Ouais. J'ai descendu un chemin. J'étais comme, "Oh, c'est sombre et effrayant. Inversons. Inversons.

Drew : Éloignez-vous du code.

Mina : Oui.

Drew : Vous avez donc été très diplomate et poli à propos de React jusqu'à présent. Je sens qu'il y a un peu de tension qui bouillonne sous la surface. Allez. Dites-nous ce que vous ressentez vraiment.

Mina : J'ai été poli et diplomate, principalement parce que la base de fans de Reacts peut parfois être un peu méchante, et je préférerais qu'ils ne viennent pas pour moi. Alors s'il vous plaît, React est génial. C'est merveilleux. Utilisez-le pour ce que vous voulez en faire. Je plaisante, mais même ce tweet que vous avez mentionné au début de ce podcast où je pense que ce que vous avez dit, c'est que je ne le déteste pas. Je ne l'aime pas, mais je ne le déteste pas. Même cette déclaration, j'ai eu des gens, il n'y avait pas de vitriol, mais c'était plutôt eux qui étaient prêts à prendre la défense et à dire: "Eh bien, j'adore ça parce que X, Y, Z." Je me dis : « Je n'ai pas dit que c'était mauvais. Je viens de dire que je suis moi à propos de tout ça. Mais apparemment, être meh n'est pas acceptable. Je dois l'aimer.

Mina : C'est pourquoi j'ai probablement été un peu plus diplomate que je ne le serais d'habitude, simplement parce que je ne veux pas que les gens pensent que je parle mal, parce que ce n'est pas le cas. Il a une place dans plus de développement web. Il remplit une fonction. Il fait bien son travail. Les gens adorent ça. Ce n'est tout simplement pas un outil que j'ai jamais eu ou que j'ai voulu utiliser jusqu'à présent.

Drew : Ouais. Les choses peuvent devenir très tribales, n'est-ce pas, avec des gens qui se sentent obligés de prendre parti pour un parti ou un autre, et vous êtes soit absolument pour quelque chose, soit absolument contre quelque chose ? Et je ne suis pas sûr que cela serve un bon objectif, et je ne pense pas que cela nous fasse vraiment avancer en tant qu'industrie et en tant que communauté de faire cela.

Mina : Ouais. C'est vraiment étrange. C'est fascinant à regarder d'un simple point de vue sociologique, mais c'est souvent vraiment bizarre à observer. C'est comme si je n'avais pas le droit d'être, comme je l'ai dit, neutre sur certaines choses. Je dois avoir une opinion bien arrêtée, c'est-à-dire que je ne pense pas qu'elle soit saine. Quel est le terme "opinions fortes, vaguement partagées ?" C'est un peu ma façon d'aborder les choses. Je ressens fortement certaines choses, mais ce n'est pas comme si tu ne pouvais pas me faire changer d'avis. Là où j'ai l'impression que certaines personnes, leur identité est enveloppée dans certains aspects de celle-ci, que si vous n'êtes pas pour ce à quoi ils ont choisi de s'identifier, c'est un affront personnel contre juste, je ne me soucie pas de ce sujet particulier, ou un outil, ou quoi que ce soit.

Drew : Oui. Je ne sais pas si c'est aggravé par le fait que nous avons tous tendance à nous spécialiser beaucoup plus dans des parties particulières de la pile. Et je sais qu'il y a des gens qui sont développeurs React. Ils s'appelleraient eux-mêmes des développeurs React parce que c'est ce dans quoi ils travaillent. Et ils n'écriraient pas nécessairement de script Java vanille ou n'utiliseraient pas Vue ou autre. React est leur monde. Donc je suppose que cela ressemble presque à une attaque contre toute leur carrière de dire: "Je n'aime pas React." Eh bien, ils sont vraiment investis pour vous faire aimer React ou quelle que soit la technologie.

Mina : J'admets avoir été l'une de ces personnes dans le passé. En fait, il s'agissait probablement principalement de SASS, je crois. J'étais vraiment dans l'équipe de SASS en tant que préprocesseur et tous les autres préprocesseurs sont des déchets. Je ne veux pas parler d'eux. Je ne veux pas traiter avec eux. Et j'ai réalisé que c'était une façon très étroite de voir les choses. Utilisez l'outil approprié pour le travail. Tout ce qui vous rend plus productif, c'est le bon outil. Peu importe ce que c'est.

Drew : Y a-t-il des technologies avec lesquelles nous travaillons qui n'ont pas ce genre de sensation tribale ? Y a-t-il quelque chose que les gens sont simplement heureux d'utiliser ou de ne pas utiliser ? Je ne peux penser à rien.

Mina : Waouh. Personne n'a d'opinion sur le balisage, en fait.

Drew : Non.

Mina : J'ai l'impression que personne n'a d'opinion sur le vrai HTML et juste le balisage, comme « c'est là ». Ils l'utilisent. Mais les gens ont des opinions bien arrêtées sur CSS et sur le fait qu'il est soit terrible, soit merveilleux, et les guerres de préprocesseurs qui ne se produisent plus vraiment, et bien sûr, tout le tribalisme au sein des différentes bibliothèques JavaScript.

Drew : Donc, vous diriez que votre voyage jusqu'à présent avec React est toujours simplement : « C'est un outil. Il fait son travail ?

Mina : C'est passé d'une curiosité à une aversion active et viscérale en raison de sa prévalence et de la façon dont je ne pensais pas que cette prévalence était pour moi. Je suis maintenant avec moi, ce qui ne veut pas dire que je déteste ça. Cela signifie simplement…

Drew : Je pense que c'est un bon endroit où être. Je pense que nous sommes probablement tous plus forts en tant que technologues si nous comprenons la valeur d'une technologie particulière pour son objectif. Nous pouvons évaluer ce qui est bon pour chaque circonstance et choisir le bon outil pour le travail.

Mina : Ouais. Et c'est un peu là où j'en suis arrivé à ce stade de ma carrière où je ne m'investis pas vraiment dans un langage particulier, ou une technologie, ou quoi que ce soit, parce que c'est comme, "N'importe quel outil est le plus approprié pour ce que vous êtes essayer de faire, alors utilisez-le. J'ai appris qu'il y a une place pour tout; il y a un temps et un endroit pour tout faire. Et jusqu'à récemment, il n'y avait pas de temps ni d'endroit réel pour moi d'utiliser ce bibliothécaire React, et maintenant c'est le cas.

Drew : Je pense que c'est un bon endroit où être. J'ai donc tout appris sur React ces derniers temps, comme vous l'avez fait dans le travail de jour. Y a-t-il autre chose que vous avez appris dernièrement ?

Mina : J'ai en fait appris ironiquement, c'est-à-dire que je pense qu'un autre langage est né sur Facebook, j'ai fait beaucoup de développement Hack, principalement parce que c'est ce que j'utilise chez Slack, dans mon travail quotidien. Apprendre Hack m'a ouvert la voie pour devenir plus à l'aise avec React car ils suivent des modèles très similaires, sauf que l'un est côté serveur et l'autre non. Ainsi, en plus de manière générale, j'en ai appris davantage sur le back-end et son fonctionnement pour différentes raisons. Et je me suis étiré au cours des deux dernières années et je suis de plus en plus sorti de ma zone de confort. Les systèmes de conception, les bibliothèques, c'est vraiment mon monde, et je me sens très bien et à l'aise dans ce monde. Mais je m'éloigne de cela et je fais beaucoup plus de logique côté serveur, de développement d'API, de modélisation de données, etc. J'ai aussi beaucoup travaillé là-dessus au cours de la dernière année.

Drew : Je trouve que plus je comprends l'ensemble de la pile des éléments de back-end dans les éléments de front-end, chacun aide ma connaissance de l'autre. Je trouve que j'écris un meilleur code frontal en ayant écrit du code back-end et en comprenant-

Mina : Ouais. Je pense que je ressens la même chose. Maintenant que j'ai une meilleure idée, comme nous l'avons dit, de l'ensemble de la manière dont nous passons des données au client final. Je trouve que je pense à l'ensemble du pipeline, quelle que soit la partie dans laquelle je travaille. Je réfléchis à la meilleure façon de structurer cette API afin que lorsque j'arrive au modèle, je n'ai pas à faire tellement de manipulations des données que je reçois à cette fin. Cela a définitivement fait de moi un meilleur ingénieur dans l'ensemble, j'en ai envie

Drew: If you, dear listener, would like to hear more from Mina, you can follow her on Twitter where she's @MinaMarkham and find her personal site at mina.codes. Thanks for joining us today, Mina. Do you have any parting words?

Mina: Have a smashing night?

Drew: Great.