- Jeg er styreleder i borettslaget der jeg bor, og da koronatiltakene kom for fullt, forstod vi raskt at vårdugnaden kom til å bli problematisk å gjennomføre, forteller Bekk-utvikler og React-guru Kristofer Giltvedt Selbekk til kode24.
- For det første jobbet folk på mye mer sporadiske tider enn før, og i tillegg ville en vanlig dugnad være et enormt potensiale for smittespredning. Vi måtte komme på noe smart.
Og det gjorde han; en tjeneste for å skape felles, digitale arbeidslister for individuelt, manuelt arbeid. Tenk Kanban-brett, hvert hvert brett er en dugnad, og deltakerne kan ta på seg arbeidsoppgaver og huke dem av når sjauen er ferdig.
For ja - Selbekk kaller tjenesten Sjau.
- Folk kan bidra når de har tid og energi, og oppgavene kan gjøres utover en uke eller to istedenfor en kveld. På denne måten unngår vi ikke bare smittespredning i et tettbebodd område, vi får potensielt gjort mye mer! forteller Selbekk.
- Så får vi se om vi drar i gang en felles skål fra verandaene i bakgården når alle er ferdig.
«Det gjorde underverker for både utvikler-opplevelsen og den opplevde hastigheten på appen.»
Eksperimentell React
For å lage illustrasjoner fikk Selbekk med seg Marthe Dahlin. Herman Slyngstadli fikk strekene over til vektorgrafikk. Og navnet Sjau var det Erik Mathisen som fant på.
Men kodingen, den kunne Selbekk ta på strak arm selv. I React, selvfølgelig.
- Jeg lagde appen med et eksperimentelt bygg av React som støtter Suspense for datahenting. Det gjorde underverker for både utvikleropplevelsen og den opplevde hastigheten på appen, skryter Selbekk.
Hostingen tar Netlify seg av, som bygger og ruller ut en ny versjon hver gang Selbekk dytter inn ny kode. Om koden fungerer, vel og merke.
Firebase tar sjauen
På lik linje med tilsynelatende alle nye web-prosjekter for tida, er det Googles Firebase som tar seg av de tyngste løftene for Sjau, også. Både autentisering og databasen.
- Det har vært relativt smertefritt, med unntak av da jeg prøvde å implementere støtte for å logge inn med SMS; verifiseringskodene kom rett og slett aldri frem for mange av betabrukerne! Heldigvis var det en halvtimes jobb å bytte til Facebook og Google-innlogging, istedet, forteller Selbekk.
For å gjøre Firebase-jobben ekstra enkel, bruker han biblioteket Reactfire - da blir visst det hele "en lek", ifølge utvikleren. Og med Firebase trenger han uansett ikke noen egenkomponert backend.
- Det kan hende det ikke skalerer så godt om appen skulle vokse til et skikkelig feature-tog, men jeg vil helst holde appen enkel. Og siden Firebase er både rimelig og uendelig skalebart brukermessig, så sier jeg meg fornøyd med valget enn så lenge.
Framer Motion og Chakra UI
Ting skal funke, men ting skal helst se greit ut, også. Og det gjør Sjau - blant annet med små animasjoner av de fleste elementene du møter.
Disse er det Framer Motion som står for.
- Dette er et ganske nytt verktøy for meg, men det gjør deklarative animasjoner lekende lett i React. Kan virkelig ikke anbefale det nok, skryter Selbekk.
Også for designet generelt har han fått god hjelp av et bibliotek.
- Appen er skrevet omtrent uten en eneste linje CSS, takket være fleksibiliteten til komponentbiblioteket Chakra UI. Chakra er laget av nigerianske Segun Adebayo, som har gjort en fantastisk jobb med å kombinere styled-system med et lett visuelt uttrykk.
Slik blir du en bedre React-utvikler i 2020
Gratis, enn så lenge
På sjau.no står det at tjenesten er "helt gratis denne våren".
- Det blir spennende å se om det går an å tjene litt penger på det her også. Det er mange måter å gjøre det på, om jeg vil, da. Enn så lenge er appen gratis for alle, slik at jeg får gjort den så bra og brukervennlig som mulig, forteller Sjau-utvikler Selbekk.
Så langt har de hatt over 2.600 besøkende, 450 av dem har laget seg konto, og det har blitt oppretta over 150 sjauer. Så sjauen er ikke over for Selbekk sin del.
- For vi kommer nok til å få en god del tilbakemeldinger. Jeg har uansett noen ting på plakaten som burde fikses - og en hel haug med duplisert kode jeg kan fjerne etterhvert.