WordPress Gutenberg -sisältölohkojen kehittäminen
Mellin, Joona (2023)
Mellin, Joona
2023
All rights reserved. This publication is copyrighted. You may download, display and print it for Your own personal use. Commercial use is prohibited.
Julkaisun pysyvä osoite on
https://urn.fi/URN:NBN:fi:amk-2023051912116
https://urn.fi/URN:NBN:fi:amk-2023051912116
Tiivistelmä
Tämä toiminnallinen opinnäytetyö selvittää, miten WordPress Gutenberg -sisältölohkoeditorille kehitetään uusia sisältölohko -komponentteja. Opinnäytetyö on rajattu siten, että lukijan oletetaan tuntevan WordPress-sisällönhallintajärjestelmä sekä sen kehityksen perusteet. Opinnäytetyössä kuvataan lohkokehityksen prosessi suunnitelmasta lopputuotteeseen asti, käsitellen prosessin aikana kehitysympäristön perustaminen, lisäosan ja lohkokategorian luominen, sekä itse lohkojen rekisteröiminen.
Tietoperustan ensimmäisessä luvussa kuvaillaan Gutenberg -lohkoeditorin toimintalogiikkaa, käyttöä, taustoja sekä tulevaisuutta. Luvun aikana tarkastellaan myös editorin mukana tulevia sisältölohkoja. Tietoperustan toinen luku käsittelee lohkokehityksessä käytettäviä teknologioita, ja paneutuu tarkemmin erityisesti React-ohjelmakirjastoon sekä sen käyttämään JSX-syntaksiin. Lisäksi toisessa luvussa käsitellään niitä WordPressin sisäisiä rajapintoja, joita lohkokehityksessä hyödynnetään.
Opinnäytetyöprosessin aikana toteutettin kaksi sisältölohkoa, keskenään eriävien menetelmien avulla. Ensimmäinen lohko on verkkolehdistä tuttu kainalojuttulohko, joka hyödyntää palvelimen puolella tulostamista, ja tukee muiden lohkojen lisäämistä kainalojutun sisälle. Toinen lohko on palvelimen puolen tulosteella toimiva artikkelinostolohko, joka nostaa artikkeleita ylläpitäjän valitseman määrän tämän niin ikään valitseman kategorian perustella. Lohkoja varten rekisteröitiin lisäksi oma lisäosa, jonka avulla artikkelit voi lisätä mihin tahansa WordPress-asennukseen, sekä lohkokategoria, jonka avulla ylläpitäjä löytää lisäosan luomat lohkot helpommin editorissa.
Työ saavutti sille asetetut tavoitteet, ja molemmat lohkot toimivat niille suunniteltuun tapaan. Työn aikana selvisi, että kehitystyötä voidaan tehdä monipuolisesti eri teknologioiden avulla. Yksinkertaisimmillaan lohko sisältää vain yhden JavaScript-tiedoston, joka rekisteröi lohkon muutaman perustietokentän avulla. Rajoitteena lohkon käyttämille teknologioille toimii oikeastaan ainoastaan lohkon rekisteröinti, joka tulee tehdä JavaScript-tiedoston avulla, tai palvelimen puolella. Tuloste voidaan siis tehdä vapaavalintaisella verkkokehitysteknologialla.
Tietoperustan ensimmäisessä luvussa kuvaillaan Gutenberg -lohkoeditorin toimintalogiikkaa, käyttöä, taustoja sekä tulevaisuutta. Luvun aikana tarkastellaan myös editorin mukana tulevia sisältölohkoja. Tietoperustan toinen luku käsittelee lohkokehityksessä käytettäviä teknologioita, ja paneutuu tarkemmin erityisesti React-ohjelmakirjastoon sekä sen käyttämään JSX-syntaksiin. Lisäksi toisessa luvussa käsitellään niitä WordPressin sisäisiä rajapintoja, joita lohkokehityksessä hyödynnetään.
Opinnäytetyöprosessin aikana toteutettin kaksi sisältölohkoa, keskenään eriävien menetelmien avulla. Ensimmäinen lohko on verkkolehdistä tuttu kainalojuttulohko, joka hyödyntää palvelimen puolella tulostamista, ja tukee muiden lohkojen lisäämistä kainalojutun sisälle. Toinen lohko on palvelimen puolen tulosteella toimiva artikkelinostolohko, joka nostaa artikkeleita ylläpitäjän valitseman määrän tämän niin ikään valitseman kategorian perustella. Lohkoja varten rekisteröitiin lisäksi oma lisäosa, jonka avulla artikkelit voi lisätä mihin tahansa WordPress-asennukseen, sekä lohkokategoria, jonka avulla ylläpitäjä löytää lisäosan luomat lohkot helpommin editorissa.
Työ saavutti sille asetetut tavoitteet, ja molemmat lohkot toimivat niille suunniteltuun tapaan. Työn aikana selvisi, että kehitystyötä voidaan tehdä monipuolisesti eri teknologioiden avulla. Yksinkertaisimmillaan lohko sisältää vain yhden JavaScript-tiedoston, joka rekisteröi lohkon muutaman perustietokentän avulla. Rajoitteena lohkon käyttämille teknologioille toimii oikeastaan ainoastaan lohkon rekisteröinti, joka tulee tehdä JavaScript-tiedoston avulla, tai palvelimen puolella. Tuloste voidaan siis tehdä vapaavalintaisella verkkokehitysteknologialla.