how to internet: the magic words
TRANSCRIPT
![Page 1: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/1.jpg)
How To InternetKnowing The Magic Words
University of Denver, Emergent Digital PracticeFebruary 17, 2016
1 How to Internet / David Newbury / @workergnome
![Page 2: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/2.jpg)
Why should you listen to me?
2 How to Internet / David Newbury / @workergnome
![Page 3: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/3.jpg)
Why should you not listen to me?• I have opinions.
• I may be wrong.
• I will leave stuff out.
• I may lie.
3 How to Internet / David Newbury / @workergnome
![Page 4: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/4.jpg)
Tools.4 How to Internet / David Newbury / @workergnome
![Page 5: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/5.jpg)
Text Editors• Sublime Text• Atom • Not Textmate• Not Notepad
5 How to Internet / David Newbury / @workergnome
![Page 6: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/6.jpg)
Version Control• Git• Github• Bitbucket
6 How to Internet / David Newbury / @workergnome
![Page 7: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/7.jpg)
Browser Development Tools
7 How to Internet / David Newbury / @workergnome
![Page 9: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/9.jpg)
Stack Overflow.
9 How to Internet / David Newbury / @workergnome
![Page 10: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/10.jpg)
Are you full-stack?
10 How to Internet / David Newbury / @workergnome
![Page 11: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/11.jpg)
The stack keeps expanding.1996
• HTML
11 How to Internet / David Newbury / @workergnome
![Page 12: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/12.jpg)
The stack keeps expanding.2000
• Design• Front-end• Back-end
12 How to Internet / David Newbury / @workergnome
![Page 13: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/13.jpg)
The stack keeps expanding.2010
• UX• UI• Content Strategy• DevOps• Database Admin• APIs13 How to Internet / David Newbury / @workergnome
![Page 14: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/14.jpg)
The stack keeps expanding.2016
• Microservices• Mobile Strategy• Responsive Design• Growth Hacking• Frozen Yogurt
14 How to Internet / David Newbury / @workergnome
![Page 15: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/15.jpg)
Concepts you will hear about• Agile• Extreme Programming
15 How to Internet / David Newbury / @workergnome
![Page 16: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/16.jpg)
Other Useful Tools• Postman• JSFiddle• CodePen• Gist• Github• Google
16 How to Internet / David Newbury / @workergnome
![Page 17: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/17.jpg)
Clients,Servers,Networks.17 How to Internet / David Newbury / @workergnome
![Page 18: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/18.jpg)
NETWORKS
18 How to Internet / David Newbury / @workergnome
![Page 19: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/19.jpg)
Protocols
• TCP/IP• UDP• Websockets
• HTTP• HTTPS
!
19 How to Internet / David Newbury / @workergnome
![Page 20: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/20.jpg)
http://www.workergnome.com/banana.htmlThis is a web address.
20 How to Internet / David Newbury / @workergnome
![Page 21: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/21.jpg)
http://www.workergnome.com/banana.html The protocolThis is the part of the address that says what network protocol we'd like to use to communicate.
21 How to Internet / David Newbury / @workergnome
![Page 22: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/22.jpg)
http://www.workergnome.com/banana.htmlThe DomainThis is the part that tells the network which computer we'd like to talk to.
22 How to Internet / David Newbury / @workergnome
![Page 23: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/23.jpg)
http://www.workergnome.com/banana.htmlThe DomainThe first (or last) part is the Top Level Domain, and they are controlled by large companies or governments. You can't get one of these.
23 How to Internet / David Newbury / @workergnome
![Page 24: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/24.jpg)
http://www.workergnome.com/banana.htmlThe DomainThe next-to-last part is the network. This is what you own, or what you buy.
24 How to Internet / David Newbury / @workergnome
![Page 25: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/25.jpg)
http://www.workergnome.com/banana.htmlThe DomainThe last (or first) part is the computer on the network.
25 How to Internet / David Newbury / @workergnome
![Page 26: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/26.jpg)
DNS,Nameservers,Registrars,Certificate Authorities26 How to Internet / David Newbury / @workergnome
![Page 27: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/27.jpg)
http://localhost/banana.htmlhttp://10.0.0.1/banana.htmlThese are special addresses, and they mean "The computer I'm using".
27 How to Internet / David Newbury / @workergnome
![Page 28: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/28.jpg)
http://www.workergnome.com:80/banana.html The portThis is the port on that computer that we'd like to talk to.
(by default, HTTP is on port 80.)
28 How to Internet / David Newbury / @workergnome
![Page 29: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/29.jpg)
http://www.workergnome.com:80/banana.htmlHelpful Hint:
It's important to remember that only 1 program can listen to a given port at a time. Which means that if you have a Rails server running on 8000, and you try to start up another copy of it, it will tell you that it can't access the port, and will usually shut down or crash.
29 How to Internet / David Newbury / @workergnome
![Page 30: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/30.jpg)
http://www.workergnome.com/banana.html The PathThis is the specific page that we'd like on that server.
30 How to Internet / David Newbury / @workergnome
![Page 31: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/31.jpg)
http://www.workergnome.com/banana.html?robots=cool&fish=not%20cool
The ParametersThese are variables for the page sent from the client to the server.
31 How to Internet / David Newbury / @workergnome
![Page 32: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/32.jpg)
http://www.workergnome.com/banana.html#bottom_half
The Anchor (or Hash)This is the specific section of the page.
32 How to Internet / David Newbury / @workergnome
![Page 33: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/33.jpg)
HTTP Request Types• GET• POST• PUT• DELETE
33 How to Internet / David Newbury / @workergnome
![Page 34: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/34.jpg)
REST - CRUD• POST - CREATE• GET - READ• PUT - UPDATE• DELETE - DELETE
34 How to Internet / David Newbury / @workergnome
![Page 35: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/35.jpg)
HTTP Codes• 100s: Informational.• 200s: Success• 300s: Redirection• 400s: Client Error• 500s: Server Error
35 How to Internet / David Newbury / @workergnome
![Page 36: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/36.jpg)
Common HTTP Codes• 301: Redirect.• 200: OK. - Means it worked.• 204 No Content - OK, but you're not gonna see anything• 400: Bad Request - I can't do that• 403: Forbidden - You can't do that• 404: Bad Request - I can't find that• 418: I'm a teapot36 How to Internet / David Newbury / @workergnome
![Page 37: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/37.jpg)
Headers.
37 How to Internet / David Newbury / @workergnome
![Page 38: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/38.jpg)
Cookies.
!
38 How to Internet / David Newbury / @workergnome
![Page 39: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/39.jpg)
CLIENTS39 How to Internet / David Newbury / @workergnome
![Page 40: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/40.jpg)
Web Browsers• Internet Explorer• Chrome • Firefox• Safari
40 How to Internet / David Newbury / @workergnome
![Page 41: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/41.jpg)
CLIENT SIDE TECHNOLOGYHTML, CSS, JAVASCRIPT
41 How to Internet / David Newbury / @workergnome
![Page 42: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/42.jpg)
HTML
<h1 class="example_header"> Example</h1> <p> This is html. <span class='exciting_text'> Exciting, isn't it? </span> </p>
42 How to Internet / David Newbury / @workergnome
![Page 43: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/43.jpg)
CSS
h1 { font-size: 200%; color: #ff0000;}.exciting_text { text-decoration: underline; }
43 How to Internet / David Newbury / @workergnome
![Page 44: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/44.jpg)
JAVASCRIPT
var timeout;function beAnnoying() { timeout = window.setTimeout(annoyMe,3000);}function annoyMe() { alert("HONK!"); beAnnoying();}beAnnoying();
44 How to Internet / David Newbury / @workergnome
![Page 45: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/45.jpg)
Important Javascript libraries
jQuery
Makes working with the DOM easy.Makes working with AJAX easy.Hides browser inconsistencies.
45 How to Internet / David Newbury / @workergnome
![Page 46: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/46.jpg)
Important Javascript libraries
Underscore/Lodash
A swiss army knife of useful functions. Written in a functional styleThey're conveniences, not requirements, but they're helpfulLodash is updated more regularly, but they're basically the same.
46 How to Internet / David Newbury / @workergnome
![Page 47: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/47.jpg)
Important Javascript libraries
Modernizr
A polyfill/feature detection library
47 How to Internet / David Newbury / @workergnome
![Page 48: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/48.jpg)
JSON{ "name" : "David Newbury", "height_in_inches": 76, "occupation": ["nerd","artist","teacher"], "favorites": { "food": "pecan pie", "drink": "coffee", "movie": "The little Mermaid" }}
48 How to Internet / David Newbury / @workergnome
![Page 49: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/49.jpg)
AJAX
49 How to Internet / David Newbury / @workergnome
![Page 50: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/50.jpg)
Websockets
50 How to Internet / David Newbury / @workergnome
![Page 51: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/51.jpg)
SERVERS1. Serve Content2. Store Information3. Make Decisions
51 How to Internet / David Newbury / @workergnome
![Page 52: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/52.jpg)
The Backend Stack• Operating System• Web Server• Database• Programming Language
52 How to Internet / David Newbury / @workergnome
![Page 53: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/53.jpg)
For Example: The LAMP Stack• Operating System - Linux• Web Server - Apache• Database - Mysql• Programming Language - PHP
53 How to Internet / David Newbury / @workergnome
![Page 54: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/54.jpg)
1. The Operating System
Use a UNIX.(OS X is UNIX. Linux is Unix. Windows is NOT Unix.)
54 How to Internet / David Newbury / @workergnome
![Page 55: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/55.jpg)
Local Servers.(You're gonna need one.)
55 How to Internet / David Newbury / @workergnome
![Page 56: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/56.jpg)
The Command Line.(You're gonna need to use it.)
56 How to Internet / David Newbury / @workergnome
![Page 57: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/57.jpg)
Cheating.(cheating is encouraged.)
• Wordpress• Squarespace• Tumblr
57 How to Internet / David Newbury / @workergnome
![Page 58: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/58.jpg)
2. The Web ServerWhere and how are you going to run your code?
58 How to Internet / David Newbury / @workergnome
![Page 59: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/59.jpg)
2. The Web ServerWhere and how are you going to run your code?
☁59 How to Internet / David Newbury / @workergnome
![Page 60: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/60.jpg)
Static Hosting• Github Pages• Netlify
60 How to Internet / David Newbury / @workergnome
![Page 61: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/61.jpg)
Google FirebaseHalfway between a static site and a dynamic site,often used for prototyping.
61 How to Internet / David Newbury / @workergnome
![Page 62: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/62.jpg)
AWS(Amazon Web Services)
• S3• Elastic Compute• Many others
62 How to Internet / David Newbury / @workergnome
![Page 63: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/63.jpg)
PaaS(Platform as as Service.)
• Heroku
63 How to Internet / David Newbury / @workergnome
![Page 64: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/64.jpg)
VPS(Virtual Private Servers)
• Digital Ocean
64 How to Internet / David Newbury / @workergnome
![Page 65: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/65.jpg)
Running it yourself.• Don't do this.
65 How to Internet / David Newbury / @workergnome
![Page 66: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/66.jpg)
Apache.
66 How to Internet / David Newbury / @workergnome
![Page 67: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/67.jpg)
3. Storing InformationWhere do you store information on the server?
67 How to Internet / David Newbury / @workergnome
![Page 68: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/68.jpg)
YAGNI.(a brief digression)
68 How to Internet / David Newbury / @workergnome
![Page 69: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/69.jpg)
YAGNI.(a brief digression)
You Ain't Gonna Need It.
69 How to Internet / David Newbury / @workergnome
![Page 70: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/70.jpg)
Relational Databases (SQL)This is the classic way to store information.
• Sqlite• Postgresql• Mysql/MariaDB
70 How to Internet / David Newbury / @workergnome
![Page 71: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/71.jpg)
Key/Value StoresThe Simple, Fast Option.
• Redis• Mongo• Memcached ( not really, though sort of.)• Many others
71 How to Internet / David Newbury / @workergnome
![Page 72: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/72.jpg)
Search EnginesWhen you need something, but you're not sure what.
• Elasticsearch• Solr• Lucene
72 How to Internet / David Newbury / @workergnome
![Page 73: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/73.jpg)
Cloud DatastoresSomewhere, over the rainbow...
• AWS one• Google one
73 How to Internet / David Newbury / @workergnome
![Page 74: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/74.jpg)
Esoteric DatabasesThere are uses for these, but they're likely not for you.
• Neo4J• Hadoop• Cassandra• Many, Many more
74 How to Internet / David Newbury / @workergnome
![Page 75: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/75.jpg)
Running a DatabaseIt has to live somewhere, and it's likely to cost money.
• Remember to back it up.• Security matters.• Changing it can be hard.• Look for good libraries.
75 How to Internet / David Newbury / @workergnome
![Page 76: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/76.jpg)
4. Backend LanguagesThis is the part where you write code.
• PHP• Ruby• Python• Javascript
76 How to Internet / David Newbury / @workergnome
![Page 77: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/77.jpg)
Things you should know about(if you're interested in getting a job)
• Java• .NET
77 How to Internet / David Newbury / @workergnome
![Page 78: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/78.jpg)
Things you may hear about(but no longer need to worry about)
• Perl• Lisp
78 How to Internet / David Newbury / @workergnome
![Page 79: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/79.jpg)
Things you may hear about(but don't need to worry about yet)
• Clojure• Haskell• Elixir• Erlang• Go
79 How to Internet / David Newbury / @workergnome
![Page 80: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/80.jpg)
How to Choose?• What do you know?• What are you trying to do?• Libraries & Frameworks
80 How to Internet / David Newbury / @workergnome
![Page 81: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/81.jpg)
RubyPros
• Friendly community• Very website focused• Good at strings and languages
81 How to Internet / David Newbury / @workergnome
![Page 82: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/82.jpg)
RubyCons
• Not as fast• Poor at evented models
82 How to Internet / David Newbury / @workergnome
![Page 83: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/83.jpg)
RubyMain Frameworks
• Ruby on Rails - Major Framework• Sinatra - Microframework• Middleman//Jekyll - Static Site Generators
83 How to Internet / David Newbury / @workergnome
![Page 84: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/84.jpg)
RubyImportant Things to Know
• Gem - Package Manager• Bundler - Dependency Management• RVM / rbenv - Version Management
84 How to Internet / David Newbury / @workergnome
![Page 85: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/85.jpg)
PythonPros
• Academic community• Very math/science focused• Good at math, images, and hardware
85 How to Internet / David Newbury / @workergnome
![Page 86: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/86.jpg)
PythonCons
• Python 2 / Python 3 compatibility issues• Significant Whitespace. (really?)
86 How to Internet / David Newbury / @workergnome
![Page 87: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/87.jpg)
PythonMain Frameworks
• Django - Major Framework• Flask/Bottle - Microframeworks• Pelican - Static Site Generator
87 How to Internet / David Newbury / @workergnome
![Page 88: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/88.jpg)
PythonImportant Things to Know
• PyPI / pip - Package Managment• setup.py / requirements.txt - Dependency Management• Virtualenv - Version Management
88 How to Internet / David Newbury / @workergnome
![Page 89: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/89.jpg)
PHPPros
• Runs everywhere• Incredibly simple• Very Flexible
89 How to Internet / David Newbury / @workergnome
![Page 90: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/90.jpg)
PHPCons
• Built by aggregation• Lots of magic• Inconsistent
90 How to Internet / David Newbury / @workergnome
![Page 91: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/91.jpg)
PHPMain Frameworks
• Wordpress• Drupal• Symfony/Silex• Laravel/Lumen
91 How to Internet / David Newbury / @workergnome
![Page 92: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/92.jpg)
PHPImportant Things to Know
• Composer / Packagist - Dependency Management
92 How to Internet / David Newbury / @workergnome
![Page 93: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/93.jpg)
Javascript (Node)Pros
• Frontend / Backend compatible• Currently the most hipster• Very good at asynchronous behaviour
93 How to Internet / David Newbury / @workergnome
![Page 94: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/94.jpg)
Javascript (Node)Cons
• Incredibly fragmented environment• Asynchronous behaviour
94 How to Internet / David Newbury / @workergnome
![Page 95: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/95.jpg)
Javascript (Node)Main Frameworks
• Express - Microframework• Meteor? - Major Framework• Ember/Angular/React - Isomorphic Frameworks?
95 How to Internet / David Newbury / @workergnome
![Page 96: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/96.jpg)
Javascript (Node)Important Things to Know
• NPM - Dependency Manager
96 How to Internet / David Newbury / @workergnome
![Page 97: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/97.jpg)
The Fundamental tradeoff of web programming:
Balancing the amount of developer work with the complexity of the project.
97 How to Internet / David Newbury / @workergnome
![Page 98: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/98.jpg)
HTML-only sitesThese are still perfectly acceptable in 2016.
• Github Pages• AWS S3 Static Sites
98 How to Internet / David Newbury / @workergnome
![Page 99: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/99.jpg)
Markdown## This is a header
This is a paragaph of text. It can have multiple lines.
* List item 1* List Item 2
99 How to Internet / David Newbury / @workergnome
![Page 100: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/100.jpg)
Markdown as Content• Stack Overflow• Github• Jekyll for Github Pages
100 How to Internet / David Newbury / @workergnome
![Page 101: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/101.jpg)
CSS Frameworks• Bootstrap• Foundation
101 How to Internet / David Newbury / @workergnome
![Page 102: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/102.jpg)
CSS Pre-processors• Sass• Less• Stylus
102 How to Internet / David Newbury / @workergnome
![Page 103: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/103.jpg)
h1 { color: #990000;}h1 .header { color: #ff0000;}
VS.$HEADER_COLOR: #990000h1 color: $HEADER_COLOR .header color: lighten($HEADER_COLOR,30)
103 How to Internet / David Newbury / @workergnome
![Page 104: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/104.jpg)
HTML Pre-processors• Haml• Jade• ERB• Jinja2• Many, many more
104 How to Internet / David Newbury / @workergnome
![Page 105: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/105.jpg)
Javascript Pre-processors• Coffeescript• LiveScript• TypeScript• Clojurescript• EMCASCRIPT 6
105 How to Internet / David Newbury / @workergnome
![Page 106: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/106.jpg)
Task Runners• Make• Grunt• Gulp• Browserify• Webpack
106 How to Internet / David Newbury / @workergnome
![Page 107: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/107.jpg)
Server JS vs Browser JS• AMD• CommonJS• UMD• ES6 • Browserify
107 How to Internet / David Newbury / @workergnome
![Page 108: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/108.jpg)
Dynamic SitesThis is the 'Standard Website'. Forms, logins, a server running code in the background.
108 How to Internet / David Newbury / @workergnome
![Page 109: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/109.jpg)
Static SitesThis is a compromise between the power of dynamic websitesand the simplicity of HTML only websites.
109 How to Internet / David Newbury / @workergnome
![Page 110: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/110.jpg)
WebappsThese are applications running on the web. Think GMail.
110 How to Internet / David Newbury / @workergnome
![Page 111: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/111.jpg)
Webapp Frameworks• React• Ember• Angular• Meteor
111 How to Internet / David Newbury / @workergnome
![Page 112: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/112.jpg)
Art on the Web• WebGL• Canvas• HTML
112 How to Internet / David Newbury / @workergnome
![Page 113: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/113.jpg)
Art on the Web: Libraries• p5.js - Processing on the Web• d3.js - Data visualization • threeJS - 3D on the web• Highcharts - Graphing for the Web• Shadertoy - Just really cool
113 How to Internet / David Newbury / @workergnome
![Page 114: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/114.jpg)
Are you exhausted yet?I am.
114 How to Internet / David Newbury / @workergnome
![Page 115: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/115.jpg)
if you want a blog:• Wordpress.org
115 How to Internet / David Newbury / @workergnome
![Page 116: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/116.jpg)
If you want to build a simple site:• Bootstrap• jQuery• Markdown• Github Pages
116 How to Internet / David Newbury / @workergnome
![Page 117: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/117.jpg)
If you want to build a static site:• Bootstrap + SASS• jQuery• JSON• ERB• Markdown• Middleman• Netlify117 How to Internet / David Newbury / @workergnome
![Page 118: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/118.jpg)
If you want to build a simple form-driven site:• Bootstrap + SASS• jQuery• ERB• Middleman• Firebase
118 How to Internet / David Newbury / @workergnome
![Page 119: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/119.jpg)
If you want to build a custom dynamic site:• Bootstrap + SASS• jQuery • ERB• Redis• Sinatra• Heroku
119 How to Internet / David Newbury / @workergnome
![Page 120: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/120.jpg)
If you want to build a webapp:• Ember or React, depending on your scale
120 How to Internet / David Newbury / @workergnome
![Page 121: How To Internet: The Magic Words](https://reader036.vdocuments.us/reader036/viewer/2022062316/58aca9611a28ab68608b45b3/html5/thumbnails/121.jpg)
Questions?How to Internet: The Magic WordsUniversity of Denver, Emergent Digital PracticeFebruary 17, 2016
David Newbury@workergnome
121 How to Internet / David Newbury / @workergnome