F# Mobile Web

ApplicationsJames Freiwirth

Perfect Shuffle Ltdjames@perfectshuffle.co.uk

Web vs. Native

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!

These are the resolutions just for Apple phones and tablets…

Responsive web design to the rescue!

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...

Javascript sucks, but it’s everywhere.

alert("Why am I a " + typeof + "");

Funscript and Websharper let you compile F# to Javascript!

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

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/

Other great toolsSass 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

Thank you!Any questions?

Web Apps vs. NativeNative Web applications

Pros:• Performance• Native look and feel• Access whole of device’s API• May prefer languages + toolingCons:• 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 PhoneGapCons:• Lack of visibility• Performance often not as

good as native apps• Javascript sucks

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