Budjetti & lisätyöt
Teknisessä toteutuksessa seurataan säännöllisesti, vähintään viikottain, paljonko budjetista on käytetty. Jos budjetti näyttää ylittyvän esimerkiksi jonkin ongelman tai odottamattoman työmäärän vuoksi, se otetaan puheeksi projektitiimin kesken. Budjetin ylittymisestä kommunikoidaan aikaisessa vaiheessa asiakkaalle. Tällöin neuvotellaan asiakkaan kanssa lisäyksestä budjettiin, jonkin osion tekemisestä tuntityönä tai jonkin osion pois jättämisestä. Tarjouksen, leiskan tai rautalangan tai speksin ulkopuolelta tulevat pyynnöt ovat lisätöitä, joille sovitaan oma budjetti.
Kehitystyön aloitus (web-kehittäjille)
Bitbucket
Unfair käyttää versionhallinnassa gittiä ja repositoriot säilytetään Bitbucketissa. Uusien asiakkaiden teemojen repositoriot nimetään ”Asiakas theme”. Omistajaksi asetetaan Unfair ja projektiksi valitaan ’ASIAKKAAT’. Repositorioon luodaan oma haara tuotantopalvelimen teemalle (master
) ja staging-palvelimen teemalle (dev
).
Bitbucket ja GitHub Slack-integraatiot
Bitbucket ja GitHub repositoriot voidaan linkittää suoraan Slackiin kanavalle #push_it_real_good. Kanavan tarkoitus on ilmoittaa (master
) -haaran pushauksista jotta muut kehittäjät saavat tiedon uusista muutoksista, varsinkin projekteissa joissa on useampi kehittäjä mukana.
Bitbucket repositorion liittäminen Slack-kanavalle
Valitse Bitbucketista repositorio, jonka haluat liittää kanavalle. Mene repositorion asetuksiin ja kohtaan Slack – > Settings
Klikkaa ”Add subscription” -painiketta.
Valitse oikea workspace, oletuksena luultavasti Unfair. Valitse tämän jälkeen listasta #push_it_real_good -kanava.
Valitse (master
) -haara ja valitse ilmoitustyypit. Ilmoitukset kannattanee konfiguroida koskemaan vain (commits pushed
) ja (branch merged
) tapahtumia.
Paikallinen ympäristö
Paikallisessa kehitysympäristössä web-kehittäjä käyttää Local by Flywheel -sovellusta. Paikallinen kehitysympäristö pystytetään loitsu.sh
skriptillä. Skripti kloonaataan Githubista kotihakemiston juureen ( ~/
). Tarkemmat ohjeet löydät repositorion README:stä.
Koodieditori
Web-kehittäjän koodieditori on Visual Studio Code. Vaaditut VS Code -laajennukset ovat:
- phpcs
- PHP-linter
- vaatii myös phpcs:n asennettuna tietokoneelle
composer global require squizlabs/php_codesniffer
- EditorConfig for VS Code
- Lukee teemassa olevan
.editorconfig
tiedoston, jossa on asetettu mm. sisennyksen koko (2)
- Lukee teemassa olevan
- WordPress VS Code Extension Pack
- Sisältää mm. WordPressin ACF:n snipettejä
Erittäin vahvasti suosittellut laajennukset:
Koodin standardit
Yleiset standardit
Sisennyksenä käytetään kahta välilyöntiä. Tämä on määritelty .editorconfig
-tiedostossa, jolloin oikea sisennys tulee TABia painamalla. PHPCS-linter näyttää mm. virheellisen sisennyksen koodissa punaisena aaltoviivana koodin alla. Web-kehittäjä varmistaa, että koodissa ei ole tyylivirheitä ennen kuin lähettää sen Bitbucketiin.
Tyylit (SASS)
Unfair Starter -teemassa tyylit kirjoitetaan SASSilla, joka käännetään CSS:ksi. SASS-tiedostot ovat assets/styles
-hakemistossa, jossa ne on jaettu alihakemistoihin _global
, elements
ja templates
. Tavoitteena on kirjoittaa tyylejä kohtuullisen modulaarisesti, joka tarkoittaa, että sivuston osilla on oma tyylitiedosto. Osa tyyleistä koskee kuitenkin koko sivustoa, jolloin ne sijoitetaan _global
-hakemistoon.
Esimerkkejä:
- Hero-osio
assets/styles/elements/content/_hero.scss
- Teaser (artikkelinosto)
assets/styles/elements/content/_teaser.scss
- SASS-muuttujat
assets/styles/_global/_variables.scss
- Tekstien koko- ja kirjaisinmääritykset
assets/styles/elements/typography/_text.scss
Tyylien kirjoittamisessa noudatetaan WordPressin CSS:än kirjoittamisen standardeja. Tärkein standardi on järjestää ominaisuudet (properties) seuraavan järjestyksen mukaan:
- Display
- Positioning
- Box model
- Colors and Typography
- Other
Esimerkki:
.notification { display: none; position: relative; bottom: 0; z-index: 1; width: 100%; padding: 1rem 0; background-color: $btn-light; color: $white; font-weight: $bold; }
Tämä parantaa silmäilynopeutta ja auttaa löytämään halutun ominaisuuden nopeammin.