\chapter{Web-ohjelmointi} Web-ohjelmoinnilla tarkoitetaan nettiselaimen välityksellä käytettävien ohjelmien ohjelmoimista. Web-ohjelma jaetaan useimmiten kahteen osaan: asiakaspuoleen (eng. client side) ja palvelinpuoleen (eng. server side). \section{Asiakaspuoli} \label{sect:asiakaspuoli} Asiakaspuoli koostuu käyttäjän nettiselaimesta, missä käyttöliittymän rakenne määritetään HTML-dokumentissa. HTML-dokumenttia voi muokata käyttämällä DOM:ia \cite{wiki:dom}. DOM, eli dokumenttioliomalli on tapa kuvata HTML-dokumenttia puurakenteena, joka mahdollistaa dokumentin elementtien lukemisen ja muokkaamisen. Muokkaaminen suoritetaan asiakaspuolen web-ohjelmointikielellä, johon on tällä hetkellä kaksi vaihtoehtoa: JavaScript sekä WebAssembly, jota tarkastellaan tässä insinöörityössä tarkemmin. Käyttöliittymän ulkonäköä ja toiminnallisuutta voi myös muokata palvelinpuolella. Tätä kutsutaan palvelinpuolen renderöinniksi ja siihen useimmiten käytetty ohjelmointikieli on PHP. Kun käyttöliittymän ulkoasua muokataan PHP:lla, HTML-dokumenttia muokataan palvelimella ennen kuin se lähetetään asiakkaalle. Palvelinpuolen renderöinti on kuitenkin jäänyt taka-alalle yhden sivun ohjelmien yleistyessä. \section{Yhden sivun ohjelmat} \label{sect:spa} Yhden sivun ohjelmat \cite{wiki:spa} ovat tapa toteuttaa asiakaspuolen ohjelmia, missä selain lataa yhden ohjelman ja HTML-dokumentin, minkä jälkeen sivujen uudelleenlatauksia ei enää tapahdu. HTML-dokumentin DOM:ia muutetaan niin sanotusti lennosta. Tämä mahdollistaa sulavamman käyttökokemuksen asiakkaan näkökulmasta, sekä helpottaa sovelluksen tilanhallintaa kehittäjän näkökulmasta. \clearpage Ohjelman tilaa hallinnoidaan usein lukemalla ja muuttamalla asiakkaan nettiselaimen osoitekenttää. Tätä kutsutaan asiakaspuolen reititykseksi. Reititys mahdollistaa myös tiettyyn ohjelman tilaan siirtymiseen suoraan, mikä on hyödyllistä esimerkiksi silloin, kun sovelluksen käyttäjillä on tarve jakaa linkkejä ohjelmaan. \section{Palvelinpuoli} Palvelinpuolella tarkoitetaan ohjelman osaa, johon asiakaspuoli yhdistyy noutaakseen tai tallettaakseen tietoa. Palvelinpuolen ohjelmointikielissä on huomattavasti enemmän vaihtoehtoja, sillä palvelin kommunikoi asiakkaan kanssa käyttämällä HTTP-protokollaa, johon löytyy kirjastoja lähes jokaiselle ohjelmointikielelle. \subsection{REST} Palvelinpuoleen viitataan usein myös rajapintana (eng. Application Programming Interface, API), sillä tämänkaltaisia HTTP-protokollalla ohjattavia ohjelmia voi käyttää myös muuallakin kuin asiakaspuolen web-ohjelmissa. Rajapinnat voivat myös yhdistyä toisiinsa internetin välityksellä ja näin jakaa tietoja eri palveluiden välillä. Rajapintojen yleistyessä on kehitetty standardeja, joiden mukaan rajapintoja voi rakentaa. Näin rajapinnoista tulee helpompia käyttää kaikille. Yksi näistä standardeista on Representational state transfer (REST) \cite{wiki:rest}, jota pyrin käyttämään tämän insinöörityön projektia ohjelmoidessa.