Full Stack projektin katselmointi

[Kaltsoon]

Full Stack projektin katselmointi

Terve @ronituohino! Tässä lyhyt katselmointi Full Stack kurssin projektistasi. Katselmoinnissa esitetyt kommentit ovat parannusehdotuksia, joita voit halutessasi ottaa huomioon tässä tai tulevissa projekteissasi. Mitään muutoksia tähän projektiin ei siis ole pakko tehdä suoritusmerkintää varten.

Käytettävyys

Mitä tein?

• Rekisteröin uuden käyttäjän
• Selasin etusivua ja kokeilin hakua
• Selasin eri tuotteita ja lisäsin niitä ostoskoriin
• Muokkasin ostoskoria
• Siirryin kassalle
• Kirjauduin ulos

Kokemus

• Verkkokauppa-sovelluksen käyttöliittymä on erittäin tyylikäs ja helppokäyttöinen, loistavaa työtä! 🥇
• Hieno logo!
• Lomakkeissa on kattavat validoinnit ja virhetilanteissa selkeät virheilmoitukset, hienoa!
• Automaattinen sisäänkirjautuminen rekisteröitymisen jälkeen nopeuttaa sovelluksen käyttöönottoa
• Lokalisointi on erittäin tärkeä toiminallisuus
• Ostoskorin muokkaaminen on hieman epäintuitiivista poistamisen osalta. Kun roskakori-ikonia klikkaa, tuota ei poistu korista, vaan ilmestyy haalea "Cancel delete"-teksti. Sitten kun tekstiä painaa, tuote poistuu. Pitäisikö tekstin olla "Confirm delete", vai onko toiminallisuudessa vaan jokin virhe?

Koodi

• Frontend-puolen koodi on selkeästi organisoitua, hyvä!
• Hakemistosta hooks löytyy erittäin hyviä uudelleenkäytettäviä hookkeja, jotka yksinkertaistavat komponenttien koodia
• Sisään- ja uloskirjautumisen yhteydessä voi olla järkevää tyhjentää koko Apollon välimuisti resetStore-metodin avulla
• GraphQL-kyselyt ja mutaatiot on organisoitu selkeästi, hyvä! Toistuvien kenttien kanssa voisi ehkä hyödyntää fragmentteja
• react-i18next on kätevä kirjasto sovelluksen lokalisointiin
• Myös backend-puolen koodi on selkeästi organisoitua, hienoa!
• GraphQL-skeeman määrittely on pilkottu järkevästi eri tiedostoihin
• Hyvän näköinen Docker-ympäristö. Ehkä MongoDB:n lisäksi frontendille ja backendille voisi tehdä omat Dockerfile:t ja lisätä ne serviceiksi docker-compose.dev.yml-tiedostoon. Koko kehitysympäristön saisi helposti pystyyn yhdellä komennolla

Kokonaisuus

Verkkokauppa-sovelluksesta löytyy sopiva määrä toiminallisuutta, jota yksinkertaiseen verkkokauppaan tarvitaan. Sen käyttöliittymä on erittäin tyylikäs ja helppokäyttöinen. Katselmoinnin aika sovelluksesta ei löytynyt bugeja, eikä kovin suuria käytettävyysongelmia. Projektin koodi on organisoitu kaikilta osin selkeästi ja koodin laatu on erinomainen. Hyvää työtä!

[ronituohino]

Hei @Kaltsoon!

Ostoskorissa olevia tuotteita poistettaessa tarkoituksena oli tuoda esiin kaksi varmistusnappia Cancel & Delete, jotta käyttäjä ei vahingossa poista jotain tuotetta. Korjasin nyt asian paremmaksi!

Nyt en fragmentteja tai react-i18next -kirjastoa viitsinyt alkaa implementoimaan, mutta vaikuttavat kyllä erittäin hyödyllisiltä. Huomasin lokalisoinnin yhteydessä kuinka tuskalliseksi sen ylläpito voi käydä (varsinkin minun yksinkertaisella ratkaisulla 😂).

Dockeria käytin yhdessä vaiheessa tuotantoa. Minulla oli mielestäni hyvät tuotanto- ja kehitysympäristöt, mutta en löytänyt tapoja julkaista docker-compose -sovellusta. Loppuvaiheilla aloin purkamaan ympäristöjä ja organisoimaan projektin rakennetta uudelleen. Kurssimateriaalissa oli kattavasti Dockerin käytöstä, mutta sen deployaaminen jää hieman mysteeriksi...

Kiitos paljon katselmoinnista, ja erinomaisesta palautteesta!