Modul u kojem se znanje pretvara u objavljen proizvod: web aplikacija s bazom i backendom, vlastita igra te radne prakse bez kojih ozbiljan projekt ne stoji: vođenje koda u Gitu, debugiranje, testiranje i dokumentiranje. Udruga se bavi razvojem softvera kroz projektni i timski rad, uz javno predstavljanje gotovih radova.
Osnovni podaci
- Dob:
- Web/baze/backend: stariji osnovnoškolci i srednjoškolci
- Razvojne prakse: stariji osnovnoškolci i srednjoškolci
- Igre: Za mlađe i starije osnovnoškolce, te srednjoškolce
- Težište:
- Web/baze/backend: web front-end, SQL, relacijska baza, API, deploy
- Razvojne prakse: Git/GitHub, debugiranje, testiranje, dokumentiranje, pristupačnost, suradnja
- Igre: game loop, fizika, stanja, objava igre
- Preduvjet:
- Web/baze/backend: osnovno programiranje; Razvojne prakse (Git)
- Razvojne prakse: osnovno programiranje ili rad na projektu
- Igre: nema (mlađi); osnovno programiranje (Godot)
- MZO domena: B, C
- Infokup: Razvoj softvera (metodologija)
- Obuhvat: 3 skupa ishoda učenja iz kurikula, 63 teme
- Napredovanje: grupe po razini znanja, ne po dobi
Ciljevi modula
Web, baze i backend (full-stack)
- izraditi web-sučelje (HTML/CSS/JS)
- postaviti pitanje podacima (SQL)
- modelirati relacijsku bazu
- postaviti siguran API i objaviti full-stack uslugu
Razvojne prakse i alati
- voditi kod u Gitu i surađivati
- sustavno debugirati i testirati
- dokumentirati rad drugima
- raditi pristupačno i timski
Razvoj igara
- napraviti igru igrivu u pregledniku
- koristiti stanja, fiziku i UI
- objaviti igru na webu
Ishodi učenja
Web, baze i backend (full-stack). Polaznik izrađuje web-sučelje, modelira podatke u relacijskoj bazi, postavlja siguran API i objavljuje full-stack uslugu na javnoj adresi.
Razvojne prakse i alati. Polaznik vodi kod u sustavu za verzioniranje, surađuje putem pull requesta, testira i dokumentira svoj rad.
Razvoj igara. Polaznik izrađuje i objavljuje igrivu igru na webu, s izbornikom, rezultatom i stanjima pobjede/poraza.
MZO ishodi (NN 22/2018)
Ishodi su mapirani na kurikulum Informatike iz Narodnih novina 22/2018. Kodovi su jedinstveni samo unutar smjera, pa je uz svaki naveden i smjer (OŠ - osnovna škola, gimn - gimnazija, PMG - prirodoslovno-matematička gimnazija).
- Web, baze i backend (full-stack): C.7.2 (OŠ); A.3.1, A.4.1 (gimn); B.4.2.b (PMG - GUI aplikacija)
- Razvojne prakse i alati: B.8.1 (OŠ); B.2.4 (gimn); D.1.3 (gimn - pristupačnost)
- Razvoj igara: B.8.1 (OŠ); B.3.1, B.4.2.b (PMG)
Razine usvojenosti
Četiri razine opisuju što ovladavanje modulom znači u praksi. Polaznik napreduje po razini, ne po dobi.
Web, baze i backend (full-stack)
- zadovoljavajuća: izradi jednostavnu stranicu ili postavi SQL pitanje
- dobra: poveže front-end s bazom (JOIN, shema)
- vrlo dobra: postavi siguran API nad bazom
- iznimna: objavi full-stack uslugu s prijavom i trajnim podacima
Razvojne prakse i alati
- zadovoljavajuća: spremi promjene u Git uz pomoć
- dobra: samostalno vodi granu i otvori pull request
- vrlo dobra: debugira i napiše test za svoj kod
- iznimna: vodi projekt s poviješću, testovima, dokumentacijom i pristupačnošću
Razvoj igara
- zadovoljavajuća: napravi igrivu scenu u Scratchu/GDevelopu
- dobra: koristi game loop, fiziku i stanja
- vrlo dobra: izradi igru s izbornikom i spremanjem
- iznimna: objavi dorađenu igru na webu (itch.io) + devlog
Razrada
Razrada je složena po skupovima ishoda učenja i razinama znanja. Polaznik se upisuje na razinu koju je dosegao, neovisno o dobi. Klikni na temu za objašnjenje što ona pokriva.
Web, baze i backend (full-stack)
28 tema · stariji osnovnoškolci i srednjoškolci
Osnovna razina - web front-end
HTML
struktura web-stranice
CSS
izgled i raspored stranice
JavaScript
interaktivnost u pregledniku
DOM i događaji
mijenjanje stranice kodom i reakcije na klik
responzivni dizajn
stranica koja radi na mobitelu i računalu
preglednik i dev-alati
alati za razvoj u pregledniku (inspektor, mreža)
Osnovna razina - baze podataka
što su podaci
podatak, zapis, tablica - osnovni pojmovi
tablice, redovi, ključevi
kako su podaci složeni i jedinstveno označeni
SQLite
mala baza u jednoj datoteci, za vježbu
10 SQL pitanja nad vlastitom bazom
prvi SQL upiti nad vlastitim podacima
Srednja razina - baze podataka
SELECT/JOIN/GROUP BY
dohvat, spajanje tablica i grupiranje
dizajn sheme
kako smisleno posložiti tablice
strani ključ
veza između tablica (foreign key)
normalizacija
uklanjanje redundancije u shemi baze
PostgreSQL
prava relacijska baza za ozbiljniji rad
prvi HTTP endpoint (Express/Flask)
prva web-ruta koja vraća podatke
Napredna razina - backend
indeksi
ubrzavanje upita indeksima
transakcije i ACID
pouzdane promjene nad bazom (ACID)
predmemoriranje (caching)
ubrzavanje predmemorijom (Redis/CDN)
REST vs GraphQL
dva stila API-ja i kad koji
autentifikacija (JWT/sesije/OAuth)
prijava korisnika: tokeni, sesije, OAuth
ORM
rad s bazom preko objekata u kodu
migracije
verzioniranje promjena sheme baze
sigurnost API-ja
zaštita od zloupotrebe (SQLi, ovlasti)
okruženje i tajne
konfiguracija i čuvanje tajni (env/secrets)
testiranje
automatski testovi za backend
CI/CD
automatsko testiranje i objava pri svakoj promjeni
deploy
objava servisa na javnu adresu
Razvojne prakse i alati
14 tema · stariji osnovnoškolci i srednjoškolci
Osnovna razina - verzioniranje
Git: init/clone
stvaranje i kloniranje repozitorija koda
commit i povijest
snimke koda: add, commit, status, log
remote (push/pull)
sinkronizacija koda s GitHubom (push/pull)
.gitignore
što ne spremati u repozitorij
Srednja razina - suradnja
grane i spajanje
paralelan rad granama i spajanje (merge)
pull request i code review
predaja promjena i pregled tuđeg koda
Git LFS (za resurse)
verzioniranje velikih datoteka (slike, zvuk, modeli)
rješavanje konflikata
spajanje kad se promjene sudare
Napredna razina - kvaliteta
debugiranje (čitanje greške, tracing)
sustavno traženje uzroka greške
rubni slučajevi
granice i neobični ulazi koji lome kod
jedinični testovi
automatski testovi male jedinice koda
TDD osnove
prvo test pa kod (test-driven development)
dokumentiranje (README)
kratko objasniti drugima kako se koristi
pristupačnost (a11y)
rad upotrebljiv za sve (kontrast, tipkovnica, ARIA)
Razvoj igara
21 tema · Za mlađe i starije osnovnoškolce, te srednjoškolce
Osnovna razina
game loop
petlja igre - ažuriraj pa iscrtaj, stalno
sprite i događaji
likovi/slike i reakcije na tipke
kolizija
prepoznavanje sudara objekata
blok-logika (Scratch)
programiranje slaganjem blokova
GDevelop (no-code)
izrada igre bez pisanja koda
Srednja razina
delta-time petlja
glatko kretanje neovisno o brzini računala
animacija
animiranje likova (sličice, prijelazi)
2D fizika
gravitacija, sudari, odbijanje
tilemape
gradnja 2D razina iz pločica (tilemap)
stanja (state machine)
stanja igre/lika (miruje, trči, skače)
HUD i UI
prikaz bodova, života i izbornika
‘juice’ (osjećaj igre)
trešnja ekrana, čestice, tweenovi - igra koja se ‘osjeća’
zvuk
zvučni efekti i glazba u igri
skriptiranje (Godot/GDScript)
logika igre kodom u Godotu
Napredna razina
arhitektura i scene
organizacija igre u scene i komponente
uvod u shadere
GPU efekti: vertex i fragment shaderi (osnove)
spremanje igre (perzistencija)
spremanje i učitavanje napretka i stanja
jednostavni multiplayer
klijent/server i sinkronizacija (osnove)
UX i polish
doživljaj igrača i sitno dorađivanje
objava igre
izrada builda i objava igre
itch.io / web build
objava igre na webu (itch.io)