Mobile web apps with websharper

1,274 views

Published on

Published in: Technology, Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,274
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
2
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • Really depends on your goalsDownsides of native apps:Have to give Apple/Google/Microsoft big chunk of your revenue (app store)Reliant on others (app store approval delays)Have to write app for each platform (android, iOS, Blackberry, Windows Phone)…and customise it for each screen resolution
  • Have to wait for approvalGive away a big chunk of your revenueLoads of extra workHave to write in a shitty language.
  • 6 resolutions to support just for apple devices. And you probably want to support vertical and horizontal orientations. That’s a dozen.There are around 30 manufacturers of Android devices, each has many different screen sizes.
  • Samples to show:http://www.gostowe.com/http://saltfireandtime.com/shop/
  • Anyone who has dealt with web development knows that fighting with different browsers isn’t fun. Use a CSS framework to make your life easier.Show zurb formshttp://foundation.zurb.com/docs/components/forms.html
  • Dynamic typing leads to bugs – accidental plus in exampleCrazy behaviourWeird scoping
  • This is a funscript example
  • Both excellent products with different focus.
  • Anyone who has dealt with web development knows that fighting with different browsers isn’t fun. Use a CSS framework to make your life easier.Show zurb formshttp://foundation.zurb.com/docs/components/forms.html
  • Anyone who has dealt with web development knows that fighting with different browsers isn’t fun. Use a CSS framework to make your life easier.PhoneGap also proves access to accelerometer, camera, compass, contacts, file, geolocation, media, notifications and device storage.
  • Write three times: Somewhat mitigated with Xamarin/Mono but UI often the hardest bit to get rightPerformance: HTML5 probably not a good choice for graphics-heavy games
  • Mobile web apps with websharper

    1. 1. F# Mobile Web Applications James Freiwirth Perfect Shuffle Ltd james@perfectshuffle.co.uk
    2. 2. Web vs. Native
    3. 3. Why not go native? • Walled gardens (app stores) • Apple/Google/Microsoft take 20-30% of revenue • Have to write app for each platform… • … and customise it for each screen resolution • Less work, faster development, get your product released quicker!
    4. 4. These are the resolutions just for Apple phones and tablets…
    5. 5. Responsive web design to the rescue!
    6. 6. Use a framework! Bootstrap http://twitter.github.io/bootstrap/ Suzy http://susy.oddbird.net/ Skeleton http://www.getskeleton.com/ Zurb Foundation http://foundation.zurb.com/ There are loads more...
    7. 7. Javascript sucks, but it’s everywhere. alert("Why am I a " + typeof + "");
    8. 8. Funscript and Websharper let you compile F# to Javascript!
    9. 9. Which should I use? Funscript Websharper • Open source • Completely free • Can use typescript definitions • Client-side only at the moment • Minimalist F# to Javascript compiler • Open source for open source apps • Otherwise commercial licence • Server and client side • Seamless client-server RPC calls • Complete framework
    10. 10. Developing/Hosting on Linux Use vagrant to create a reproducible development environment. http://www.vagrantup.com/ Ready-made base box: https://bitbucket.org/perfectshuffle/vagrant_raring_ mono/ Getting started guide: http://thecodedecanter.wordpress.com/2013/06/22/ hosting-websharperasp-net-apps-on-linux-with-mono- nginx/
    11. 11. Other great tools Sass makes CSS fun again. Sass is an extension of CSS3, adding nested rules, variables,mixins, selector inheritance, and more. It’s translated to well- formatted, standard CSS. (http://sass-lang.com/) LiveScript is a language which compiles to JavaScript. Syntax similar to F# but dynamically typed. Useful for accessing javascript libraries without bindings/typescript definitions. (http://livescript.net/) PhoneGap lets you turn your HTML 5 app into a native app and publish it in the app stores
    12. 12. Thank you! Any questions?
    13. 13. Web Apps vs. Native Native Web applications Pros: • Performance • Native look and feel • Access whole of device’s API • May prefer languages + tooling Cons: • Walled garden (app stores) • 30% of revenue goes to Google/Apple/Microsoft • Have to write application for each platform separately • Hard to support multitude of screen sizes Pros: • HTML 5 now very capable • Choose your own language/framework • Write your application only once • Can still deploy to app store using products like PhoneGap Cons: • Lack of visibility • Performance often not as good as native apps • Javascript sucks
    14. 14. Why Websharper? • Turns out MVC isn’t a great pattern for modern web applications • Compositional • Humans aren’t good at context-switching • Seamless client server communication

    ×