Smashing Podcast Episodul 18 cu Mina Markham: Cum pot învăța să reacționez?

În acest episod din Smashing Podcast, vorbim despre învățarea React. Cum este să lucrezi cu React și cum pot începe dezvoltatorii experimentați? Am vorbit cu Mina Markham ca să aflu.

Afișați note

• Mina Markham pe Twitter
• Site-ul personal al Minei

Actualizare săptămânală

• De la site-uri statice la aplicațiile JAMstack ale utilizatorului final cu FaunaDB de Bryan Robinson
• Site-ul dvs. stresează vizitatorii? de Suzanna Scacca
• Mirage JS Deep Dive: înțelegerea timpului, a răspunsului și a trecerii (partea 3) de Kelvin Omereshone
• Construirea unei aplicații web de recunoaștere facială cu React de Adeneye David Abiodun
• Internaționalizare în Vue cu pluginul Vue I18n de Timi Omoyeni

Transcriere

Drew McLellan: Este un arhitect front-end, vorbitor de conferințe și organizator și iubitor de sisteme de proiectare. Lucrarea ei la biblioteca de brevete Pantsuit pentru campania prezidențială Hillary pentru America a lui Hillary Clinton a marcat un turneu pentru sistemele de design din industrie și a fost prezentată în publicații precum Wired, Fast Company și Communication Arts. La fel ca mulți dintre noi, ea scrie cod pentru a trăi, în prezent ca inginer senior la Slack. Așa că știm că este un dezvoltator talentat și gânditor, dar știai că a fost odată confundată cu Patrick Swayze? Prietenii mei zdrobitori, vă rog bun venit Minei Markham. Buna Mina. Ce mai faci?

Mina Markham: Sunt zdrobitoare.

Drew: Bine de auzit. Acum, uneori, pe Smashing Podcast, vorbim cu oameni despre subiectul pentru care sunt cel mai bine cunoscuți. Și uneori este distractiv doar să vorbești despre ceva puțin tangențial. Acum, aș putea să vorbesc cu tine toată ziua despre bibliotecile de modele, sistemele de design, munca uimitoare pe care ai făcut-o în acea zonă și aș putea să-ți vorbesc despre subiecte despre care probabil ai vorbit, despre evenimente, cum ar fi Evenimentul În afară de lucruri precum direcția artistică. Și, evident, am putea vorbi despre CSS până vin vacile acasă. Dar ai scris pe Twitter acum câteva zile și mi-am dat seama că suntem amândoi în aceeași barcă, deoarece amândoi suntem ingineri front-end cu experiență și am început amândoi să lucrăm recent cu React. Deci, înainte să ajungem la React în sine, unde ați ajuns până în acest punct? Ați lucrat cu alte biblioteci și cadre pentru dezvoltarea JavaScript?

Mina: Nu, de fapt am făcut mai ales JavaScript vanilla de ceva vreme. Și înainte de asta, bineînțeles, am intrat în JavaScript. Lasă-mă să reformulez asta. Am început să lucrez cu script Java folosind jQuery pentru că avea cel mai mult sens pentru mine. A fost ceva ce mi-a fost foarte ușor de analizat pentru a-mi da seama ce se întâmplă. Și apoi, de acolo, am revenit la a face doar vanilie, JavaScript simplu, ESX și nu am intrat prea mult în războaiele cadrelor. Nu aveam, ca și cum n-aș fi avut favorit. Nu am avut niciun câine în luptă. Am spus: „Pentru tine, React, orice. chiar nu-mi pasă.” Dar vremurile se schimbă.

Drew: Și în acest fel de a lucra cu JavaScript vanilla, pentru că am făcut multe din asta și eu. Am lucrat cu diverse cadre. Am făcut multe cu jQuery pe vremea aceea. Am lucrat cu YUI, Yahoo User Interface Library. Ați simțit multe dintre punctele dureroase pe care ceva precum arhitectura lui React încearcă să le abordeze?

Mina: Nu cred că am avut vreodată. Mi-am petrecut cea mai mare parte a carierei făcând site-uri web versus aplicații web și lucruri de genul ăsta. Deci tot ce am făcut a fost destul de static până la o anumită măsură. Deci nu am avut niciodată de-a face cu managementul statului, chestii de genul ăsta. Deci, punctele dureroase pe care React încearcă să le rezolve nu le-am aplicat niciodată cu adevărat genului de muncă pe care am făcut-o.

Drew: În general, care este natura proiectelor pe care le-ați avut cu React până acum?

Mina: De fapt, a fost doar un singur proiect, la care lucrez în prezent și nu pot da prea multe detalii pentru că o companie publică și toate acele lucruri bune.

Drew: Desigur.

Mina: Dar, în esență, ceea ce încerc să fac este că încerc să folosesc React to, este un fel de produs foarte interactiv în care am nevoie de oameni care să poată introduce și să salveze date într-o anumită stare și apoi să le manipuleze și generați altceva cu datele respective. Și asta este doar ceva ce nu este o simplă manipulare DOM în acel moment. Este într-adevăr mult mai complex, gestionarea front-end a datelor și gestionarea stării acestor date. Deci nu a existat într-adevăr altă alternativă decât utilizarea unui fel de bibliotecă care încearcă să rezolve acea problemă. Știam că nu voi putea trece cu JavaScript simplu. M-am gândit poate să manipulez ceva din partea serverului, dar din nou, din cauza naturii foarte interactive a ceea ce lucrez, trebuie să fie în client. Și așa că folosim deja React at Slack pentru diverse alte lucruri. Și așa am spus: „Bine, ar trebui să mergem mai departe și să adoptăm același lucru pe care îl folosesc restul companiilor-mamă și să mergem de acolo”.

Drew: Unul dintre lucrurile în care sunt întotdeauna un punct de durere pentru oamenii care preiau React este să mă ocup de lanțul de instrumente care este necesar pentru ca lucrurile să funcționeze, Webpack fiind un elefant evident în cameră. A trebuit să faci multe configurații ale lanțului de scule sau ca mine dacă ai avut luxul ca colegii să o facă pentru tine?

Mina: Oh, îmi place echipa de infrastructură de la Slack the data. Echipa de infrastructură front-end de la Slack s-a ocupat de toate acestea. Nu trebuia să mă gândesc la asta. A fost minunat. Pentru că am încercat să învăț React înainte, în trecut. De obicei, modul în care învăț cel mai bine este să lucrez și să pun în aplicare lucrurile. Și folosim React pentru a construi o mulțime de hillaryclinton.com în 2016. Deci nu este ca și cum n-aș fi lucrat niciodată cu oameni care îl folosesc. Doar că munca mea nu a avut niciodată nevoie de mine să mă implic. Dar acea bază de cod era foarte complexă și foarte sofisticată și s-au întâmplat atât de multe încât există o astfel de barieră de intrare pentru a încerca să înveți ceva acolo dacă nu știai deja cum funcționează React și Redux și toate astea, ceea ce am nu a făcut-o. Deci nu am fost cu adevărat eficientă în a învăța în acel mediu.

Mina: Din fericire, aici am oameni cărora le place să ia puțin mai mult din fragmentele complexe. Nu trebuie să-mi fac deloc griji pentru configurația Webpack. Asta a fost pus la punct. A fost încercat și testat și gata de funcționare. Sunt într-o barcă similară în care folosim și Redux pe lângă React, despre care nu mi-am dat seama că sunt două lucruri diferite. Nu știam care parte se ocupă de care. Intrând într-o bază de cod ca asta, a fost puțin dezorientat pentru că nu mi-am dat seama că toate erau același lucru. Am avut oameni care erau dezvoltatori experimentați React care mi-au spus: „Oh, folosim și Redux, ceea ce vă face puțin mai greu să învățați cu adevărat ce poate face React all dacă porniți de la zero”. Și nu am știut niciodată ce au vrut să spună prin asta pentru că nu știam despre ce vorbesc.

Mina: Pentru a răspunde la întrebarea ta inițială, încă mai am o mică barieră la intrare, pentru că nu înseamnă doar să învăț React. Trebuie să învăț React și, de asemenea, cum să folosesc magazinul Redux. Deci acele două lucruri în același timp pot fi puțin prea mari.

Drew: Da, am găsit exact același lucru într-o bază de cod existentă ca primul meu proiect React care folosește Redux. Și cred că, așa cum este natura oricăruia dintre aceste tipuri de tehnologii atunci când sunt tineri, ele repetă foarte repede și ceea ce este cea mai bună practică la un moment dat, 6 luni mai târziu a trecut mai departe și există un mod diferit de a face lucrurile. Și când aveți o bază de cod care se întinde pe mulți ani, uneori puteți avea diferite stiluri de implementare a lucrurilor acolo. Nu păstrează întotdeauna sincronizarea. Și, desigur, dacă urmărești un tutorial sau orice altceva de învățat, citești cărți, folosești resurse, acestea vor fi în cea mai modernă versiune a modului de a face lucrurile. Și asta nu afectează neapărat ceea ce vezi când te uiți la un produs existent, matur. Este ceva pe care l-ați experimentat deloc sau ați reușit să vă mențineți baza de cod cu adevărat actualizată?

Mina: Cred că este ceva pe care cu siguranță am experimentat. Când am încercat să învăț cum să fac React pe cont propriu, m-am uitat la diverse tutoriale și lucruri de genul ăsta. Și am observat, sau cel puțin oamenii mi-au spus care au lucrat care au lucrat cu mine că unele dintre lucrurile pe care le facem sau un fel de anti-model sau nu chiar cum funcționează lucrurile acum, pentru că această bază de cod este ușor, bine. ne maturizează rudă, dar are câțiva ani. Și așa că există câteva moduri în care cred că sunt mai ușor de făcut lucruri decât modul în care le facem în prezent, deoarece asta a fost scris cu ani în urmă. Deci este un pic o bandă de alergare care încearcă să țină pasul cu vremurile actuale și să mă asigur că vreau să fac lucrurile în cel mai bun mod, dar, de asemenea, nu vreau să sparg o bază de cod stabilită pentru că vreau să mă joc cu lucruri.

Drew: Evident, unul dintre lucrurile cu React pe care oamenii ca mine și ca tine vin la el, se poate simți puțin șocant ca toată treaba cu JSX. Folosești JSX în proiectul tău?

Mina: Suntem. Eu folosesc JSX.

Drew: Ai făcut pace cu asta?

Mina: Am căzut ca și cum o mică bucată din mine moare de fiecare dată când deschid unul dintre acele fișiere. Încă se simte un sacrilegiu să-mi pun HTML-ul în fișierul JavaScript. Știu că este un fel de revoluționar și este un lucru important, dar îmi pare rău că îmi scriu marcajul într-un fișier JavaScript. Am făcut pace cu ea, dar de fiecare dată când o fac, sunt doar ca, „…” Probleme de separare, este un lucru. Aș dori înapoi, te rog.

Drew: Este un punct valid, nu-i așa? Antecedentele mele, când începeam să lucrez mai serios cu JavaScript, și probabil că atunci când mă întorceam la Yahoo, lucrurile erau foarte mult pe modelul paginilor HTML redate pe server și apoi luam o abordare de îmbunătățire progresivă, stratificarea JavaScript în partea de sus pentru a îmbunătăți interfata. Și dacă starea ceva din interfață trebuia să se schimbe, codul tău trebuia să știe despre toate părțile interfeței pe care trebuia să le actualizeze, ceea ce te duce evident la o abordare strâns cuplată cu aceste mari vederi monolitice în care codul pe care îl scrii. trebuie să știe despre toate celelalte coduri din jurul lui. Și cred că asta nu se pretează într-adevăr unei abordări componente pe care ați lua-o atunci când lucrați cu o bibliotecă de modele sau un sistem de design, care este mai mult pentru domeniul dvs. de specialitate. Cred că React se pretează mai mult la această abordare, nu-i așa?

Mina: Cred că da, mai ales cu posibilitatea de a cupla un CSS foarte specific la o componentă JSX sau React. Și astfel, este mult mai ușor să separați sau să luați doar ceea ce aveți nevoie pentru bibliotecă și să lăsați restul, în timp ce o bibliotecă de modele sau un sistem de design care încearcă să facă ceva mai monolitic cu un singur fișier CSS de stil mare sau ceva de genul ăsta , o face foarte dificilă. Trebuie să iei totul sau nimic. Așa că apreciez că React ne permite să facem un mod de dezvoltare mai individualizat și mai component, chiar dacă încă mi-aș dori să existe o modalitate de a separa cu adevărat stratul meu de prezentare și stratul meu de conținut de stratul meu de interactivitate. Dar poate că ăsta sunt doar eu că sunt puțin de școală veche în acest sens.

Drew: Cu siguranță simt durerea acolo. Ideea este că, vino și corectează-mă dacă greșesc, înțeleg că, în loc să separă tehnologiile, CSS-ul și JavaScript-ul și HTML-ul, separă funcționalitatea. Deci tot ceea ce este o singură componentă există împreună -

Mina: Da.

Drew: … ceea ce cred că este util dacă acea componentă nu mai este necesară. Puteți pur și simplu să-l ștergeți, și a dispărut și nu lasă o amprentă în jurul aplicației dvs. Cu toate acestea, nu este întotdeauna cazul cu CSS. Cum lucrezi cu CSS cu React? Te-ai uitat la lucruri precum componentele stilate sau ceva de genul?

Mina: Nu, nu am făcut-o. Am auzit de componente cu stil, dar nu le-am investigat niciodată pe deplin, ca să fiu perfect sincer. Deci, modul în care lucrăm cu CSS cu React este să scriem Less și avem doar un fișier Less atașat la fiecare componentă individuală care este importată în acea componentă. Și apoi este legat prin Webpack și servit clientului.

Drew: Folosiți un sistem ca BEM sau ceva pentru a transforma spațiul de nume?

Mina: Da. Folosim BEM pentru spațierea numelor, deși aderarea la acesta este oarecum variată în funcție de cine scrie ce. Dar încercăm să folosim un model de spațiere a numelor BEM pentru a face un pic mai clar care este scopul fiecărei clase și componente individuale.

Drew: Și asta pare să funcționeze cu succes pentru tine?

Mina: Cred că da. Ocazional, are cam aceeași problemă veche, uneori nu știu cum să numesc ceva. După un timp, lucrurile zilnice au întotdeauna și vor fi întotdeauna un lucru dificil pentru maestru. Deci, aceasta este singura problemă cu care o am este că uneori nu am idee cum ar trebui să numesc o anumită componentă.

Drew: Cu siguranță. Este o luptă constantă, nu-i așa, cum să scoți numele lucrurilor?

Mina: Da.

Drew: Întotdeauna ajung când lucrez la o caracteristică nouă sau ceva de genul acesta, dai unei componente și tuturor claselor și tot ceea ce are numele pe care îl are caracteristica în acest moment. Și apoi, când vii să lansezi, a fost redenumit cu altceva. Deci aveți referințe la vechiul nume în cod și interfața are noul nume. Și …

Mina: Încerc să numesc întotdeauna lucrurile pe baza funcției sau a scopului acesteia față de lucruri care sunt puțin mai efemere, pentru că este mai puțin probabil ca scopul real al acestei componente să se schimbe. Am uitat să menționez, dar pe lângă folosirea BEM, cred că folosim BEMIT-uri dacă ești familiarizat cu asta. Practic este ITCSS plus BEM, ambele create de Harry Roberts. Deci folosesc notația maghiară pentru a indica dacă ceva este sau nu o componentă, față de un obiect de aspect, față de un model mai mare format din mai multe componente. Și apoi de acolo folosim convenția BEM pentru a semnifica ca elementul bloc și toate astea.

Drew: Și ați fost nevoit să faceți mult refactorizare și ștergere a componentelor și a lucrurilor din baza de cod și a trebuit să vă ocupați de problema rămânerii CSS în urmă?

Mina: Da. Deci partea non-React a muncii mele, de a menține slack.com, este doar o grămadă de fișiere Less care sunt compilate pentru CSS. Și vă garantez că există o mulțime de coduri zombi acolo, pentru că cu siguranță repetăm ​​mai multe lucruri în timpul cât am fost acolo. Și nu întotdeauna avem timp să ne întoarcem și să facem curățarea față de când reproiectăm o pagină sau ceva de genul. Deci este întârziat pentru un audit, o să spun asta.

Drew: Acesta este ceva la care tocmai ne-am uitat în proiectul nostru React, privind modul în care abordăm CSS. În momentul de față, avem câteva fișiere CSS mari, globale pentru întreaga aplicație și avem această situație în care dimensiunea pachetului nostru doar crește, și crește și crește și nu devine niciodată mai mic, chiar dacă lucrurile devin mai mici. îndepărtat. Așa că ne-am uitat la lucruri precum componentele stilate, și Tailwind este o altă opțiune pe care o luăm în considerare cu adevărat. Te-ai uitat mult la vântul din spate?

Mina: Nu m-am uitat prea mult la el. Am fost curios în privința asta, dar din nou, nu am avut niciodată timp să caut să văd dacă este ceva ce vreau să încerc să aduc în baza noastră de cod.

Drew: De fapt, am fost destul de surprins, pentru că, la fel ca tine, sunt puțin cam vechi cu cum să fac aceste lucruri. Îmi place separarea plăcută a preocupărilor. Și îmi place să-mi scriu CSS în CSS și, desigur, abordarea cu Tailwind este că aveți toate aceste nume de clasă, care par un pic ca stilurile inline pe care le aplicați. Și dacă se simte murdar.

Mina: Da.

Drew: Și m-am oferit voluntar în cadrul echipei, fiecare dintre noi, care a luat o tehnologie pentru a investiga dacă ar fi potrivite pentru problemele noastre, și m-am oferit voluntar să mă uit la Tailwind pentru că eram absolut sigur că o să-l urăsc.

Mina: Nu, nu.

Drew: Dar se pare că de fapt cred că rezolvă multe probleme. Am fost destul de impresionat.

Mina: Da. Am ajuns într-un fel la un mod similar de gândire, pentru că în trecut aș prefera mult ca o clasă să cuprindă toate stilurile de care aveam nevoie pentru o anumită componentă și să nu fac o clasă per proprietate, așa cum cred că face Tailwind. sau limbi ca acesta. Din aceleași motive, am simțit foarte mult: „Ei bine, doar rulez CSS inline în acest moment. De ce aș face asta?” Dar pe măsură ce am dezvoltat din ce în ce mai mult, în interiorul sistemului nostru de design Slack, am creat o grămadă de ceea ce eu numesc clase de utilitate care fac lucruri precum adăugarea unui pic de marjă cu un model. Am observat că din ce în ce mai mult, folosesc acele clase pe lângă clasele componente. Așa că sunt de genul: „Bine, poate ar trebui să revin în întregime pentru a face un CSS ca o declarație pe rând.” Nu știu dacă aș merge atât de departe, dar cu siguranță merită luat în considerare.

Drew: Computingul pare să fie un flip flop în ceea ce privește tendințele dintre soluțiile thin clients și fat clients. Am început cu mainframe-uri cu terminale, iar apoi era PC-urilor cu Windows și Office și toate aceste aplicații mari. Și toate au devenit foarte încete, și apoi a apărut web-ul, și acesta era doar un browser și toată munca se făcea pe server. Și totul a fost din nou rapid și rapid. Și acum ne-am reîntors la repunerea în browser, cu tot ce se face cu JavaScript, lucruri precum React și abordarea JAMstack, unde ne-am întors la un fel de client gras. Uneori îmi fac griji că cerem prea mult browserului. Este aceasta o greșeală? Cerem prea mult browserului care încearcă să facă toate aceste lucruri în React?

Mina: Vreau să spun da, cu avertismentul că, din nou, experiența mea este foarte mult limitată la site-urile în mare parte statice. Nu fac foarte multă dezvoltare de produse. Așa că poate în acel tărâm, acest lucru are mai mult sens. Dar din perspectiva mea, simt că de multe ori folosim o secure când avem nevoie doar de un cuțit pentru unt. Nu știu de ce trebuie să punem toate astea în browser, să punem atât de multă muncă și atât de multă presiune asupra clientului. Simt că am putea face asta mult mai simplu. Unul dintre lucrurile care m-au făcut întotdeauna puțin să ezit să folosesc React, sau spun că ezit, dar ceea ce vreau să spun când m-a enervat visceral și m-am opus activ, a fost când mergeam pe un site web și literalmente nimic nu se redau pentru că acolo a fost o eroare sau ceva de genul, „Serios? Întreaga pagină este defectă pentru că s-a defectat o funcție?”

Mina: M-a cam enervat că de multe ori a fost o abordare totul sau nimic. Una dintre discuțiile pe care le-am susținut la AEA în trecut și în alte locuri în trecut a fost vorba despre cum să includeți îmbunătățirea progresivă și nu doar dezvoltarea dvs., ci și despre direcția artistică și designul site-urilor. Și aș sublinia în mod specific exemple de site-uri web care nu au făcut îmbunătățiri progresive sau orice fel de degradare grațioasă. Era ca și cum fie ai rulat JavaScript în browser, fie nu primești absolut nimic. Și ar fi ca un simplu site care să reprezinte informații despre istoria web design-ului, care a fost unul dintre site-urile despre care s-a vorbit de fapt, istoria web design-ului din 1990 până în prezent. A fost un site frumos cu o mulțime de cronologie, animație de lucruri. Dar ar fi putut fi redat static doar cu o listă. Au fost pași între a nu arăta nimic și a arăta acea experiență frumos îmbunătățită, care cred că s-a pierdut din cauza modului în care ne-am abordat acum dezvoltarea web modernă.

Drew: Deci, ați spune că există absolut câteva categorii de proiecte care se potrivesc unei soluții precum React și unele în care nu ar trebui să fie folosită și ar trebui să utilizați metode mai tradiționale?

Mina: Cred că, dacă site-ul tău este în mare parte static, doar a furnizat informații, cred că nu înțeleg de ce ai nevoie de un proiect precum React pentru a reda ceva care nu are multă interacțiune dincolo de manipularea DOM. . Cred că nu văd ce beneficii ai din asta. Din nou, s-ar putea să nu lucrez la proiectele adecvate. Poate că nu doar am văzut sau găsit acel caz de utilizare, dar îmi este greu să văd dacă este doar un site static, care prezintă conținut, nu prea multă interacțiune, nu prea multă interacțiune dincolo de DOM manipulat și de a face animații. Nu văd cum deține o bibliotecă React vă ajută să îndepliniți acest obiectiv.

Drew: Este interesant pentru că nu sunt rău să vorbesc despre asta pentru că nu l-am folosit de fapt, dar văd o mulțime de proiecte Gatsby și Gatsby este un generator de site static care folosește un front-end React în el. Și văd toate exemplele de teme și lucruri pe care le au disponibile sunt site-uri bazate pe conținut, sau bloguri, și un site de rețete, și un portofoliu și astfel de lucruri. Și există ceva ce cred că de fapt nu este neapărat potrivit pentru ceva de genul React. De ce acest lucru nu este redat static și apoi îmbunătățit progresiv?

Mina: Da.

Drew: Nu este software.

Mina: Da. Nici eu nu l-am folosit de fapt pe Gatsby. Am auzit o mulțime de lucruri grozave despre asta, dar acesta este probabil unul dintre exemplele la care m-aș gândi unde sunt: ​​„Bine, cred că pur și simplu nu văd de ce instrumentul este necesar pentru a face acea treabă. ” Din nou, nu știu. Poate este doar pentru că mai mulți oameni se simt confortabil să scrie în React atunci când scriu altceva și oferă doar un instrument care îi întâlnește pe oameni acolo unde se află. Am auzit lucruri grozave despre generatoarele de site-uri statice care folosesc React pentru oamenii care le-au folosit și le iubesc, dar nu este un caz de utilizare în care aș fi spus imediat: „O, asta are sens”.

Drew: Se pare că a existat întotdeauna această bătălie între ceea ce am numi un site web și ceea ce ați putea numi o aplicație web. Iar prăpastia dintre cei doi pare să devină din ce în ce mai largă, din ce în ce mai largă, în timp ce o abordare progresivă de îmbunătățire încearcă să reducă decalajul luând ceva static și adăugând JavaScript și adăugând interactivitate. Se pare că lucruri precum React sunt potrivite ideal pentru software-ul pe care îl rulați în browser. Ai fi de acord cu asta?

Mina: Cu siguranță aș fi de acord cu asta pentru că se simte ca și cum a fost construit pentru acest tip de mediu; a fost construit pentru a rula software. A fost creat de Facebook pentru Facebook. Deci a fost construit pentru un produs. A fost creat pentru a rula orice numiți o aplicație web în browser și nu neapărat pentru tipul de muncă pe care, așa cum am menționat, sunt obișnuit să o fac. Așadar, cred că în acele scenarii, este cu siguranță foarte logic să îl utilizați dacă construiți un software mai complex, mai sofisticat, care este menit să ruleze în interiorul unui browser. Dar dacă construiești un site de marketing sau orice altceva, cred că tot m-aș chinui să văd de ce va fi necesar acolo.

Drew: Așadar, le oferim oamenilor permisiunea să creeze în continuare site-uri web decente, redate static?

Mina: Mi-ar plăcea să văd mai multe din asta. Simt că s-a cam pierdut și s-a cam pierdut, dacă a fost vreodată cool sau orice altceva. Simt că am pierdut acea parte a dezvoltării web. Este atât de amuzant: amândoi am spus că suntem cam de școală veche și râd de asta pentru că de fapt fac dezvoltare web de șase ani acum? Cum sunt de școală veche? Nu a trecut atât de mult pentru mine. Și totuși, cumva, fac parte din vechea gardă căreia nu-i plac lucrurile noi și strălucitoare. Nu înțeleg.

Drew: Deci, de fapt, React a existat pentru tot timpul în care ai fost dezvoltator web.

Mina: Poate că am doar un suflet bătrân. Nu știu.

Drew: Cred că probabil așa este. Nu m-am uitat personal, există abordări prestate pe partea de service pe care le puteți lua cu aplicațiile React. Ai experimentat vreuna dintre acestea?

Mina: Nu le-am experimentat. Le-am analizat pe scurt pentru proiectul la care lucrez în prezent, pentru că simt că există părți ale operațiunii care ar funcționa mai bine pe un server decât pe clienți. Dar cred că din cauza cunoștințelor mele limitate și a faptului că baza de cod este puțin mai complicată decât pot înțelege, nu am putut să îmi dau seama cum să fac acea parte să funcționeze. Mi-ar plăcea să-mi dau seama până la urmă, dar mi-am petrecut o zi să sapă în ea. Am spus: „Știi ce? Nu iau asta, trebuie să fiu. Așa că mă voi întoarce și voi lua o altă rută.”

Drew: Da. Cred că toți am fost acolo.

Mina: Da. Am mers pe o potecă. Am spus: „Oh, asta e întuneric și înfricoșător. Să facem invers. Să facem invers.”

Drew: Îndepărtează-te de cod.

Mina: Da.

Drew: Deci ai fost foarte diplomatic și politicos cu React până acum. Simt că e ceva tensiune care clocotește puțin sub suprafață. Haide. Spune-ne ce simți cu adevărat.

Mina: Am fost politicos și diplomatic, mai ales pentru că baza de fani ai Reacts poate fi uneori puțin răutăcioasă și aș prefera să nu-i pun pe ei să vină după mine. Deci, te rog, React este grozav. E minunat. Folosește-l pentru ceea ce vrei să îl folosești. Glumesc, dar chiar și acel tweet pe care l-ai menționat la începutul acestui podcast în care cred că ceea ce ai spus este că nu îl urăsc. Nu-l iubesc, dar nu-l urăsc. Chiar și acea afirmație, am primit oameni, nu exista vitriol, dar mai mult ei erau gata să sară în apărare și să spună: „Ei bine, îmi place pentru că X, Y, Z”. Eu zic: „Nu am spus că este rău. Tocmai am spus că sunt nehotărât despre toată treaba.” Dar se pare că a fi meh nu este în regulă. Trebuie să-l iubesc.

Mina: De aceea probabil că am fost puțin mai diplomatică decât aș fi în mod obișnuit, doar pentru că nu vreau ca oamenii să creadă că vorbesc rău, pentru că nu sunt. Are un loc în mai multă dezvoltare web. Are o funcție. Isi face treaba bine. Oamenilor le place. Pur și simplu nu este un instrument pe care l-am avut sau pe care am vrut să îl folosesc până acum.

Drew: Da. Lucrurile pot deveni foarte tribale, nu-i așa, cu oamenii simțind că trebuie să ia o parte sau alta, iar tu ești fie absolut pentru ceva, fie absolut împotriva a ceva? Și nu sunt sigur că servește unui scop bun și nu cred că ne face să mergem înainte ca industrie și ca comunitate să facem asta.

Mina: Da. Este chiar ciudat. Este fascinant de vizionat doar din punct de vedere sociologic, dar de multe ori este chiar ciudat de observat. Parcă nu am voie să fiu, așa cum am spus, neutru în privința anumitor lucruri. Trebuie să am o părere puternică, care nu cred că este sănătoasă. Care este termenul „Opinii puternice, ținute liber?” Cam așa merg eu despre lucrurile. Mă simt puternic pentru anumite lucruri, dar nu e ca și cum nu mă poți răzgândi. Acolo unde simt ca unii oameni, identitatea lor este înglobată în anumite aspecte ale ei, că, dacă nu ești pentru orice cu care au ales să se identifice, este o ușoară față de doar, nu-mi pasă de acest subiect anume, sau unealtă, sau orice altceva.

Drew: Da. Nu știu dacă este agravat de faptul că toți avem tendința de a ne specializa mult mai mult în anumite părți ale stivei. Și știu că există oameni care sunt dezvoltatori React. Ei s-ar numi dezvoltatori React pentru că în asta lucrează. Și nu ar scrie neapărat niciun script Java vanilla sau nu ar folosi Vue sau orice altceva. React este lumea lor. Așa că cred că pare aproape un atac asupra întregii lor cariere să spună „Nu-mi place React”. Ei bine, sunt cu adevărat investiți în a vă face să vă placă React sau orice ar fi tehnologia.

Mina: Voi recunoaște că am fost unul dintre acei oameni în trecut. De fapt, probabil că era vorba în mare parte despre SASS, cred. Am fost foarte mult în echipa de a face SASS ca preprocesor și toți ceilalți preprocesoare sunt gunoi. Nu vreau să vorbesc despre ei. Nu vreau să am de-a face cu ei. Și mi-am dat seama că era un mod foarte îngust de a privi lucrurile. Utilizați instrumentul adecvat pentru muncă. Orice te face mai productiv, acesta este instrumentul potrivit. Chiar nu contează ce este.

Drew: Există tehnologii cu care lucrăm și care nu au un asemenea sentiment tribal? Există ceva pe care oamenii sunt bucuroși să îl folosească sau să nu îl folosească? Nu mă pot gândi la nimic.

Mina: Uau. Nimeni nu are păreri despre marcaj, de fapt.

Drew: Nu.

Mina: Simt că nimeni nu are păreri despre HTML-ul propriu-zis și doar markup, la fel ca „Este acolo”. Ei îl folosesc. Dar oamenii au opinii puternice despre CSS și despre cum este fie teribil, fie minunat, și războaiele preprocesoare care nu se mai întâmplă cu adevărat, și apoi, desigur, tot tribalismul din diferitele biblioteci JavaScript.

Drew: Deci ai spune că călătoria ta de până acum cu React este doar „Este un instrument. Își face treaba?”

Mina: A trecut de la o curiozitate la antipatie activă și viscerală, din cauza cât de răspândită a fost și a cât de inutilă, am crezut că acea prevalență a fost pentru mine. Acum sunt cu meh, ceea ce din nou nu înseamnă că urăsc. Înseamnă doar…

Drew: Cred că este un loc bun. Cred că probabil suntem cu toții mai puternici ca tehnologi dacă înțelegem valoarea unei anumite tehnologii pentru scopul ei. Putem evalua ce este bun pentru ce circumstanță și alegem instrumentul potrivit pentru job.

Mina: Da. Și cam aici am ajuns în acest moment al carierei mele în care nu mă investesc cu adevărat într-o anumită limbă, sau tehnologie, sau orice altceva, pentru că este de genul: „Orice instrument este cel mai potrivit pentru ceea ce ești. încerc să faci, apoi folosește asta.” Am învățat că există un loc pentru orice; există un timp și un loc pentru a face totul. Și până de curând, nu am existat un timp sau un loc real în care să folosesc acest bibliotecar React, iar acum există.

Drew: Cred că este un loc bun. Așa că am învățat totul despre React în ultima vreme, așa cum ai făcut și tu în munca de zi. Mai e ceva despre care ai mai învățat în ultima vreme?

Mina: De fapt, am învățat ironic, adică un alt limbaj care a apărut la Facebook, am făcut o mulțime de dezvoltare Hack, mai ales pentru că asta folosesc la Slack, la jobul meu de zi cu zi. Learning Hack mi-a deschis calea pentru a deveni mai confortabil folosind React, deoarece acestea urmează modele foarte asemănătoare, cu excepția faptului că unul este partea serverului și altul nu. Așa că, împreună cu doar în general, am învățat mai multe despre back-end și cum funcționează acesta din diferite motive. Și m-am întins în ultimii doi ani și am ieșit din ce în ce mai mult din zona mea confortabilă. Sisteme de proiectare, biblioteci, asta este foarte mult lumea mea și mă simt foarte bine și confortabil în acea lume. Dar ies în afara ei și fac mult mai multă logică pe partea de server și dezvoltare API, modelare de date și toate astea. Am făcut multe în acest sens și în ultimul an.

Drew: Găsesc că, cu cât înțeleg mai mult despre întregul teanc despre chestii de back-end în chestii de front-end, fiecare îmi ajută să-mi cunoști cealaltă. Găsesc că scriu un cod front-end mai bun, scriind cod back-end și înțelegând-

Mina: Da. Cred ca simt la fel. Acum că am o idee mai bună despre, așa cum am spus, întregul teanc despre cum ajungem de la date la clientul final. Mă gândesc la întreaga conductă, indiferent în ce parte lucrez de fapt. Mă gândesc la care este cea mai bună modalitate de a structura acest API, astfel încât când ajung la șablon, să nu fie nevoit fac atât de multe manipulări ale datelor pe care le primesc la acel capăt. Cu siguranță m-a făcut, în general, un inginer mai bun, îmi vine

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.