Eesrakendus vs tagarakendus¶

Kui alustad veebiarendamist, on kaks peamist suunda: eesrakendus ja tagarakendus. Need kaks töötavad koos, et luua täiuslik veebirakendus.

Eesrakendus - mida kasutaja näeb¶

Eesrakendus on kõik, mida kasutaja näeb ja millega ta suhtleb oma brauseris. See on veebilehe visuaalne pool.

Peamised tehnoloogiad:

HTML – veebilehe struktuur
CSS – kujundus ja stiilid
JavaScript – interaktiivsus ja dünaamiline käitumine

<div class="container">
    <h1>Tere tulemast!</h1>
    <button onclick="alert('Hei!')">
        Vajuta mind
    </button>
</div>

Tagarakendus - mida kasutaja EI näe¶

Tagarakendus töötab serveris ja kasutaja seda otseselt ei näe. See käsitleb andmeid, loogikat ja suhtlust andmebaasiga.

Peamised tehnoloogiad:

Node.js – JavaScript serveril
Python – Django, Flask
PHP – serveripoolne skriptimine
Andmebaasid – MySQL, MongoDB

const express = require('express');
const app = express();

app.get('/api/users', function(req, res) {
    res.json({ users: [] });
});

app.listen(3000);

Kuidas nad koos töötavad?¶

Kasutaja vajutab brauseris nuppu (eesrakendus)
JavaScript saadab päringu serverile (eesrakendus → tagarakendus)
Server töötleb päringu ja otsib andmeid andmebaasist (tagarakendus)
Server saadab vastuse tagasi (tagarakendus → eesrakendus)
Brauser näitab uusi andmeid kasutajale (eesrakendus)

Näide: sotsiaalmeedia rakenduses on eesrakendus see, kuidas näed postitusi ja uudisevoogu. Tagarakendus on see, mis toob postitused andmebaasist ja kontrollib, millised sulle kuvada.

// Eesrakendus (brauser)
fetch('/api/data')
    .then(response => response.json())
    .then(data => {
        console.log(data);
    });

// Tagarakendus (server)
app.get('/api/data', (req, res) => {
    res.json({ message: 'Tere eesrakendus!' });
});

Võrdlus¶

Eesrakendus	Tagarakendus
Nähtav kasutajale	Peidetud kasutajalt
Disain ja kasutajaliides	Andmete töötlemine
Töötab brauseris	Töötab serveril
Visuaalne keskendumine	Loogika ja turvalisus

Millega alustada?¶

Eesrakendus on hea valik, kui sulle meeldib:

disain ja visuaalne looming
kohe näha tulemusi
kasutajakogemuse loomine

Tagarakendus on hea valik, kui sulle meeldib:

loogika ja algoritmid
andmete struktureerimine
süsteemide planeerimine

Kokkuvõte¶

Eesrakendus ja tagarakendus on nagu kaks poolt ühel mündil – nad vajavad teineteist, et luua täiuslik veebirakendus. Eesrakendus on see, mida näed. Tagarakendus on see, mis töötab taustal.