Kako postaviti HTML web sajt na Azure


Kako bi našu web stranicu koju smo skinuli u prethodnom koraku okačili na Azure potrebno je da se ulogujemo na Azure nalog preko adrese: https://portal.azure.com/ . Nakon logovanja otvoriće se Azure portal (Slika 1).
 
tutorial04-01-azure

Slika 1: Portal nakon logovanja

 
 
Kako bi kreirali novi web sajt na Azure-u potrebno je da idemo na opciju New sa leve strane a potom da odaberemo Web + Mobile pa zatim Web App (Slika 2)
 
tutorial04-02-azure

Slika 2: Kreiranje Web sajta na Azure portalu

 
 
Nakon klika na Web app u meniju potrebno je upisati ime sajta (u ovom slučaju nasprviwebsajtucloudu) potom odabrati DreamSpark kao subscription i odabrati App Service. App service predstavlja mesto servera na kome će se nalaziti Vaša aplikacija. (Slika 3)
 
tutorial04-03-azure

Slika 3: Podaci o web sajtu

 
 
Nakon popunjene forma pritisnite Create. Potrebno je par minuta da se prostor za Vaš web sajt kreira na Azure portalu pa sacekajte malo. Nakon uspešnog kreiranja prostora za naš web sajt na Azure portal otvoriće se prozor sa pregledom informacija o web sajtu koji ste napravili (Slika 4).
 
tutorial04-04-azure

Slika 4: Podaci o kreiranom prostoru za web sajt

 
 
Kako bi mogli da fajlove koji su skinuti u prethodnom koraku okačimo na naš Azure web prostor i učinimo našu web aplikaciju aktivnom na internetu potrebno je da imamo FTP podatke. FTP (File Transfer Protocol) nam omogućava da prebacimo naše fajlove na server ili na naš web prostor. Prvo je potrebno da uzmemo naš  FTP Hostname koji se nalazi u prvom panelu sa informacijama o aplikaciji. Hostname predstavlja adresu servera na koji postavljamo naš web sajt (Slika 5).
 
tutorial04-05-azure

Slika 5: FTP hostname

 
 
Nakon ovoga potrebno je da kreiramo korisničko ime kao i šfiru da bi dozvolili pristup preko FTP klijenta koji ćemo kasnije skinuti. Ovo možemo uraditi tako što u Settings panelu otvorimo Deprolyment Credentials opciju a potom popunimo polja za korisničko ime i šifru (Slika 6).
 
tutorial04-06-azure

Slika 6: Pravljenje ftp naloga

 
 
Nakon upisivanja podataka potrebno je klinuti dugme Save. Username za FTP biće imewebsajta\username koji ste upisali (u ovom slučaju nasprviwebsajtucloudu\peraperic)
 
Kako bi uspeli da se konektujemo na FTP koji smo dobili potreban nam je FTP klijent. FTP klijent je program koji omogućava da se konektujemo, upravljamo i vršimo izmene nad fajlovima na našem web prostoru.
 
Jedan od FTP klijenta je FileZilla. FileZillu možete preuzeti na adresi:
 
http://sourceforge.net/projects/filezilla/files/FileZilla_Client/3.14.1/FileZilla_3.14.1_win64-setup.exe/download?nowrap
 
Nakon instalacije otvorite FileZilla program.
 
tutorial04-07-azure

Slika 7: FileZilla FTP Klijent

 
 
Nakon pokretanja programa možemo iskoristiti parametre koje smo kreirali na Azure portalu radi konektovanja na server. U Host polje upisujemo Hostname sa Azure Portala bez ftp:// dok u username i password polja upisujemo korisničko ime i šifru koju smo definisali u prethodnom koraku. Nakon upisiavanja parametara potrebno je pritisnuti dugme Quickconnect kako bi se konektovali na server (Slika 8).
 
tutorial04-08-azure

Slika 8: Uspešna konekcija na FTP našeg web prostora

 
 
Kada ste se uspešno logovali na FTP nalog potrebno je da uđemo u direktorijum site/wwwroot u Remote delu FileZilla aplikacije jer se u ovom folderu nalaze fajlovi koji će biti prikazani na web sajtu. (Slika 9)
 
tutorial04-09-azure

Slika 9: wwwroot folder

 
 
Kako bi prebacili fajlove našeg web sajta potrebno je sa leve strane FileZilla programa da uđemo u folder sa fajlovima koje smo u prethodnom koraku skinuli (Slika 10).
 
tutorial04-10-azure

Slika 10: Otvoren folder iz koga fajlove prebacujemo na server

 
 
Nakon ovog koraka potrebno je da selektujemo sve fajlove iz leve strane a potom ih prevučemo u prozor na desnoj strani kako bi bili prebačeni na server (Slika 11)
 
tutorial04-11-azure

Slika 11: Prebačeni fajlovi na web prostor

 
 
Nakon prebacivanja fajlova za web sajt na web prostor možete posetiti Vaš sajt na adresi sa Azure Portala:
 
http://nasprviwebsajtucloudu.azurewebsites.net/