1. Objasnite razlike između HTML-a, CSS-a i JavaScripta u web razvoju
Odgovor: HTML je označni jezik koji se koristi za stvaranje strukture i oblikovanja sadržaja na web stranici.
- CSS je stilski jezik koji se koristi za definiranje izgleda i izgleda web stranice.
- JavaScript je programski jezik koji se koristi za dodavanje interaktivnosti i procesne logike web stranici.
2. Kako izraditi responzivnu web stranicu?
Odgovor: Za izradu responzivne web stranice koristimo medijske upite i CSS tehnike kao što su mjerne jedinice tekućine, mrežni sustavi i flexbox za prilagodbu različitim veličinama zaslona. Također koristimo fleksibilne uzorke dizajna, različite rezolucije slike i prikazujemo/sakrijemo elemente na temelju veličine zaslona.
3. Objasnite koncept u box model CSS-u.
Odgovor: Okvirni model u CSS-u je model koji uključuje osnovne komponente elementa: obrub, marginu, ispunu i sadržaj. Svaka komponenta formira "kutiju" oko sadržaja elementa i definira prostor i poziciju elementa na web stranici.
4. Kako radite s CSS okvirima kao što je Bootstrap?
Odgovor: Za rad s CSS okvirima kao što je Bootstrap, uključujemo CSS i JavaScript datoteke okvira na našu web stranicu. Tada možemo upotrijebiti unaprijed definirane klase i elemente koje pruža okvir za stvaranje sučelja i ubrzanje procesa razvoja.
5. Objasnite kako AJAX radi u slanju i primanju podataka s poslužitelja
Odgovor: AJAX(Asynchronous JavaScript and XML) omogućuje nam slanje asinkronih HTTP zahtjeva s web stranice i primanje odgovora s poslužitelja bez ponovnog učitavanja cijele stranice. Koristimo JavaScriptov XMLHttpRequest objekt ili API za dohvaćanje za izradu zahtjeva i obradu primljenih rezultata putem metoda kao što su GET ili POST.
6. Objasnite korištenje medijskih upita u CSS-u za izradu responzivne web stranice
Odgovor: Medijski upiti u CSS-u omogućuju nam primjenu različitih CSS pravila na temelju uvjeta kao što su veličina zaslona, razlučivost i orijentacija uređaja. Koristimo medijske upite za definiranje uvjeta i odgovarajućih CSS pravila koja će se primijeniti kada se ti uvjeti ispune.
7. Kako optimizirate vrijeme učitavanja stranice i performanse web stranice?
Odgovor: Kako bismo optimizirali vrijeme učitavanja stranice i performanse web stranice, možemo poduzeti nekoliko mjera kao što su:
- Optimizirajte i komprimirajte CSS, JavaScript i slikovne datoteke.
- Koristite tehnike predmemoriranja za privremeno pohranjivanje resursa u pregledniku.
- Smanjite broj HTTP zahtjeva kombiniranjem datoteka i korištenjem slikovnih duhova
- Koristite mrežu za isporuku sadržaja(CDN) za raspodjelu opterećenja web stranice.
- Optimizirajte HTML i CSS strukturu kako biste osigurali učinkovit izvorni kod i optimizaciju za SEO.
8. Kako upravljate događajima u JavaScriptu? Objasnite korištenje addEventListener-a
Odgovor: Za rukovanje događajima u JavaScriptu koristimo metodu addEventListener() da priložimo funkciju rukovatelja događajima HTML elementu. Na primjer:
const button = document.querySelector('#myButton');
button.addEventListener('click', function() {
// Event handling when the button is clicked
});
Metoda addEventListener() omogućuje nam da odredimo naziv događaja(npr. 'klik', 'prelazak mišem') i funkciju rukovatelja događajem koja će se izvršiti kada se događaj dogodi.
9. Kako stvarate efekte pokreta i animacije koristeći CSS i JavaScript?
Odgovor: Za stvaranje efekata kretanja i animacije pomoću CSS-a i JavaScripta, možemo koristiti CSS svojstva kao što su prijelaz, animacija i transformacija za izmjenu vizualnih svojstava elementa. Također možemo koristiti JavaScript za kontrolu svojstava CSS-a i pokretanje efekata animacije na temelju događaja.
10. Objasnite koncept kompatibilnosti s više preglednika i kako riješiti ovaj problem u web razvoju
Odgovor: Kompatibilnost s više preglednika je sposobnost web stranice da dosljedno i pouzdano funkcionira u različitim web preglednicima. Kako bismo riješili ovaj problem, moramo testirati i osigurati da web-mjesto ispravno radi na više preglednika. Također moramo koristiti napredne tehnike web-razvoja, pridržavati se web-standarda i ograničiti upotrebu značajki koje stariji preglednici ne podržavaju široko.
11. Kako stvarate i koristite komponente za višekratnu upotrebu u Frontend razvoju?
Odgovor: Za izradu i korištenje komponenti koje se mogu ponovno koristiti u Frontend razvoju, često koristimo UI biblioteke kao što su React, Vue ili Angular. Gradimo neovisne komponente i zatim ih koristimo u raznim dijelovima korisničkog sučelja. Ovo povećava modularnost i mogućnost ponovne upotrebe koda, olakšavajući učinkovito upravljanje korisničkim sučeljem.
12. Objasnite korištenje semantičkih oznaka u HTML-u i zašto su one važne za SEO
Odgovor: Semantičke oznake u HTML-u, kao što su <header>, <nav>, <section>, <article> i <footer>, koriste se za definiranje značenja i strukture elemenata na web stranici. Čine izvorni kod čitljivijim i razumljivijim te pružaju važne informacije tražilicama. Dobro implementirane semantičke oznake mogu poboljšati mogućnost pretraživanja i rangiranje web stranice u rezultatima pretraživanja.
13. Kako optimizirati SEO na web stranici?
Odgovor: Kako bismo optimizirali SEO na web stranici, možemo poduzeti nekoliko mjera, uključujući:
- Stvaranje uvjerljivih i točnih meta naslova koji uključuju relevantne ključne riječi.
- Izrada atraktivnih meta opisa koji pružaju dobar sažetak sadržaja stranice.
- Korištenje odgovarajućih oznaka naslova(h1, h2, h3) za pružanje jasne strukture sadržaja.
- Optimiziranje slika korištenjem alt atributa i odgovarajućih veličina.
- Stvaranje internih poveznica za povećanje vidljivosti i indeksiranja.
- Dizajniranje URL-ova prilagođenih korisniku i bogatih ključnim riječima.
- Generiranje kvalitetnog i relevantnog sadržaja koji cilja željene ključne riječi.
14. Kako obrađujete i provjeravate podatke unosa korisnika u web obrascima?
Odgovor: Za rukovanje i provjeru valjanosti podataka o unosu korisnika u web obrascima, koristimo tehnike kao što su JavaScript i PHP. Na strani klijenta koristimo JavaScript za provjeru podataka u stvarnom vremenu izravno u pregledniku. Na strani poslužitelja koristimo PHP za obradu i ponovnu provjeru podataka kako bismo osigurali sigurnost i pouzdanost.
15. Objasnite korištenje CSS predprocesora kao što su SASS ili LESS i njihove prednosti u razvoju Frontenda
Odgovor: CSS predprocesori kao što su SASS(Syntactically Awesome Stylesheets) ili LESS(Leaner CSS) jezici su proširenja CSS-a koji pružaju moćne značajke i uslužne programe za pisanje CSS-a. Omogućuju nam upotrebu izraza, varijabli, ugniježđivanja i mixina za stvaranje čitljivijeg, održivijeg i višekratno upotrebljivog CSS-a. Korištenje CSS predprocesora pomaže ubrzati razvoj i učinkovito upravljati CSS-om u velikim Frontend projektima.