Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

The web and programming: an introduction - Simple, short and friendly


Published on

An introduction to web and web programming for the Rails Girls Ljubljana workshop.

More about the presentation:

Published in: Technology
  • Be the first to comment

The web and programming: an introduction - Simple, short and friendly

  1. 1. The web and programming:an introduction Simple, short and friendly
  2. 2. 3 basic questionWhat are web apps and how do they work?What is Ruby, how is it connected to Rails?What is Rails and what can we use it for?
  3. 3. How does the web work?• Let’s take a look at an example: - What happens when I type into my web browser?
  4. 4. ( 1) The web browser looks up the IP address of the web site using DNS I want to know more about Wait, I need to find Rails Girls the address of the web server with that info.Avtor fotografije: Ed Yourdon
  5. 5. 2) The broswers sends a “GET” request to the serverHey, I need info Just a momentabout Rails Girls ... HTTP request GET Host: j your computerj host server for
  6. 6. 3) The servers respons with a web page, written in HTML language Aha! Found it! response in HTML language jLet me see what tvoj računalnikjthis looks like... host server for
  7. 7. 4) The web browser makes sure the web site is displayed correctly Ta-da! Isn’t this a nice web site?
  8. 8. So, what are wegoing to work on today? j A web app for collecting ideas
  9. 9. What will the app look like in our browser?
  10. 10. Hmm... what are web apps? And what are web pages?
  11. 11. I want sushi! j j web page Octocat sushi.htmlPhoto by: melanie_hughes
  12. 12. sushi.html is as it is! But ... I don’t eat fish ... jj static sushi.html web pageOctocat
  13. 13. What about here? Can I get a sushi without fish?jOctocat
  14. 14. web app on the server What about j here? Can I get a sushi without fish? j Sure, Octocat, our sushi chef Octocat can adjust!Photo by: iwillbehomesoon
  15. 15. web app on the server j fancysushi.comj Here’s yourOctocat j personalized sushi. sushi.html Would you like a different one? the result is another web page
  16. 16. web app on the server j fancysushi.comjOctocat j sushi.html however it is now a dynamic web page, tailored to the user
  17. 17. web app In the real world ... on the server j j Octocat j that’s why Facebook hasdifferent content for each of us
  18. 18. If we want tobuild web apps ...
  19. 19. If we want tobuild web apps ... j We need to be able to talk to the sushi chef on the server
  20. 20. Ruby is one of the programminglanguages that we can use in web apps If you want me to do something, you’ve got to speak Ruby! Other popular languages: PHP, Python, Java, ASP.NET, Perl ...
  21. 21. How we can use Ruby to talk to a computer?As a starting point:1) We need to have Ruby installed (Installation Party!)2) Use Terminal or Command Prompt (Windows)
  22. 22. Simple exampleLet’s use irb = Interactive RuBy “Rails Girls”
  23. 23. irb examples"Rails Girls" # strings2+2 # integers2*2 # Ruby as a simple calculator"Rails " * 2 # multiplying a string"Rails " + "Girls" # combining two string"Rails" * "Girls" # multiplying strings doesn’t work"Rails Girls".length # but string do have their own useful methods"Rails Girls".reverseime = "Rails Girls" # to simplify work, we can store objects into variablesime.length # same method as before used on a variable, same resultime.reverseime.upcaseime.downcaseime + ime # variables can also be combined, just like before
  24. 24. Simple exampleLet’s save a program into a .rb file for easy access Sublime Text 2 Terminal
  25. 25. simple.rbputs “Rails Girls”
  26. 26. ime.rb
  27. 27. quiz.rb
  28. 28. Even the big, scary dragon is made out of simple Lego blocks!Photo by: themickeyd
  29. 29. Bonus tip: learn programming at home with: http://tryruby.org
  30. 30. What about Rails? Rails = Ruby on Rails = RoR= a framework, which makes sure we can easily use Ruby to build web apps = fast rails for Ruby on the web
  31. 31. We’ll build today’s app with Rails ...
  32. 32. ... the app will be made with different text files with Ruby, HTML and other code
  33. 33. Rails* apps have three basic building blocks MVC architecture = Model | View | Controller Controller = sushi chef accepts requests, makes all parts work as a whole Model = ingredients represents database data View = sushi the representation of the result,* And a lot of other web apps in different languages seen by usersPhoto by: Michael Kappel
  34. 34. Confused? No worries :) When programming: • Googling is a must; • copy-paste a valid method; • getting a working result is what really matters. P.S.: Practice makes perfect!
  35. 35. Let’s warm up before we make our own app: getting to know web technologies! 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.