Kuinka rakensin (uudelleen) keskipitkän taputteen tehon - ja mitä sain kokeesta.

Lopputulos

Neljä vuotta sitten luin tarjouksen, joka muuttaisi elämääni ikuisesti.

En muista ympäröivää tilannetta, mutta aurinko oli kuumempaa ja olin Google-haun tulossivulla.

Kuuluisa Pablo Picasso -lainaus aukesi, ja seuraavien viikkojen aikana olin täysin kadonnut siihen.

Hyvät taiteilijat kopioivat; hienot taiteilijat varastavat
- Pablo Picasso

Mitä? Tarkoittiko hän todella sitä?

Koska useat kysymykset pitivät mieleni pyörimässä, minun piti lukea lisää siitä, kuka Pablo oli.

Pablo Picasso oli taiteilija, jota pidettiin yhtenä 1900-luvun vaikutusvaltaisimmista ja suurimmista. Tässä vaiheessa tiesin, ettei hän ollut epäonnistunut kiertämällä roskakoria.

Jatkoin elämääni, mutta tuo tarjous ei koskaan jättänyt minua.

Vuosien kuluttua minusta oli tullut "varasta" -filosofian järkevä seuraaja. Se oli niin syvälle alitajuntaan, että ajattelin kirjoittaa jonain päivänä aiheesta New York Timesin bestsellerin.

Elämä tapahtui. Minun ei koskaan pitänyt kirjoittaa kirjaa :(

Sovelin sääntöä melkein kaikkeen mitä tein.

Esimerkiksi vietin tunteja kirjoittaessani useita (muiden rakentamia) koodekkeja käsin, kaikki pyrkiessään oppimaan jotain varastamalla. Aiemmin tänä vuonna näin Dan Abramovin puhuvan jostakin vastaavasta.

En ollut hullu loppujen lopuksi.

Varasääntö näyttää olevan yleinen hallinnan sääntö.

Anders Ericsson puhuu kirjassaan Peak: Secrets from the new asiantuntemustiede palautesilmukasta ja kuinka tärkeätä se on hallitseminen. Itse asiassa tämä oli sama tekniikka, jolla Benjamin Franklin kirjoitti uskomattomia kirjoja. Hän oli kiistatta yksi aikansa parhaimmista amerikkalaisista kirjailijoista.

Tämä ajattelutapa ja oppimismenetelmä saivat minut yrittämään uudelleen keskipitkän taputuksen vaikutuksen.

Koe

Keskipitkän taputuksen ovat suunnitelleet ja rakentaneet ihmiset, joilla on vähintään viisinkertainen maku kuin minulla on. Mutta tämä ei ollut ensimmäinen kerta, kun luin uudelleen muiden ihmisten tavaroita. Keskikokoinen taputus oli vain yksi monista sellaisista hankkeista.

Olen aina löytänyt Keskipitkän taputuksen olevan niin tyydyttävä. Olen monta kertaa taputtanut 50-merkin jälkeen vain tunteakseni tyydyttävän animaation.

Keskipitkän taputuksen rakentaminen oli mielenkiintoinen kokeilu. Tavoitteena ei ollut luoda tarkkaa kloonia, vain jotain, joka toimi kuin se.

Käytetty tekniikka

Sisällöksi käytin hyvää ol HTML: ää ja joitain SVG: tä. Sain taputunnuksen Noun-projektista.

SVG Luonut Luis Durazo Noun-projektista

Avasin klappikuvakkeen Illustratorissa ja muokkasin sitä sydämeni sisältöön. Sitten optimoin SVGOMG: n kautta.

Tarvitsin Javascriptiä interaktiivisuuteen. Joten rakensin taputuksen vanillaJS: n kanssa ja haastin sen sitten uudelleenrakentamiseen ReactJS: n kautta.

Animaatioita varten valitsin LegoMushroomin mo.js. Se näytti olevan paras Medium-taput-animaatioiden luomiseen. Mo.js on melko mielenkiintoinen animaatiokirjasto, jolla on deklaratiivinen sovellusliittymä. Minusta se on myös hyvin aloittelijaystävällistä.

Kuinka aloitin

En ollut erityisen varma mistä aloittaa. Minulla oli jonkin verran kokemusta SVG: stä, mutta minulla ei ollut paljon kokemusta mo.js: n kanssa.

Tänä aikana ei ollut mitään ”toimivaa” keskipitkää taputusta kopeenilla. Siellä ei ollut mitään opittavaa.

Joten varastiin jälleen.

"Verkossa on oltava jotain, josta voin oppia", sanoin itselleni. Parin epäonnistuneen haun jälkeen löysin jotain.

Mary Lou's Codrops on helvetti resurssi käytännöllisille etusivuille. Etsin ja löysin sieltä joitain animoituja kuvakkeita.

Dodl Grinnin ampuma inspiroi codrops-animoituja kuvakkeita

Kuvakkeet eivät olleet mitään Medium-taputusta, mutta siellä oli varmasti jotain opittavaa.

Tiedätkö mitä tein, eikö niin?

Rakensin codrops-animoituja kuvakkeita alusta alkaen. Kopioin koko kooditietokannan käsin.

Tämä antoi minulle paljon näkökulmaa ja tiesin kuinka jatkaa Medium-taputusta myöhemmin.

Kuinka opit todella nopeasti?

Paitsi codrops-animoitujen kuvakkeiden rakentamisella, minulla ei ollut merkittävää kokemusta mo.js: stä

Se ei ollut iso juttu. Olin aina innostunut mahdollisuudesta oppia jotain uutta nopeammin, ja olin kehittänyt järjestelmän tavaroiden nopeaan oppimiseen.

Vuonna 2012 Scott Young suoritti alle yhden vuoden aikana kaikki 33 kurssia MIT: n tarkennetussa tietotekniikan opetussuunnitelmassa, lineaarisesta algebrasta aina laskentateoriaan. Hänestä tuli nopeasti inspiraationi.

Tämän MIT-opetussuunnitelman piti olla nelivuotinen opetussuunnitelma, mutta jotenkin hän onnistui kesyttämään sen systemaattisesti alle 12 kuukaudessa.

Uskon ultraoppimiseen. Se on niin tärkeä taito nykypäivän taloudessa.

Joten mikä oli suunnitelma?

Ensinnäkin, tarvitsin kattavuutta. Kattavuus mo.js-maaston ympärillä. Kuten Scott sanoo, et voi suunnitella hyökkäystä, jos sinulla ei ole karttaa maastosta.

Ensinnäkin luisin viralliset mo.js-oppaat. Ohitin joitakin, ollakseni rehellinen. Näin youtube-videon, jossa Sarah Drasner selitti mo.js-kirjaston toimintaa. Katson videota 2X nopeudella. Luin myös Saaran kirjan SVG Animations. Siellä oli luku, joka oli omistettu mo.js-kirjastoon.

Luin hyvin nopeasti.

Tarvitsin tässä vaiheessa vain selvityksen siitä, miten kirjasto toimi ja mitä sillä oli mahdollista.

Niiden jälkeen siirryin siirtämään tietoni työhön. Oli aika rakentaa Medium-taput.

Vietettyäni paljon aikaa animaatioihin, päädyin oikein oikein. Jotain, joka ei imenyt.

Esimerkkejä mo.js-pohjaisten animaatioiden kokoonpanoista

Juttuin joihinkin pisteisiin. Tein virheitä ja vietin jopa muutaman päivän säätämällä tavaroita. Mutta kyllä, sain sen toimimaan.

Mitä järkeä?

Uskon jatkuvasti haastavan itseäni. Työnnäni sitä pidemmälle, mitä luulen voivani tehdä.

Tämä oli vain uusi kokeilu tässä suhteessa.

Oliko se epäonnistunut kokeilu?

En sanoisi niin.

Kynä poimittiin 11. lokakuuta, ja yli 2000 ihmistä katsoi sitä.

Pyysin ReactJS-huippukokouksessa Lagosissa SVG- ja mikrointeraktioita. Puhuin siellä mikroliiketoiminnoista ReactJS-sovellusten yhteydessä ja sain näyttää kuinka rakentaa Medium-taputuksen tehoste.

johtopäätös

Olen tullut etsimään uutta rakkautta mikrovuorovaikutuksiin ja uskon, että he ovat pieniä jättiläisiä, jotka tekevät loistavan tuotteen.

Kaiken kaikkiaan se oli mielenkiintoinen ja hedelmällinen kokeilu. En pahoillani. Ei lainkaan.

Aionko suunnitella uudelleen joitain kunnianhimoisempia hankkeita? Helvetti, joo!

Mutta hei, se on puhe toiselle päivälle :)

Jatka rakentamista, jatka koodausta!