ITCamp 2013 - Adam Granicz - Developing for W8 with F# and WebSharper

  • 357 views
Uploaded on

 

More in: Technology , Business
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
357
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
0
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. itcampro@ itcamp13# Premium conference on Microsoft technologiesDeveloping for Windows 8with F# and WebSharperAdam Granicz, CEO, IntelliFactory#granicz, #websharperhttp://fpish.net/blog/adam.granicz/all/0
  • 2. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileHuge thanks to our sponsors!
  • 3. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &Mobile3x F# MVP – 2010, 2011, 2012(Most Valuable Professional)Coauthor of 4 F# books, 3 ofthem with Don Syme, thedesigner of F#CEO of IntelliFactory,The F# CompanyRegular speaker in numerousconferences and developerworkshopsAbout meSteering Committee memberof the Commercial Users ofFunctional Programming(CUFP) workshop,representing F#
  • 4. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileExpert F# - 2007Expert F# 2.0 – 2010Visual Studio 2010 and .NET 4 Six-in-One – 2010Expert F# 3.0 – 2012F# Books I coauthored
  • 5. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileWe see how to do the following:• Doing web development in F#• Binding JavaScript libraries for F# use• Developing a Win 8/Surface application in F#• Sneak preview of an online developmentenvironment that enables quick explorationand embedded applications• .. that makes data visualization easy and funIn this talk…
  • 6. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileFunctional core languagePowerful functional abstractionsFunctional data structuresImmutabilityCool featuresActive patternsUnits of measureType ProvidersObject-orientation to interoperate with other .NETlanguagesWhy F#?
  • 7. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileMature, enterprise-ready frameworkWrite all your server+client code in F#Get a complete web or mobile applicationInterface with any client-side JS library via F#Powerful functional abstractionsAutomatic resource managementSafe URLs, type-safe URLsand much-much more…WebSharper
  • 8. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileOpen source project, available at:https://bitbucket.org/IntelliFactory/websharperDual licensed for closed source useDedicated support – new features, bugfixreleasesWebSharper
  • 9. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &Mobileopen IntelliFactory.WebSharpermodule Server =[<Rpc>]let MyServerFunction(...) = ...module Client =[<JavaScript>]let MyClientFunction(...) =...let v = MyServerFunction(...)...Bridging the language mismatch
  • 10. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileWebSharper sitelets• Type-safe• Composable• First-classParameterized over a union type:type Action =| Home| Contact| Protected| Login of option<Action>| Logout| Echo of stringRepresenting web applications as values
  • 11. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileSitelets – dynamic templatingRuntime-checked, safe URLsmodule Skin =type Page = { Body : Content.HtmlElement list }let MainTemplate =let path = Path.Combine(__SOURCE_DIRECTORY__, "Main.html")Content.Template<Page>(path).With("body", fun x -> x.Body)let WithTemplate body : Content<Action> =Content.WithTemplate MainTemplate <| fun context ->{ Body = body context }
  • 12. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileComposing web applications from smaller oneslet EntireSite =let home = Sitelet.Content ...let authenticated = Sitelet.Protect filter <| ...let basic = Sitelet.Infer <| fun action -> ...Sitelet.Sum[homeauthenticatedbasic]Representing web applications as values
  • 13. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileDescribing client-sideAPIs in F# viaWebSharperInterfaceGenerator (WIG)Binding JavaScript libraries
  • 14. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &Mobilenamespace IntelliFactory.WebSharper.Facebookmodule Definition =...let FB =Class "FB"|+> [ ..."login" => ..."getLoginStatus" => ..."api" => ...]|> Requires [Res.FacebookAPI]let Assembly =Assembly [Namespace"IntelliFactory.WebSharper.Facebook" [...; FB] ...]Binding JavaScript libraries
  • 15. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileBinding JavaScript librariesDefining classes – useful operatorslet FlashHidingArgs =Class "FB.FlashHidingArgs"|+> Protocol ["state" =? T<string>"elem" =? T<Element>]=? : Member
  • 16. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileBinding JavaScript librariesDefining optional memberslet InitOptions =Pattern.Config "FB.InitOptions" {Required = []Optional =["appId", T<string>"cookie", T<bool>..."hideFlashCallback", FlashHidingArgs ^-> T<unit>]}• Typical in most JavaScript libraries• Used heavily in configuration objects
  • 17. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileBinding JavaScript librariesDefining safe enumerationslet UserStatus =Pattern.EnumStrings "FB.UserStatus"["connected"; "not_authorized"; "unknown"]• Typical in most JavaScript libraries• Used heavily in configuration objects
  • 18. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileBinding JavaScript librarieseDSL to describe JavaScript APIsType Provider for TypeScript definitionsF#WebSharperextensionTypeScriptTypeScriptType ProviderWebSharperextension
  • 19. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileBinding JavaScript librariesDescribing client-sideAPIs viaTypeScriptdeclarations
  • 20. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileType Provider for TypeScript definitionstype Facebook =IntelliFactory.TypeScript.Generator<"Facebook.d.ts">Facebook.***Binding JavaScript libraries
  • 21. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileAn F#/WebSharper application using jQueryMobileTotal size: 150 LOC in F#My Facebook Wall for tablets
  • 22. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileMy Facebook Wall for tabletsWebSharper Facebook application showing wall posts• Using the Facebook bindings generated via WIG and TypeScript.
  • 23. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileIntelliMath for WinRT/8
  • 24. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileAn F#/WebSharper application using WinJSSize: 1100 LOC in F#IntelliMath for WinRT/8
  • 25. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobilePromisestype Promise<T> =[<Inline "$this.then($f)">]member this.Then(f: T -> U) = X<Promise<U>>[<Inline "$this.done($f)">]member this.Done(f: T -> unit) = ()Binding WinJS
  • 26. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &Mobilemodule Application =[<Inline "WinJSSetOnActivated($f)">]let OnActivated(f: unit -> unit) = ()module Local =[<Inline "WinJS.Application.local.exists($f)">]let Exists (f: string) = X<Promise<bool>>[<Inline "WinJS.Application.local.readText($f)">]let ReadText (f: string) = X<Promise<string>>...Binding WinJS
  • 27. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileGoing to TypeScript declarations or WIG is thefull solutionBinding WinJS
  • 28. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &Mobile[<JavaScript>]let rec (|Factor|_|) = function| NUMBER (n, rest) ->Some (Expr.Const (Const.Number n), rest)| ID ("x", rest) ->Some (Expr.Const Const.X, rest)| ID ("pi", rest) ->Some (Expr.Const Const.Pi, rest)| ID ("e", rest) ->Some (Expr.Const Const.E, rest)| LPAREN (Expression (e, RPAREN rest)) ->(e, rest) |> Some| _ ->NoneParsing with active patterns
  • 29. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &Mobile/// Pixels on the screen[<Measure>] type pxmodule Events =type Point = { x: int<px>; y: int<px> }[<Sealed>]type PointerPoint =[<Stub>]member this.pointerId = X<int>[<Stub>]member this.position = X<Point>Using units of measure
  • 30. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileExtras
  • 31. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileAggregates and catalogs FP content about:Q&AEvents/ConferencesCoursesUser GroupsBlogsJobsDevelopersetc…FPish.net
  • 32. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &Mobile• Full F# language support• Multi-project solutions• Web and mobile Apps• Syntax highlighting• On the fly type checking• Interactive exploration• Integration with data• Support for type providersCloudSharper
  • 33. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileDevelop, deploy, and run full web and mobileapplications with interactive programmingCloudSharper
  • 34. itcampro@ itcamp13# Premium conference on Microsoft technologiesDevelopment &MobileVideo…CloudSharper
  • 35. itcampro@ itcamp13# Premium conference on Microsoft technologiesQ & AGet in touch#granicz #websharper #fpishnethttp://websharper.comhttp://intellifactory.comhttp://fpish.nethttp://www.facebook.com/intellifactory