WEB PROGRAMIRANJE

Kreiranje web aplikacija

Web programiranje obuhvata kreiranje web sajtova i aplikacija korišćenjem tehnologija kao što su HTML, CSS i JavaScript. Web sajt je zbir statičkih stranica, često informativnih, dok je web aplikacija interaktivnija, omogućavajući korisnicima unos i obradu podataka (npr. Gmail ili Google Docs).
Statični sajtovi prikazuju iste podatke svima, dok dinamički sajtovi generišu različit sadržaj u zavisnosti od korisničkog unosa ili interakcije.
Za početak, preporučuje se učenje HTML-a za strukturu, CSS-a za stilizaciju, i JavaScript-a za interaktivnost, a zatim prelazak na backend tehnologije poput PHP-a ili Node.js-a za kreiranje dinamičkih sajtova.

​Za razliku od desktop aplikacija koje se instaliraju na nekom lokalnom računaru, web aplikacije su aplikacije koje se izvršavaju na nekom udaljenom računaru(web serveru), a kojoj korisnik pristupa sa svog računara(klijenta) preko interneta. Svaki web sajt ne mora da bude i web aplikacija.

​Web sajt je skup web stranica međusobno povezanih, kojima se može globalno pristupiti preko interneta i koje imaju jedinstveno ime domena. Te web strane mogu biti smeštene na jednom ili više web servera. Za razliku od websajta, web aplikacija je softver(program) kome se može takođe globalno pristupiti, preko interneta.

---

Image by Gerd Altmann from Pixabay

---

​Postoje sajtovi koji imaju samo statične strane postavljene na web serveru i one koje imaju jedne ili više dinamičkih web strana i za takve sajtove kažemo da su dinamički. Statička web strana se sastoji od HTML koda kreiranog u nekom tekst editor ili nekog naprednijeg alata. Dinamičke web strane sadrže pored HTML koda i skriptove koje se izvršavaju na strain klijenta, a postoje i dinamičke web strane koje sadrže neki serverski kod. 

​Ako se sajt sastoji samo od statičkih web strana njegov princip funkcionisanja je takav da se statičke web strane nalaze na strani web servera kao HTML dokumenti(ekstenzija fajlova je .htm ili .html). Korisnik koji se nalazi ispred uređaja(klijenta) posredstvom web pregledača(web browser-a) zahteva web stranu i šalje zahtev ka web serveru. Web server locira web stranu i konvertuje je u HTML tok (stream engl.). Kada tok stigne preko internet na lokalni klijentski uređaj(Računar, mobilni telefon tablet i sl.) web čitač(pregledač) obrađuje HTML i prikazuje web stranu.

Kod statičkih web strana za razliku od dinamičkih nije moguće pristupiti serverskim resursima kao npr. nije moguće prikazati vreme na serveru, nije moguće personalizovati webstranu itd.
Da bi kreirali web aplikaciju potrebno je :

• aplikacija na serveru
• aplikacija na klijentu
• web hosting

​Aplikacija na klijentu je u stalnoj komunikaciji sa aplikacijom na serveru. Korisnik preko klijentske aplikacije(npr web pretraživača) šalje zahtev serveru preko http protokola i zahteva web stranu. Serverska aplikacija obrađuje zahtev i pronalazi web stranu koja je zahtevana ili dinamički generiše stranu na osnovu podataka iz neke baze i drugih webstrana koje se nalaze na istom ili nekom drugom serveru. Zatim se dinamički kreirana strana vraća klijentu. Ta strana na serveru predstavlja običnu datoteku, koja se nalazi na disku. Server pronalazi datoteku na nekom računaru i kopiju te datoteke (stranu) šalje do klijenta.
Klijent može biti web pretraživač, mobilna aplikacija ili neka desktop aplikacija koja se nalazi na uređaju na strani korisnika.

​Strana na web serveru predstavlja običnu datoteku koju server ili šalje nepromenjenu ili je na neki način obradi, npr. popuni nekim podacima dobijenim iz baze podataka, a zatim je tako obrađenu vraća klijentu. U prvom slučaju je reč o statičkom, a u drugom o dinamičkom sajtu(web aplikaciji). Obrada zahteva se vrši preko određenog standardnog protokola koji se naziva HTTP protokol (HyperText Transfer Protocol), protokol.
HTTP uzima zahtev klijenta i pakuje ga u format koji standardni Web server može da razume.

​Klijent prima preko tog istog protokola odgovor od strane servera nazad i njegov zadatak je da na određen način web stranu prikaže klijentu. Strana koju je klijent preuzeo je u stvari HTML kod koji se sastoji od odgovarajućih tagova i oni se na određen način prikazuju na ekranu.
HTML je tekstualni nosilac informacija(a ne binarni kao npr word dokument) i ne zavisi od platforme. HTML je računarski jezik čija je namena da čuva informacije o formatiranju teksta. U html kod se ugrađuje kod napisan u nekom od script jezika(npr. javascript) koji se izvršava na strani klijenta i daje određenu funkcionalnost webstrani.

​Zajedno sa HTML-om ide i CSS jezik zadužen za izgled webstrane.
Današnje web aplikacije za razliku od nekadašnjih klijent server aplikacija, kompletnu funkcionalnost ostvaruju na serveru. Pretraživač (browser) nije ništa drugo nego običan terminal. U njemu možete da unosite tekst (preko HTML formi) i da prikazujete tekst (preko HTML-a).

Moderne web tehnologije

Frontend okviri:

• React: React je popularna JavaScript biblioteka koju je razvio Facebook. Fokusira se na izgradnju brzih, dinamičnih korisničkih interfejsa efikasnim ažuriranjem i prikazivanjem komponenti na osnovu interakcije korisnika.
  
• Vue.js: Vue.js je progresivni JavaScript okvir poznat po svojoj jednostavnosti i fleksibilnosti, što ga čini idealnim za izgradnju interaktivnih veb interfejsa.
  

​

Backend jezici:

• Node.js: Node.js vam omogućava da pokrenete JavaScript na strani servera, što ga čini moćnim za pravljenje skalabilnih aplikacija u realnom vremenu.
  
• PHP: PHP je široko korišćen skriptni jezik na strani servera, posebno pogodan za veb razvoj i dinamički sadržaj.
  
• Python: Python je svestran za veb razvoj i nudi okvire kao što su Django i Flask koji pojednostavljuju pozadinske procese. Svaka od ovih tehnologija igra ključnu ulogu u savremenom razvoju veba i može biti jaka osnova za kreiranje veb lokacija i aplikacija.

Dodatni primeri CRUD operacija

​Kada razvijamo veb aplikacije, ključna komponenta su osnovne operacije manipulacije podacima poznate kao CRUD (Create, Read, Update, Delete). Ove operacije omogućavaju korisnicima interakciju sa podacima na intuitivan način. U nastavku su navedeni primeri kako možete implementirati CRUD operacije u ASP.NET Core aplikaciji koristeći Entity Framework. Ovi primeri pružaju osnovu za rad sa bazom podataka, obuhvatajući dodavanje, prikaz, izmenu i brisanje zapisa.

1. Kreiranje novog zapisa (Create)

public async Task<IActionResult> Create(Item item)
{
    _context.Items.Add(item);
    await _context.SaveChangesAsync();
    return RedirectToAction(nameof(Index));
}

Čitanje zapisa (Read)

public async Task<IActionResult> Details(int? id)
{
    var item = await _context.Items.FindAsync(id);
    if (item == null) return NotFound();
    return View(item);
}

​Ažuriranje zapisa (Update)

public async Task<IActionResult> Edit(int id, Item item)
{
    if (id != item.Id) return BadRequest();
    _context.Update(item);
    await _context.SaveChangesAsync();
    return RedirectToAction(nameof(Index));
}

​Brisanje zapisa (Delete)

public async Task<IActionResult> Delete(int? id)
{
    var item = await _context.Items.FindAsync(id);
    if (item != null)
    {
        _context.Items.Remove(item);
        await _context.SaveChangesAsync();
    }
    return RedirectToAction(nameof(Index));
}

Objašnjenje i dodatne napomene

Svaka operacija je vezana za odgovarajuću akciju u kontroleru, gde Item predstavlja entitet sa podacima u bazi. Primeri bi mogli uključiti dodatna objašnjenja i preporuke za validaciju podataka pre nego što se operacija izvrši, kao i načine za rukovanje greškama, čime bi korisnici imali jasnije smernice za implementaciju CRUD funkcionalnosti u svojim aplikacijama.

Napredne teme: Autentifikacija i autorizacija

Uvod: Autentifikacija i autorizacija su ključni aspekti moderne web aplikacije, posebno u sistemima sa osjetljivim podacima i različitim korisničkim ulogama. Ova sekcija pruža osnovne korake za implementaciju sigurnosti u ASP.NET Core aplikacijama.
Sadržaj:

• Autentifikacija: Primenom ASP.NET Core Identity sistema, korisnici mogu da se prijave koristeći naloge sa lozinkama, ili putem eksternih servisa poput Google-a i Microsoft-a.
• Autorizacija: Objašnjenje razlika između uloga (Roles) i prava pristupa (Claims), kao i primera za prilagođene politike autorizacije.
• JSON Web Token (JWT): JWT se često koristi u aplikacijama zasnovanim na RESTful API-ima. Uključite primer generisanja i verifikacije JWT-a za API klijente.

Resursi za učenje

Uvod: Da bi se proširilo znanje o ASP.NET Core razvoju, preporučuje se pregled dodatnih resursa koji nude detaljnija objašnjenja i praktične smernice.
Sadržaj:

• Dokumentacija: Započnite sa Microsoft ASP.NET Core dokumentacijom, koja pruža sveobuhvatan pregled funkcionalnosti.
• Online kursevi: Platforme kao što su Pluralsight, Udemy, i Microsoft Learn nude kurseve sa fokusom na ASP.NET Core i praktičnu primenu.
• Knjige: Preporučuje se „ASP.NET Core in Action“ (Andrew Lock) za one koji traže detaljan i praktičan priručnik o razvoju u ASP.NET Core okruženju.

---

Prethodno
​|< Internet stvari

Sledeće
​ Kreiranje web aplikacija 2 >|