search

max-mapper / javascript-for-cats

an introduction to the javascript programming language. intended audience: cats
jsforcats.com
787 stars 142 forks source link

pull from twitter/instagram #10

Open samccone opened 12 years ago

samccone commented 12 years ago

not sure if this would be too advanced fot the site but we could pull json down from twitter to show cat pictures... or we could pull from instagram to show cat pictures via their api's

max-mapper commented 12 years ago

for the 'fetch data from another page' section this is what i was thinking of actually! instagram doesnt have a public API (you have to oauth in first) but I have about ~75 photos of cats that i've taken over the last year (i am @catmapper on instagram) that we can use as an example dataset

max-mapper commented 12 years ago

twitter has a public search that you can do from client side js, might be hard to get cat photos out of it though

qcom commented 11 years ago

I'd enjoy writing this section, but wouldn't it be too advanced for the audience? We'd have to either explain or gloss over apis, ajax, and callbacks. And in the effort to avoid headaches, it'd make sense to use jQuery or another library for the ajax requests.

max-mapper commented 11 years ago

@qcom agreed. I think something with a bit more substance would be nice to add because sense of accomplishment is a pretty powerful teaching tool. the trick is black boxing the components correctly. and teaching fundamentals in a way that is accessible. so many tradeoffs in this territory!

I think the jQuery ajax API is pretty bad and would like to stay away from DSLs. My favorite JS HTTP API is https://npmjs.org/package/request and there is a nice browser version here https://github.com/iriscouch/request

An article called 'HTTP For Cats' would almost make more sense. I think once the reader has a somewhat solid understanding of functions and callbacks then adding a network request magically inside the function won't be too foreign a concept.

getTweets('@maxogden', displayTweets)

Now that I'm thinking about it a section on callbacks that uses a real world example of fetching data from some API like Flickr/Twitter/Instagram would be a great way to show how async functions work. Things like 'hey this request can happen in the background and the rest of the page is still interactive' and 'my code doesnt happen in top-to-bottom order but instead based on events that happen and functions that get executed when those events happen' are super super super important to understanding JS.