Things
you
can
use
  ...provided
by
the
Yahoo
Developer
Network

                                  and
friends.




      ...
Web
development
is

confusing
enough
as
it
is.
There
is
no
need
to
make
it

harder
by
not
using
what
has

been
done
for
us.
Today,
I
am
going
to
show

you
some
things
that
you
can

use
immediately
to
build

faster
and
beIer
web

products.
Quickly
about
me:
hIp://developer‐evangelism.com
hIp://developer.yahoo.com
Quickly
about
me:
Learning
the
basics

10   INPUT A$
20   PRINT A$
30   PRINT “ROCKS!”
40   GOTO 10
WaSP Interact




hIp://interact.webstandards.org/
Opera Web Standards
          curriculum




hIp://www.opera.com/company/educa&on/curriculum/
YDN Theater




hIp://developer.yahoo.net/blogs/theater/
No
more
copy
&
paste
and

trial
and
error.
Star&ng
with
a
clean
canvas.




   hIp://developer.yahoo.com/yui/ar&cles/gbs/
Web
sites
are
not
meant
to

look
and
work
the
same

everywhere.

On
the
contrary
‐
the
ability

to
accustom
the
interface
to

different
user
agents
is
what

makes
web
development
so

power...
CSS
frameworks
and
frontend

libraries




                        (...)
Libraries
make
our
job

predictable
and
allow
us
to

use
web
standards
without

catering
for
browsers.
If
you
build
your
code
based

on
libraries
you
can
fix
your

product
for
the
next
browser

by
upgrading
the
library.
If
you
choose
to
do

everything
yourself
‐
good

luck.

Building
interfaces
that
work
hIp://developer.yahoo.com/ypaIerns
hIp://developer.yahoo.com/ypaIerns/wireframes/
Using
the
web.



            CMS
Thinking
data
first.
The
complexity
of
your

product
increases
with
the

number
of
APIs
you
use.

Every
API
has
different
ways

to
authen&cate,
expects

different
parameters
and

returns
data
in
different

formats.
Mixing
the
web
with
YQL
           1)
Define
your
Query



                    3)
Copy
the
URL.

2)
Select
your
output
Find
London.

select
*
from
geo.places
where

text="london,uk"
Define
London
and
get
photos
taken

there.
select
*
from
flickr.photos.search

where
woe_id
in
(


select
woeid
from
geo.pla...
Get
all
the
informa&on
about
these

photos.
select
*
from
flickr.photos.info

where
photo_id
in
(select
id
from

flickr.phot...
Get
only
what
we
need.

select

farm,
id,
secret,owner.realname,
server,

&tle,urls.url.content

from
flickr.photos.info
wh...
Select
format
JSON,
define
a

callback
and
copy
and
paste
the

URL.
hIp://query.yahooapis.com/v1/public/yql?q=select%20*
%2...
Copy
into
a
script
src
and
write
a

few
lines
of
Dom
Scrip&ng.
PROFIT!




 hIp://isithackday.com/hacks/ajaxexperience/flickrgeophotos.html
Is
this
Yahoo
only?
Any
data
on
the
web
will
do.
                   atom
                   csv
                   feed
   select
*
from   htm...
http://www.dcs.gla.ac.uk/~joy/fun/jokes/TV.html
Any
data
on
the
web
will
do.




  hIp://isithackday.com/hacks/scraping‐with‐yql/
You
can
also
add
your
own

data
by
providing
a
simple

XML
schema
called
an
open

table.


  hIp://developer.yahoo.com/yql...
Moving
JavaScript
to
the

server
side.
YQL
open
tables
can
have

embedded
JS
that
runs
on

the
YQL
server
(with
Rhino)

and
supports
XML
na&vely

with
E4X..

  h...
Flickr
photos
as
ULs

 select
*
from
flickr.photolist
where

 text="me"
and
loca&on="uk"
and

 amount=20
Display
with
JavaScript
Display
with
PHP
Join
us!






hIp://github.com/yql/yql‐tables
Documenta&on





hIp://developer.yahoo.com/yql/
Building
with
blocks.
Build
a
CSS
layout
that
works.




    http://developer.yahoo.com/yui/grids/builder/
Use
already
exis&ng
widgets.


   http://isithackday.com/hacks/cantine/
        index.php?loc=covent+garden




      hIp:...
hIp://isithackday.com/hacks/delhi/
hIp://developer.yahoo.com/yui/
hIp://developer.yahoo.com/yui/docs/
hIp://developer.yahoo.com/yui/examples/
Wanna
get
super
famous?
YAP
is
the
plalorm
hIp://developer.yahoo.com/yap/guide/yap‐overview.html
hIps://developer.apps.yahoo.com/dashboard
hIp://developer.yahoo.com/yap/guide/caja‐ready‐code‐exs.html
Yahoo
Markup
Language




 hIp://developer.yahoo.com/yap/guide/yapdev‐yml.html
YML
Tags
yml:a                 yml:name
yml:ad                yml:profile‐pic
yml:audio             yml:pronoun
yml:form   ...
Building
a
form
in
YML.
  script
to
call   element
to
replace
A
very
simple
API
on
top
of

YQL
hIp://yahoo.com/add?yapid=zKMBH94k
hIp://github.com/yahoo/yos‐social‐php
YUI
in
a
nutshell...
 YUI
 is
 the
 system
 that
 Yahoo
 uses
 to
 build
 its

 web
sites.
It
is
constantly
tested
to
work...
YQL
in
a
nutshell
 YQL
is
a
web
service
that
allows
you
to
mash‐up

 any
data
on
the
web
from
various
sources
with
a

 sim...
YAP
in
a
nutshell
 YAP
 is
 the
 Yahoo
 Applica&on
 Plalorm
 which

 allows
 you
 to
 build
 applica&ons
that
 run
 on
 th...
...
and
I
am
spent!
Christian Heilmann
http://wait-till-i.com
http://developer-evangelism.com
http://twitter.com/codepo8
Things you can use (by the Yahoo Developer Network and friends)
Things you can use (by the Yahoo Developer Network and friends)
Things you can use (by the Yahoo Developer Network and friends)
Things you can use (by the Yahoo Developer Network and friends)
Things you can use (by the Yahoo Developer Network and friends)
Things you can use (by the Yahoo Developer Network and friends)
Things you can use (by the Yahoo Developer Network and friends)
Things you can use (by the Yahoo Developer Network and friends)
Things you can use (by the Yahoo Developer Network and friends)
Things you can use (by the Yahoo Developer Network and friends)
Things you can use (by the Yahoo Developer Network and friends)
Things you can use (by the Yahoo Developer Network and friends)
Things you can use (by the Yahoo Developer Network and friends)
Upcoming SlideShare
Loading in...5
×

Things you can use (by the Yahoo Developer Network and friends)

4,573

Published on

An introduction to the developer offers of Yahoo given as a talk at the Yahoo/Opera developer evening in Oslo, Norway December 2009. And yes, it was cold!

Published in: Education, Technology, Design
5 Comments
10 Likes
Statistics
Notes
  • It's interesting how you explained with images. I’m Ana Mui Stanley, working on my latest site on lyrics, www.lyrics-search.org/ . I enjoy reading the slide.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • I have learned a couple of things from your presentation. Nicely done!

    http://www.riding-mower.org/

    http://www.riding-mower.org/la105-john-deere-lawn-tractor/
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • A long presentation, but worth reading it. Thanks.

    John.
    www.freeringtones.ws/
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • I think it is better you put some picture in there. looks more interesting and inviting

    Regards
    Anisa
    http://phonehut.info
    http://www.jpolls.net
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

  • ltp+e+v wt


    <b>[Comment posted from</b> http://icant.co.uk/sandbox/slideshareshow/slideshareshow.php]
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total Views
4,573
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
116
Comments
5
Likes
10
Embeds 0
No embeds

No notes for slide

Things you can use (by the Yahoo Developer Network and friends)

  1. 1. Things
you
can
use ...provided
by
the
Yahoo
Developer
Network
 and
friends. Chris&an
Heilmann
‐
YDN
Developer
Evening,
Oslo,
Norway

‐
December
2009
  2. 2. Web
development
is
 confusing
enough
as
it
is.
  3. 3. There
is
no
need
to
make
it
 harder
by
not
using
what
has
 been
done
for
us.
  4. 4. Today,
I
am
going
to
show
 you
some
things
that
you
can
 use
immediately
to
build
 faster
and
beIer
web
 products.
  5. 5. Quickly
about
me:
  6. 6. hIp://developer‐evangelism.com
  7. 7. hIp://developer.yahoo.com Quickly
about
me:
  8. 8. Learning
the
basics 10 INPUT A$ 20 PRINT A$ 30 PRINT “ROCKS!” 40 GOTO 10
  9. 9. WaSP Interact hIp://interact.webstandards.org/
  10. 10. Opera Web Standards curriculum hIp://www.opera.com/company/educa&on/curriculum/
  11. 11. YDN Theater hIp://developer.yahoo.net/blogs/theater/
  12. 12. No
more
copy
&
paste
and
 trial
and
error.
  13. 13. Star&ng
with
a
clean
canvas. hIp://developer.yahoo.com/yui/ar&cles/gbs/
  14. 14. Web
sites
are
not
meant
to
 look
and
work
the
same
 everywhere.

  15. 15. On
the
contrary
‐
the
ability
 to
accustom
the
interface
to
 different
user
agents
is
what
 makes
web
development
so
 powerful.
  16. 16. CSS
frameworks
and
frontend
 libraries (...)
  17. 17. Libraries
make
our
job
 predictable
and
allow
us
to
 use
web
standards
without
 catering
for
browsers.
  18. 18. If
you
build
your
code
based
 on
libraries
you
can
fix
your
 product
for
the
next
browser
 by
upgrading
the
library.
  19. 19. If
you
choose
to
do
 everything
yourself
‐
good
 luck.

  20. 20. Building
interfaces
that
work
  21. 21. hIp://developer.yahoo.com/ypaIerns
  22. 22. hIp://developer.yahoo.com/ypaIerns/wireframes/
  23. 23. Using
the
web. CMS
  24. 24. Thinking
data
first.
  25. 25. The
complexity
of
your
 product
increases
with
the
 number
of
APIs
you
use.

  26. 26. Every
API
has
different
ways
 to
authen&cate,
expects
 different
parameters
and
 returns
data
in
different
 formats.
  27. 27. Mixing
the
web
with
YQL 1)
Define
your
Query 3)
Copy
the
URL. 2)
Select
your
output
  28. 28. Find
London. select
*
from
geo.places
where
 text="london,uk"
  29. 29. Define
London
and
get
photos
taken
 there. select
*
from
flickr.photos.search
 where
woe_id
in
( 

select
woeid
from
geo.places 

where
text="london" )
  30. 30. Get
all
the
informa&on
about
these
 photos. select
*
from
flickr.photos.info
 where
photo_id
in
(select
id
from
 flickr.photos.search
where
woe_id
 in
(select
woeid
from
geo.places
 where
text="london"))
  31. 31. Get
only
what
we
need. select

farm,
id,
secret,owner.realname,
server,
 &tle,urls.url.content
 from
flickr.photos.info
where
photo_id
in( select
id
from
flickr.photos.search
where
woe_id
 in
(select
woeid
from
geo.places
where
 text="london"))
  32. 32. Select
format
JSON,
define
a
 callback
and
copy
and
paste
the
 URL. hIp://query.yahooapis.com/v1/public/yql?q=select%20* %20from%20flickr.photos.info%20where%20photo_id %20in%20(select%20id%20from%20flickr.photos.search %20where%20woe_id%20in%20(select%20woeid %20from%20geo.places%20where%20text%3D%22london %22))&format=json&diagnos&cs=false&env=store%3A %2F%2Fdatatables.org %2Falltableswithkeys&callback=flickr
  33. 33. Copy
into
a
script
src
and
write
a
 few
lines
of
Dom
Scrip&ng.
  34. 34. PROFIT! hIp://isithackday.com/hacks/ajaxexperience/flickrgeophotos.html
  35. 35. Is
this
Yahoo
only?
  36. 36. Any
data
on
the
web
will
do. atom csv feed select
*
from html json microformats rss xml
  37. 37. http://www.dcs.gla.ac.uk/~joy/fun/jokes/TV.html
  38. 38. Any
data
on
the
web
will
do. hIp://isithackday.com/hacks/scraping‐with‐yql/
  39. 39. You
can
also
add
your
own
 data
by
providing
a
simple
 XML
schema
called
an
open
 table. hIp://developer.yahoo.com/yql/guide/yql‐opentables‐chapter.html
  40. 40. Moving
JavaScript
to
the
 server
side.
  41. 41. YQL
open
tables
can
have
 embedded
JS
that
runs
on
 the
YQL
server
(with
Rhino)
 and
supports
XML
na&vely
 with
E4X.. hIp://developer.yahoo.com/yql/guide/yql‐execute‐chapter.html
  42. 42. Flickr
photos
as
ULs select
*
from
flickr.photolist
where
 text="me"
and
loca&on="uk"
and
 amount=20
  43. 43. Display
with
JavaScript
  44. 44. Display
with
PHP
  45. 45. Join
us!






hIp://github.com/yql/yql‐tables
  46. 46. Documenta&on





hIp://developer.yahoo.com/yql/
  47. 47. Building
with
blocks.
  48. 48. Build
a
CSS
layout
that
works. http://developer.yahoo.com/yui/grids/builder/
  49. 49. Use
already
exis&ng
widgets. http://isithackday.com/hacks/cantine/ index.php?loc=covent+garden hIp://isithackday.com/hacks/can&ne/
  50. 50. hIp://isithackday.com/hacks/delhi/
  51. 51. hIp://developer.yahoo.com/yui/
  52. 52. hIp://developer.yahoo.com/yui/docs/
  53. 53. hIp://developer.yahoo.com/yui/examples/
  54. 54. Wanna
get
super
famous?
  55. 55. YAP
is
the
plalorm hIp://developer.yahoo.com/yap/guide/yap‐overview.html
  56. 56. hIps://developer.apps.yahoo.com/dashboard
  57. 57. hIp://developer.yahoo.com/yap/guide/caja‐ready‐code‐exs.html
  58. 58. Yahoo
Markup
Language hIp://developer.yahoo.com/yap/guide/yapdev‐yml.html
  59. 59. YML
Tags yml:a yml:name yml:ad yml:profile‐pic yml:audio yml:pronoun yml:form yml:share yml:friend‐selector yml:swf yml:if‐env yml:user‐badge

 yml:message
  60. 60. Building
a
form
in
YML. script
to
call element
to
replace
  61. 61. A
very
simple
API
on
top
of
 YQL
  62. 62. hIp://yahoo.com/add?yapid=zKMBH94k
  63. 63. hIp://github.com/yahoo/yos‐social‐php
  64. 64. YUI
in
a
nutshell... YUI
 is
 the
 system
 that
 Yahoo
 uses
 to
 build
 its
 web
sites.
It
is
constantly
tested
to
work
for
the
 largest
 amount
 of
 users,
 free,
 open
 source
 and
 covers
everything
from
design
paIerns
to
out‐of‐ the‐box
 widgets.
 It
 is
 modular
 and
 you
 can
 use
 only
 what
 you
 need.
 You
 can
 either
 host
 it
 yourself
 or
 get
 it
 from
 a
 network
 of
 distributed
 servers.
  65. 65. YQL
in
a
nutshell YQL
is
a
web
service
that
allows
you
to
mash‐up
 any
data
on
the
web
from
various
sources
with
a
 simple
 SQL‐style
 language.
 You
 can
 filter
 the
 data
 down
 to
 what
 you
 need
 and
 you
 can
 convert
 the
 data
 with
 server‐side
 JavaScript
 before
 returning
 it.
 Data
 providers
 can
 use
 YQL
 to
 publish
 an
 API
on
 the
 web
on
 top
 of
 Yahoo’s
 infrastructure
and
cloud
storage.
  66. 66. YAP
in
a
nutshell YAP
 is
 the
 Yahoo
 Applica&on
 Plalorm
 which
 allows
 you
 to
 build
 applica&ons
that
 run
 on
 the
 Yahoo
homepage
and
soon
other
proper&es.
You
 can
 dive
 into
 Yahoo’s
 social
 graph
 to
 promote
 your
 applica&ons
 and
 you
 can
 create
 highly
 secure
web
apps
as
YAP
uses
Caja
to
ensure
code
 quality. 

  67. 67. ...
and
I
am
spent!
  68. 68. Christian Heilmann http://wait-till-i.com http://developer-evangelism.com http://twitter.com/codepo8
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×