Tarina kahdesta verkkosivustosta

Hitaan edistymisen ja itsereflektion merkitys

Kuva Tanya Nevidoma on Unsplash

"Hei, koska opit koodaamaan, uskotko, että voisit tehdä minulle verkkosivuston?"

Olen varma, että olemme kaikki kuulleet tämän kysymyksen aiemmin. Se tulee verkko-kehittäjäksi. Kuulin sen ensimmäisen kerran maaliskuussa 2016. Vaimoni oli graafinen suunnittelija, joka halusi murtautua UI / UX-kenttään. Hän halusi näyttää taitonsa verkkokansioon.

Olin oppinut verkkokehitystä vasta 3 kuukautta tuolloin (aloitin uudenvuoden päätöslauselmana). Olen suorittanut pari HTML-, CSS- ja JavaScript-kurssia ja haluaisin kaivaa hampaani mehukkaaseen projektiin.

"Joo, voin tehdä sen puolestasi. Sen ei pitäisi kestää liian kauan. "

Kesti neljä kuukautta.

Tajusin melko nopeasti, että olen purema liikaa. Vaikka olin kuitenkin naiivi, olin myös päättäväinen. Laitoin kaiken mitä minulla oli kyseiselle verkkosivustolle. Kun en työskennellyt työssäni, joko koodain tai etsin Pino ylivuotoa.

Enimmäkseen hakua Stack Overflow, paljon siitä.

Huolimatta projektin aiheuttamasta stressistä ja rasituksesta, en olisi voinut tuntea olevansa ylpeämpi, kun näin sen live-tilassa ensimmäistä kertaa selaimessa.

Se oli työni. Olin tehnyt sen.

Vaimoni on löytänyt uuden verkkosivustonsa avulla roolin UX-suunnittelijana New Yorkissa. Me molemmat lopetimme työpaikkamme ja muutimme Seattlesta. Tämä merkitsi ensimmäistä sukellusta ohjelmointiin.

Kaksi vuotta myöhemmin

"Hei, uskotko, että voisit päivittää verkkosivustoni?"

Oli kesäkuu 2018, ja monet asiat olivat muuttuneet. Näiden kahden lyhyen vuoden aikana vaimoni oli mennyt UX-suunnittelijasta tuotesuunnittelijaksi suunnittelemaan käynnistyksen johtoa. Hän halusi uuden päivityksen heijastamaan tätä kasvua.

"Kyllä, voin tehdä sen."

Yritin kuulostaa mahdollisimman varmalta, mutta epäröin. Muistin, kuinka kauan hänen verkkosivustonsa rakentaminen kesti ensimmäistä kertaa. En ollut varma, että minulla on kestävyyttä ja henkistä kestävyyttä toiseen otteluun. Se oli uupannut minut.

Itseluottamuksesi ravistui entisestään, kun aloin kaivaa vanhaa koodia. En ollut katsonut sitä kahdessa vuodessa. Se ei ollut ikääntynyt hyvin. Vaikka käyttöliittymä toimi edelleen ja näytti hyvältä, käyttöliittymä oli sotku. Vaikuttaa siltä, ​​että se olisi pitänyt yhdessä kanavateipillä.

"Koodin hajun" suhteen se riippusi kuin roskien tuli.

Vaikka vaimoni halusi vain päivityksen, selaaminen tuossa kooditietokannassa oli työlästä. Aloittaminen tyhjästä oli helpompaa. Minua ei innostunut ajatuksesta aloittaa uudelleen. Mutta vaikka vaimoni oli kasvanut paljon parin viime vuoden aikana, minulla oli myös. Käytin sitä tilaisuutena pohtia, kuinka paljon olin oppinut.

Alkaen tuoreena

Ensimmäisenä päivänä, kun aloitin vaimoni uuden verkkosivuston rakentamisen, tiesin, että sen ei kestä 3 kuukautta. Pystyin tekemään enemmän siinä ensimmäisessä päivässä kuin aikaisemmin olin viikossa. Lopulta päivityksen loppuun saattaminen kesti vain noin viikon ajan.

Voit nähdä sen elävänä täällä: irissprague.co

irissprague.co

Vaikka olin vaikuttunut siitä, kuinka nopeasti pystyin rakentamaan sen, en ollut aivan varma, miksi se oli ollut niin paljon nopeampi. Toki, minulla oli vielä kaksi vuotta vyön alla, mutta mitä oikein olin oppinut näiden kahden vuoden aikana?

Vipuvaikutteiset työkalut

Ensimmäinen asia, jonka huomasin, oli kyky hyödyntää työkaluja. Tiedät, kaksi vuotta aiemmin, tiesin hyvin vähän avoimen lähdekoodin työkaluista. Vaimoni ensimmäinen verkkosivusto on rakennettu käyttämällä raakat HTML, CSS, JavaScriptiä ja ripaus PHP: tä. Vaikka se ei sinänsä ole huonoa, minulla ei ollut käsitettä näyttömalleista.

Kirjoitin jokaisen HTML-tiedoston tyhjästä. Yhdenmukaisuuden ylläpitämiseksi kopioin toistuvat elementit. Valitettavasti se tarkoitti, että yhden sivun vaihtaminen tarkoitti useamman vaihtamista.

Toisella yritykselläni vältin kaikkia niitä kopioinnin ja virheenkorjauksen tunteja käyttämällä HAML-malleja ja Flexboxia.

Kiitos Flexbox

Rakennusprosessin automatisointi

Toinen syy ensimmäisen verkkosivuston rakentamiseen kesti niin kauan, että minulla ei ollut käsitettä rakennusprosessista. Kolmen kuukauden ajan rakensin vaimoni ensimmäistä portfoliosivustoa, tein kaiken paikallisesti koneellani.

Aina kun tein suuren muutoksen, minun olisi pakotettava vaimoani tulemaan tutkimaan kannettavan tietokoneen muutoksia. Jos tämä ei ollut tarpeeksi paha, kun tuli aika siirtää muutokseni tuotantopalvelimelle, minulla ei ollut aavistustakaan, mistä aloittaa.

Olin ollut niin keskittynyt verkkosivuston toimivuuteen, että en ollut edes ajatellut, kuinka saan sen Internetin käyttöön. En ollut koskaan kuullut DigitalOceanista, Dockerista tai Herokusta.

Ainoa hosting-palvelu, jonka tiesin tuolloin, oli Godaddy. Godaddy lataa tiedostoja cPanelilla itse palvelimelle. Valitettavasti cPanel salli tiedostojen lataamisen vain yksi kerrallaan.

Kesti tunteja. Ja aina kun minun piti muuttaa jotain omaisuutta, minun piti ladata muokatut tiedostot uudelleen manuaalisesti.

Kun nämä virheet palavat muistiin, investoin rakennusprosessini parantamiseen. Automatisoin CI / CD-työnkulun Docker Compose -sovelluksella. Yhdellä telakointiasetuksen kirjoituspäivän komennolla voisin ottaa koko sivuston käyttöön tuotannossa.

Luin jopa pienen bash-komentosarjan erottaaksesi Git- ja Docker-komennot.

Mahdolliset tekemäni muutokset saattavat olla elossa alle minuutissa. cPanel oli menneisyys.

Käytin myös DigitalOcean-pisaraa, jotta vaimoni näkisin tekemäni muutokset. Hän voi katsella muokkauksia omalla koneellaan käymällä Pisaran IP-osoitteessa. Ei enää paikallista kehitystä.

Vaimoni ja minä paransimme myös suunnittelusta kehitykseen -projektiamme. Vuonna 2016 suunnittelut tehtiin pääasiassa Photoshopin ja suun kautta annettavien ohjeiden avulla.

"Voitko muuttaa tämän? Voitko lisätä sen? ”

Kumpikaan meistä ei nauttinut siitä.

Tällä kertaa vaimoni ja minä käytimme Invisionia yhteistyöhön. Voin nähdä hänen suunnittelumuutoksensa reaaliajassa ja toteuttaa ne muutamassa minuutissa.

Voimakytkentä parhaimmillaan.

Parannettu ongelmanratkaisu

Tämä ei tule yllätyksenä, mutta viimeisen kahden vuoden aikana minusta on tullut parempi ja nopeampi ohjelmoija. Mutta tärkein parannus oli ongelmanratkaisukykyni.

Minun ei tarvinnut etsiä miten luoda ruudukkoja CSS: ssä tai rakentaa kuvankaruselli JavaScriptiin. Minulla oli työkalut ja perusta, joita tarvitsin näiden kysymysten ratkaisemiseksi itse. Voisin viettää enemmän aikaa virtauksessa ja vähemmän aikaa googailemalla jokaista törmäämääni kysymystä.

Tiesin myös kuinka tehdä enemmän vähemmällä. Ensimmäisessä sivustossani oli satoja JavaScript-rivejä tehdäkseen yksinkertaisin animaatio. Uudessa sivustossa on vain 70 riviä. CSS-siirrot ja avainruudut käsittelevät loput.

CSS: n priorisointi JavaScriptin kanssa parantaa kunkin sivun suorituskykyä vähentämällä DOM-maalausta. Se ei kuitenkaan ollut ainoa tekemäni optimointi.

optimointeja

Kaksi vuotta sitten minulla ei ollut aavistustakaan kuinka esiintyjän verkkosivusto luoda, enkä välittänyt siitä. Halusin vain, että pirun asia toimisi. Nyt kun olen ymmärtänyt perusteet ja ajatellut abstraktion korkeampaa tasoa, voisin keskittyä suurempien ongelmien ratkaisemiseen. Nimittäin suorituskyky ja käyttökokemus.

Kääntämällä staattiset tiedostot, tarjoamalla niitä DigitalOceenin CDN: n kautta ja tallentamalla välimuistiin selaimessa, päivitetty sivusto pystyy lataamaan valaisunopeudella.

Suorituskyky Pingdomilta

Vuonna 2016 tuo edellinen lause näytti minulta ahkera. Voi, kuinka ajat ovat muuttuneet.

Ota aikaa arvioidaksesi kuinka paljon olet oppinut

Joten miksi sanon kaiken tämän? Hammastaa oma sarvi? Ehkä hieman.

Todellinen syy on, haluan korostaa itsereflektion merkitystä. Epäilen päivittää vaimoni sivustoa, koska en ollut tiennyt, kuinka paljon olen kasvanut. On vaikea nähdä summaa, jota edistät päivittäin.

Tieto kertyy tuumaa kerrallaan. Mutta katsomalla taaksepäin pitkän ajanjakson aikana, nämä tuumat muuttuvat harppauksiksi. Japanilaisessa kulttuurissa tämä ajatus pienistä päivittäisistä parannuksista tunnetaan nimellä “kaizen”.

Minulle on tärkeää muistaa missä olin urani alussa. Evoluutiosi visualisointi pitää minut motivoituneena, kun osuin tasangolle. Ebbs ja virtaukset ovat väistämättömiä. Sitoudun etenemään yksi tuuma kerrallaan on se, kuinka etenen kohti päämääriäni.

Joten kunnianosoituksena mestarisuudelle ja muistaen juuriani, vaimoni ensimmäinen sivusto elää henkilökohtaisen verkkosivustoni aliverkkotunnuksena. Voit nähdä sen itse osoitteessa kaizen.sunli.co.

Haluan antaa erityisen huudon Launch Schoolille opettaen minulle hitaan polkun tärkeyttä. Se on tavoite, jota jatkan.

Ja toinen huuto vaimolleni Iris Sprague'lle siitä, että hän oli vain uskomaton.

Joten olitko ohjelmoinut 10 kuukautta, 10 vuotta tai enemmän, ota aikaa pohtia, kuinka paljon olet oppinut. Käytä sitä polttoaineena, kun ajat ovat hitaita. Sijoittaminen hitaaseen tietämykseen on yhdistänyt tulokset. Aluksi asteittain, mutta riittävästi aikaa, huomaat kuin raketti.

Jos tämä artikkeli on kuullut teidän kanssanne, jätä joitain claps ja kerro minulle kuinka olet kasvanut omassa urassasi. Haluaisin kuulla siitä!

Kuten aina, onnellinen koodaus!