Uvodno predavanje z osnovnimi koncepti spleta in spletnega programiranja za delavnico Rails Girls Ljubljana. Več o predavanju: http://ialja.blogspot.com/2012/12/explaining-web-and-web-programming-with.html

1. Uvod v internet in
programiranje
Enostavno, kratko in prijazno

2. 3 osnovna vprašanja
Kaj so in kako delujejo spletne aplikacije?
Kaj je Ruby in kako je povezan z Railsi?
Kaj so Railsi in kaj z njimi početi?

3. Kako deluje internet?
• Poglejmo si na primeru:
- Kaj se zgodi, ko v spletni brskalnik
vpišem railsgirls.com?

4. 1) Spletni brskalnik preko DNS poišče
IP naslov spletne strani
(109.74.202.152)
Hočem vedeti
Čakaj, da najdem
več o Rails Girls
naslov strežnika, ki ti
lahko to pove.
Avtor fotografije: Ed Yourdon

5. 2) Brskalnik strežniku pošlje zahtevo “GET”
Hej, potrebujem
informacije o Trenutek ...
Rails Girls!
HTTP zahteva GET
Host: railsgirls.com
j
tvoj računalnik
j
strežnik, ki gosti
railsgirls.com

6. 3) Strežnik brskalniku odgovori
s spletno stranjo, napisano v jeziku HTML
Aha! Našel!
odgovor v
jeziku HTML
j
Čaki, da vidim, kaj
tvoj računalnik
j
si mi to poslal ... strežnik, ki gosti
railsgirls.com

7. 4) Brskalnik poskrbi
za ustrezen prikaz spletne strani
Ta-da!
A ni fajn stran?

8. Torej, kaj bomo
danes naredili?
j
Spletno aplikacijo
za zbiranje idej

9. Kako bo spletna aplikacija
izgledala v brskalniku?

10. Hmm... kaj sploh so
spletne aplikacije?
In kaj spletne strani?

11. simplsushi.com
Hočem sushi!
j
j
spletna stran
Octocat sushi.html
Avtorica fotografije: melanie_hughes

12. sushi.html
je tak, kot je!
simplsushi.com
Ampak ...
ne jem rib ...
j
j
statična
sushi.html spletna stran
Octocat

13. Kaj pa tu? fensisushi.com
Lahko dobim
sushi brez rib?
j
Octocat

14. spletna aplikacija
na strežniku
j
Kaj pa tu? fensisushi.com
Lahko dobim
sushi brez rib?
j Seveda, Octocat,
naš sushi mojster
Octocat
se ti prilagodi!
Avtor fotografije: iwillbehomesoon

15. spletna aplikacija
na strežniku
j
fensisushi.com
j
Octocat j Izvoli sushi po meri,
sushi.html lahko ti takoj
naredimo novega
rezultat je spet
spletna stran

16. spletna aplikacija
na strežniku
j
fensisushi.com
j
Octocat j
sushi.html
vendar je to sedaj
dinamična spletna stran,
ki se prilagodi uporabniku

17. spletna aplikacija
V praksi ... na strežniku
j
facebook.com
j
Octocat
j
zato je Facebook za vsekega
izmed nas drugačen

18. Če torej hočemo
delati spletne aplikacije ...

19. Če torej hočemo
delati spletne aplikacije ...
j
Se moramo znati pogovarjati s
sushi mojstrom na strežniku

20. Ruby je en izmed programskih jezikov, ki
ga lahko uporabimo v aplikacijah
Če hočeš, da kaj
naredim, mi moraš
povedati v Ruby-ju
Drugi priljubljeni jeziki: PHP, Python, Java, ASP.NET, Perl ...

21. Kako se lahko z računalnikom
pogovarjamo v Ruby-ju?
Za začetek:
1) Imeti moramo inštaliran Ruby (Installation Party!)
2) Uporabimo Terminal oz. Command Prompt (Win)

22. Preprost primer
Uporabimo irb = Interactive RuBy
“Rails Girls”

23. irb examples
"Rails Girls" # nizi znakov (strings)
2+2 # števila (integers)
2*2 # Ruby kot preprost kalkulator
"Rails " * 2 # nice lahko pomnožimo š številom
"Rails " + "Girls" # združimo dva niza
"Rails" * "Girls" # množenje dveh nizov ne dela
"Rails Girls".length # imamo pa na voljo posebne metode
"Rails Girls".reverse
ime = "Rails Girls" # za poenostavitev dela shranimo objekte v spremenljivke
ime.length # na spremenljivki uporabimo isto metodo kot prej
ime.reverse
ime.upcase
ime.downcase
ime + ime # združevanje spremenljivk, isto kot prej

24. Preprost primer
Program shranimo v datoteko .rb za lažji dostop
Sublime Text 2 Terminal

25. simpl.rb
puts “Rails Girls”

26. ime.rb
puts "Kako ti je ime?"
ime = gets.chomp!
puts "#{ime}, tvoje ime ima #{ime.length}
znakov."

27. racun.rb
puts "Koliko je 2 + 2?"
rezultat = 2 + 2
odgovor = gets.to_i
if odgovor == rezultat
puts "Bravo!"
else
puts "Hmm... Jaz dobim #{rezultat}"
end

28. Tudi velik, strašen zmaj je sestavljen
iz preprostih Lego kock!
Avtor fotografije: themickeyd

29. Bonus namig: za lažje
učenje doma obišči
http://tryruby.org
http://www.codeschool.com
http://www.codecademy.com

30. Kaj pa Rails?
Rails = Ruby on Rails = RoR = “Ruby na tračnicah” :)
= ogrodje (framework), ki poskrbi, da Ruby enostavno
uporabimo za izdelavo spletnih aplikacij
= hitre tračnice za Ruby na internetu

31. Današnjo aplikacijo
bomo izdelali z Railsi ...

32. ... sestavljajo jo različne tekstovne
datoteke z Ruby, HTML in ostalo kodo

33. Rails* aplikacije imajo v
osnovi tri dele
MVC arhitektura = Model | View | Controller
Controller = sushi šef
sprejema zahteve, povezuje vse
dele v delujočo celoto
Model = sestavine
predstavlja podatke iz baze View = sushi
predstavitev rezultata, ki ga
* Pa tudi veliko ostalih spletnih aplikacijah v drugih jezikih vidimo uporabniki
Avtor fotografije: Michael Kappel

34. Nič jasno? Nič panike :)
Pri programiranju je:
• Googlanje zaželjeno;
• copy-paste ok;
• važno, da dela.
P.S.: Vaja dela mojstrico!

35. Ogrevanje pred izdelavo aplikacije:
spoznajmo spletne tehnologije!
My Bentobox Application: Designed by:
Storage Logic
Backend. Backend.
How the application stores data. How the application works.
Style and structure
Frontend.
How the application looks.
Infrastructure
Backend.
How the application runs.