0
BUILDING WEBSITES WITH
BUILDING BLOCKS
Per Åström, Øredev 2010
!"#$%&'(#)*+%)
,"#-.(.#!"
*+%#*+%#*+%#*+%#*+%#*+%#*+%#*+%#
*+%#*+%#*+%#*+%#*+%#*+%#*+%#*+%#
*+%#*+%#*+%#*+%#*+%#*+%#*+%#*+%#
*+%#*+%#*+%#*+%#*+%#*+%...
VOCABULARY
surdeg = sourdough
surdegskartan = sourdough map
http://www.flickr.com/photos/liorshapira/2350847573/
RIDE A BIKE!
WifiSushi
Vandrarhem
Jobb
Annons
Camping
Café
Vintage
Kyrko
Pizza
Bad
Hotell
Restaurang
Surdeg?
•No coding
•Useful
•Learn
DOMAIN NAME !! ! ! ! ! ! 99 KR
APPLICATION, CMS, TOOLS !! 0 KR
HOSTING ! ! ! ! ! ! ! ! ! 0 KR
WEBSITE !DEVELOPMENT!! ! <10...
GEOLOCATION + #SURDEG
Lat Long
ANDTRY
#SYSTEMBOLAGET + GEO
DOMAIN NAME !! ! ! ! ! ! 99 KR
APPLICATION, CMS, TOOLS !! 0 KR
HOSTING ! ! ! ! ! ! ! ! ! 0 KR
STICKERS + STAMPS !! ! ! ! 2...
MARKETING
IT SCALES!
+Lattjolajban.se, Soko.se,
Hockeykanalen.se, >150
blogs and more.
41
THETEAM
PM
ruby/java
parentalleave
CTO
css/js/htm
l
PM
ruby/java
text-tv
text-tv
Features
Maintenance
Features
Maintenance
Time
Cost
Quality
”STANDING ONTHE
SHOULDERS OF GIANTS”
SaaS = Software as a Service
(Disqus, Polldaddy, Lightspun)
PaaS = Platform as a Service
(Heroku,Akamai, Google AppEngine)...
EVOLUTION OF PUBLISHING PLATFORMS
GENERATION #1 - STATIC FILES
• Static html - Editors needed to know html
• No database
•...
EVOLUTION OF PUBLISHING PLATFORMS
GENERATION #2 - HOME GROWN WITH DB
• Database!
• DIY - typically home made/home grown
• ...
EVOLUTION OF PUBLISHING PLATFORMS
GENERATION #3 - A CMS PRODUCT
• A CMS - one product
• Multi channel publishing
• Typical...
EVOLUTION OF PUBLISHING PLATFORMS
GENERATION #4 - OPEN PLATFORMS
• Many different products and tools
• Open API:s
• Built ...
Old platform New platform
Old platform
Polopoly
Xcap
Basefarm
svn
New Platform
Polopoly
Wordpress
Disqus
Addthis
Polldaddy
Google API
Cover it Live
...
EXAMPLE - CHOOSING
THE RIGHT PRODUCT
EXAMPLE SAAS - DISQUS
THERE’S AN APP FORTHAT
DISQUS IMPROVEMENTS
• Mobile version of Disqus
• iPhone-app
• More Community functions
• Like, Dislike and ”who does
what”...
EXAMPLE SAAS/API - ADDTHIS
EXAMPLE SAAS/API - ADDTHIS
EXAMPLE SAAS/API -
CALENDAR
EXAMPLE SAAS/API -
CALENDAR
EXAMPLE SAAS/API -
CALENDAR
EXAMPLE API - LIGHTSPUN
flip
resize
rotate
format
background
quality
}
http://img.lightspun.com/?
flip=h&rotate=-45&backgrou...
ADVANTAGES WITH SAAS
• Easy installation
• Easy configuration
• No maintenance
• It scales
• It improves all the time
EXAMPLE PAAS - HEROKU
• $ git push heroku master
-----> Heroku recieving push
-----> Rails app detected
-----> Launching..... done
http://tv4pla...
TRAFFIC
Peak
Average?
zzzzzzz........
$ heroku dynos 1
tv4play-production now running on 1 dyno
$ heroku dynos 24
tv4play-production now running on 24 dyno
$ heroku dynos ??
tv4play-production now running on ?? dyno
DOES IT SCALE?
”For dynos - there is no real limit. !You can already set your
app to 100 dynos through the command line "h...
THERE’S AN APP FORTHAT
(ACTUALLY,THERE ARE AT LEAST TWO APPS)
EXAMPLE PAAS - AKAMAI
WAIT - ITS JUST
LIKE ELECTRICITY?
The definition of cloud computing according to Wikipedia is:
Cloud computing!is!Internet-...
PICK ONE
FOCUS
hardware OS patches
network infrastructure scaling failover
redundancy antivirus upgrades capacity
backup installati...
FOCUS
hardware OS patches
network infrastructure scaling failover
redundancy antivirus upgrades capacity
backup installati...
IFYOU USE API’S -
BUILD API’STOO
86
API
PRICELIST
WHATS RUNNING?
88
WHY DOTHIS?
Time
Cost
Quality
THANKS FOR LISTENING
per.astrom@tv4.se" " " " " " " " <= Contact
http://twitter.com/perkovich/tv4-http" " <=Twitter
http:/...
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Building websites with building blocks
Upcoming SlideShare
Loading in...5
×

Building websites with building blocks

1,915

Published on

Øredev 2010. About Surdegskartan.se (personal project) and TV4 (professional work) and how to build websites on API, SaaS, PaaS.

Published in: Technology, Business
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,915
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
12
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "Building websites with building blocks"

  1. 1. BUILDING WEBSITES WITH BUILDING BLOCKS Per Åström, Øredev 2010
  2. 2. !"#$%&'(#)*+%) ,"#-.(.#!"
  3. 3. *+%#*+%#*+%#*+%#*+%#*+%#*+%#*+%# *+%#*+%#*+%#*+%#*+%#*+%#*+%#*+%# *+%#*+%#*+%#*+%#*+%#*+%#*+%#*+%# *+%#*+%#*+%#*+%#*+%#*+%#*+%#*+%# *+%#*+%#*+%#*+%#*+%#*+%#*+%#*+%# *+%#*+%#*+%#*+%#*+%#*+%#*+%#*+%# *+%#*+%#*+%#*+%#*+%#*+%#*+%#*+%# *+%#*+%#*+%#*+%#*+%#*+%#*+%#*+%# *+%#*+%#*+%#*+%#*+%#*+%#*+%#*+%#
  4. 4. VOCABULARY surdeg = sourdough surdegskartan = sourdough map http://www.flickr.com/photos/liorshapira/2350847573/
  5. 5. RIDE A BIKE!
  6. 6. WifiSushi Vandrarhem Jobb Annons Camping Café Vintage Kyrko Pizza Bad Hotell Restaurang Surdeg?
  7. 7. •No coding •Useful •Learn
  8. 8. DOMAIN NAME !! ! ! ! ! ! 99 KR APPLICATION, CMS, TOOLS !! 0 KR HOSTING ! ! ! ! ! ! ! ! ! 0 KR WEBSITE !DEVELOPMENT!! ! <10 HOURS BUDGET SURDEGSKARTAN.SE
  9. 9. GEOLOCATION + #SURDEG
  10. 10. Lat Long
  11. 11. ANDTRY #SYSTEMBOLAGET + GEO
  12. 12. DOMAIN NAME !! ! ! ! ! ! 99 KR APPLICATION, CMS, TOOLS !! 0 KR HOSTING ! ! ! ! ! ! ! ! ! 0 KR STICKERS + STAMPS !! ! ! ! 2000 KR BUDGET SURDEGSKARTAN.SE
  13. 13. MARKETING
  14. 14. IT SCALES!
  15. 15. +Lattjolajban.se, Soko.se, Hockeykanalen.se, >150 blogs and more. 41
  16. 16. THETEAM PM ruby/java parentalleave CTO css/js/htm l PM ruby/java text-tv text-tv
  17. 17. Features Maintenance
  18. 18. Features Maintenance
  19. 19. Time Cost Quality
  20. 20. ”STANDING ONTHE SHOULDERS OF GIANTS”
  21. 21. SaaS = Software as a Service (Disqus, Polldaddy, Lightspun) PaaS = Platform as a Service (Heroku,Akamai, Google AppEngine) IaaS = Infrastructure as a Service (Amazon AWS, Citycloud)
  22. 22. EVOLUTION OF PUBLISHING PLATFORMS GENERATION #1 - STATIC FILES • Static html - Editors needed to know html • No database • No reuse of content • No channel publishing • Typical Feature: Server Side Include, ftp • Cause Of Death:Too static and too limited publishing
  23. 23. EVOLUTION OF PUBLISHING PLATFORMS GENERATION #2 - HOME GROWN WITH DB • Database! • DIY - typically home made/home grown • Depended on a few developers • In the long run: expensive and complicated to develop • Typical Feature:Tailor made for the own needs • Cause Of Death:To complicated to continue develop (EOL)
  24. 24. EVOLUTION OF PUBLISHING PLATFORMS GENERATION #3 - A CMS PRODUCT • A CMS - one product • Multi channel publishing • Typically offsprings of internal products • Closed source • Expensive (?) • Typical Feature:A swiss army knife: customize for own needs • Cause Of Death: Slow development pace, limited upgrade path
  25. 25. EVOLUTION OF PUBLISHING PLATFORMS GENERATION #4 - OPEN PLATFORMS • Many different products and tools • Open API:s • Built to integrate or to be integrated • Ready for cloud computing • ”Small pieces connected” • Open source? • Typical Feature: Open for integration and agile development • Cause Of Death: ?
  26. 26. Old platform New platform
  27. 27. Old platform Polopoly Xcap Basefarm svn New Platform Polopoly Wordpress Disqus Addthis Polldaddy Google API Cover it Live Basefarm Akamai Heroku Amazon AWS Github m.fl.
  28. 28. EXAMPLE - CHOOSING THE RIGHT PRODUCT
  29. 29. EXAMPLE SAAS - DISQUS
  30. 30. THERE’S AN APP FORTHAT
  31. 31. DISQUS IMPROVEMENTS • Mobile version of Disqus • iPhone-app • More Community functions • Like, Dislike and ”who does what” • Security improvements with Trusted Domains • Remake of the Commenting experience • Updated Wordpress plugins • Early Adopter Features and Settings • Rewritten implementation for faster download and rendering • Better Spam reporting and close commenting features • Inline Moderating • Yahoo and Facebook login
  32. 32. EXAMPLE SAAS/API - ADDTHIS
  33. 33. EXAMPLE SAAS/API - ADDTHIS
  34. 34. EXAMPLE SAAS/API - CALENDAR
  35. 35. EXAMPLE SAAS/API - CALENDAR
  36. 36. EXAMPLE SAAS/API - CALENDAR
  37. 37. EXAMPLE API - LIGHTSPUN flip resize rotate format background quality } http://img.lightspun.com/? flip=h&rotate=-45&background=ff00ff&format=png&resize=200x200&key=7d0dc9 5a-dcb6-4bfa-b9d3-c3e3c429080b&source=http://www.tv4.se/polopoly_fs/1.1899558.1289397260! image/2116905483.jpg_gen/derivatives/w450/2116905483.jpg
  38. 38. ADVANTAGES WITH SAAS • Easy installation • Easy configuration • No maintenance • It scales • It improves all the time
  39. 39. EXAMPLE PAAS - HEROKU
  40. 40. • $ git push heroku master -----> Heroku recieving push -----> Rails app detected -----> Launching..... done http://tv4play-production.heroku.com deployed
  41. 41. TRAFFIC Peak Average? zzzzzzz........
  42. 42. $ heroku dynos 1 tv4play-production now running on 1 dyno
  43. 43. $ heroku dynos 24 tv4play-production now running on 24 dyno
  44. 44. $ heroku dynos ?? tv4play-production now running on ?? dyno
  45. 45. DOES IT SCALE? ”For dynos - there is no real limit. !You can already set your app to 100 dynos through the command line "heroku dynos 100". !If you need more, we can up that limit to just about any number you need. !Let us know a week in advance at least, and we'll get your limit increased. !If you're going to need a few thousand, it's best if we can work with you to understand your demand.”
  46. 46. THERE’S AN APP FORTHAT (ACTUALLY,THERE ARE AT LEAST TWO APPS)
  47. 47. EXAMPLE PAAS - AKAMAI
  48. 48. WAIT - ITS JUST LIKE ELECTRICITY? The definition of cloud computing according to Wikipedia is: Cloud computing!is!Internet-based!computing, whereby shared resources, software, and information are provided to computers!and other devices on demand, like the electricity grid.
  49. 49. PICK ONE
  50. 50. FOCUS hardware OS patches network infrastructure scaling failover redundancy antivirus upgrades capacity backup installation planning firewall specification design integrate operations gui SLA maintenance new features
  51. 51. FOCUS hardware OS patches network infrastructure scaling failover redundancy antivirus upgrades capacity backup installation planning firewall specification design integrate operations gui SLA maintenance new features
  52. 52. IFYOU USE API’S - BUILD API’STOO 86 API
  53. 53. PRICELIST
  54. 54. WHATS RUNNING? 88
  55. 55. WHY DOTHIS? Time Cost Quality
  56. 56. THANKS FOR LISTENING per.astrom@tv4.se" " " " " " " " <= Contact http://twitter.com/perkovich/tv4-http" " <=Twitter http://github.com/TV4" " " " " " " <= Code Thanks for help with Surdegskartan: @tedvalentin, @fdqps, @ankerstal, @mptre, @plindberg, @jocap, @lemonad Images: http://www.clker.com/, http://www.flickr.com/photos/liorshapira/2350847573/
  1. A particular slide catching your eye?

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

×