A simple introduction to web apps for Rails Girls Bristol, 2013.
If you want to use these slides for anything else then let me know; the original is a Google Presentation and I'm happy to provide you with a copy to adapt as you choose.
requests for web pages • It then turns the data returned into what you see • The main browsers are: ◦ Apple Safari ◦ Google Chrome ◦ Microsoft Internet Explorer ◦ Mozilla Firefox ◦ Opera
programming language • A structure for data which web browsers understand • The browser turns HTML into what you see on the page • Tells the browser how the page is structured
an end, and has a name relevant to its content: <title>Rails Girls Bristol is Super Awesome</title> This tells the web browser that the text between those two tags is the title for the current page.
have some special abilities. Here's how you embed an image in the page: <img src="http://i.imgur.com/rWVl4dc.gif"> The 'src' attribute tells the browser where to find the image to embed in the page. Some tags, like <img>, don't need a closing tag.
a programming language • Tells the web browser how the page looks • Targets the tags in your HTML • Allows you to define shapes, positions, colours, fonts etc
If you wanted to target every image on the page, you could do: img { border: 10px solid blue; } You can also target based on classes or IDs. If you had a tag with an ID like: <p id="super-awesome-quote">Wibble</p> You could then target just that element by using its ID with a hash symbol: #super-awesome-quote { font-weight: bold; }
but if you need to specially target multiple items you can use classes. A class is defined in the HTML like this: <p class="blue">Da ba dee da ba di</p> Then if we want to affect every "p" tag with the "blue" class, we can do this: p.blue { color: blue; }
runs in your browser • Lets you add interactivity, among other things, to your site • Used for anything from dropdown menus to automatically updating content to full-fledged games or applications
which provides a service • It might host a website, or emails, or chat networks • The internet is a large network of servers • Networks allow servers to communicate with each other • Rails apps are served via a Web Server
the request for a page, e.g. /about.html 2. Looks for a file called about.html in the site folder 3. Returns the contents of that file as the response Dynamic 1. Receives the request for a page, e.g. /about 2. Passes the request to the application, in our case the Ruby on Rails app 3. Rails figures out what you were looking for and generates the relevant HTML 4. The server returns the HTML as the response
users sign up/in • Customise the website for each user • Automatically update with new content • Process forms • Send emails • Upload files • Other clever things
a way of instructing a machine on what to do • It allows us to manipulate data and control behaviour • There are hundreds, if not thousands, of different programming languages • (Nearly) every language is good for something • Many of them are similar, and learning one will make it easier to learn more However, we're concentrating on one particular language today...
into your own code • Save time by using the code others have already written • Want to upload images? Don't build your own image upload system; install 'carrierwave', 'dragonfly', or 'paperclip'
framework • It's a Ruby Gem • It helps you build complicated web apps • It does a lot of the boring stuff you don't want to have to build every time • It has a set structure to encourage everybody to work in a similar way