building websites with building blocks
DESCRIPTION
Øredev 2010. About Surdegskartan.se (personal project) and TV4 (professional work) and how to build websites on API, SaaS, PaaS.TRANSCRIPT
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 HOURS
BUDGET SURDEGSKARTAN.SE
GEOLOCATION + #SURDEG
Lat Long
AND TRY #SYSTEMBOLAGET + GEO
DOMAIN NAME ! ! ! ! ! ! ! 99 KR
APPLICATION, CMS, TOOLS !! 0 KR
HOSTING ! ! ! ! ! ! ! ! ! 0 KR
STICKERS + STAMPS !! ! ! ! 2000 KR
BUDGET SURDEGSKARTAN.SE
MARKETING
IT SCALES!
+Lattjolajban.se, Soko.se, Hockeykanalen.se, >150 blogs and more.
41
THE TEAM
PM ruby
/java
pare
ntal le
ave
CTO
css/js
/html
PM
ruby
/java
text-t
v
text-t
v
Features
Maintenance
Features
Maintenance
Time
Cost
Quality
”STANDING ON THE SHOULDERS OF GIANTS”
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)
EVOLUTION OF PUBLISHING PLATFORMSGENERATION #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
EVOLUTION OF PUBLISHING PLATFORMSGENERATION #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)
EVOLUTION OF PUBLISHING PLATFORMSGENERATION #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
EVOLUTION OF PUBLISHING PLATFORMSGENERATION #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: ?
Old platform New platform
Old platformPolopolyXcap
Basefarmsvn
New PlatformPolopolyWordpressDisqusAddthisPolldaddyGoogle APICover it Live
BasefarmAkamaiHerokuAmazon AWSGithub m.fl.
EXAMPLE - CHOOSINGTHE RIGHT PRODUCT
EXAMPLE SAAS - DISQUS
THERE’S AN APP FOR THAT
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
EXAMPLE SAAS/API - ADDTHIS
EXAMPLE SAAS/API - ADDTHIS
EXAMPLE SAAS/API - CALENDAR
EXAMPLE SAAS/API - CALENDAR
EXAMPLE SAAS/API - CALENDAR
EXAMPLE API - LIGHTSPUN
flipresizerotateformatbackgroundquality}
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
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://tv4play-production.heroku.com deployed
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 "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.”
THERE’S AN APP FOR THAT
(ACTUALLY, THERE ARE AT LEAST TWO APPS)
EXAMPLE PAAS - AKAMAI
WAIT - ITS JUSTLIKE 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.
PICK ONE
FOCUS
hardware OS patches network infrastructure scaling failover redundancy antivirus upgrades capacity
backup installation planning firewall specification design integrate
operations gui SLA maintenancenew features
FOCUS
hardware OS patches network infrastructure scaling failover redundancy antivirus upgrades capacity
backup installation planning firewall specification design integrate
operations gui SLA maintenancenew features
IF YOU USE API’S - BUILD API’S TOO
86
API
PRICELIST
WHATS RUNNING?
88
WHY DO THIS?
Time
Cost
Quality
THANKS FOR LISTENING
[email protected]" " " " " " " " <= Contact
http://twitter.com/perkovich/tv4-http" " <= Twitter
http://github.com/TV4" " " " " " " <= Code
Thanks for help with Surdegskartan: @tedvalentin, @fdqps, @ankerstal, @mptre, @plindberg, @jocap, @lemonadImages: http://www.clker.com/, http://www.flickr.com/photos/liorshapira/2350847573/