SlideShare une entreprise Scribd logo
1  sur  34
Applying Functional Programming to Build
                             Platform-Independent Mobile Applications




                                                 Adam Granicz, CEO
                                                   IntelliFactory
                                          granicz.adam@intellifactory.com

                                       CUFP 2011, Tokyo, Japan - Sep 24, 2011


Copyright © 2004-2011 IntelliFactory         Platform-Independent Mobile Applications   http://www.intellifactory.com
It’s all about business


  The mobile market†

  • 3.7 billion mobile users
  • $1.2 trillion dollars generated:
    the fastest growing industry on the planet
  • $8.8 billion on mobile advertising

  • $3 billion spent on consumer apps
  • $6 billion spent on corporate applications
  • Expected to rise sharply

  † source: http://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the-trillion-dollar-industry-why-is-google-saying-put-your-b.html




Copyright © 2004-2011 IntelliFactory                         Platform-Independent Mobile Applications                          http://www.intellifactory.com            |2
It’s all about business


  Reaching prospects via mobiles†

                             Channel                        Cost               Reach            People/$
                     Mobile website                      $30,000              36.40%              2,840
                     iPhone app                          $30,000               6.75%                527
                     Mobile app for
                                                         $90,000              24.04%                599
                     major brands




  † source: http://mashable.com/2011/02/24/mobile-app-dev-cost/




Copyright © 2004-2011 IntelliFactory                 Platform-Independent Mobile Applications   http://www.intellifactory.com   |3
Mobile development now – not looking good


  • iOS – Objective-C hell + pinned to Macs + pinned
    to custom development environment and tools
  • Android – Java + a large API to learn
  • Windows Phone - .NET + a large API to learn
  • Windows Mobile - …




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   |4
Mobile development now – not looking good


  • Can we multi-target?
         – Not easily, in fact it’s nearly impossible without
           rewriting code from one language to another




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   |5
What do we need?




                   What would get people really excited?




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   |6
What do we need?


  How about some of the following:
         –    Writing less code
         –    Using higher level abstractions
         –    Type-safe, declarative UIs
         –    Multi-targeting
         –    Scaling into desktop applications
         –    Scaling into the cloud


  Tremendous saving on time/effort/maintainability



Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   |7
Native apps vs Web apps


  • JavaScript is the IL …
         – of client-side web applications

              and is becoming the IL …

         – of desktop applications: Windows 8
         – of mobile applications: Android, WP7, etc.


  • Some even write the server side in JavaScript




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   |8
JavaScript-based mobile applications


  • So let’s write mobile applications in JavaScript!

  • Hey, but we have PhoneGap and all, what about
    that?
         – Sure, but JavaScript is hard to write, we need:
                • Type safety
                • Compile time guarantees
                • Coding assistance – code completion, API help, etc.
         – We still have N-1 unfulfilled objectives




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   |9
WebSharper

  •    Mature, enterprise-ready framework
  •    Write all your server+client code in F#
  •    Compiles to a complete web application
  •    Interface with any client-side JS library via F#
  •    Powerful abstractions
  •    Automatic resource management
  •    Safe URLs, type-safe URLs
  •    and much-much more…

  Less code (50-90% less!)
  Quicker to develop
  Easier to maintain


Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 10
WebSharper Mobile


  •    Exposes mobile capabilities to JavaScript
  •    Provides the necessary packaging
  •    Enables quick and seamless multi-targeting
  •    Scales into the cloud




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 11
WebSharper extensions


  A couple dozen available extensions

                              http://websharper.com/extensions




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 12
Powerful Abstractions - Sitelets


  • Type-safe
  • Composable
  • First-class

  Parameterized over a union type:
  /// Actions that correspond to the different pages in the site.
  type Action =
      | Home
      | Contact
      | Protected
      | Login of option<Action>
      | Logout
      | Echo of string




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 13
WebSharper sitelets

 Strongly-typed templating, safe URLs
                               let Template title main : Content<Action> =
                                  let menu (ctx: Context<Action>)=
                                     let (!) action = ctx.Link action |> HRef
                                            [
                                        A [!Action.Home] -< [Text "Home"]
                                        A [!Action.Contact] -< [Text "Contact"]
                                        A [!(Action.Echo "Hello“)] -< [Text "Say Hello"]
                                        A ["~/LegacyPage.aspx" |> ctx.ResolveUrl |> HRef] -< [Text "ASPX Page"]
                                      ]
                                      |> List.map (fun link ->
                                         Label [Class "menu-item"] -< [link]
                                      )

                                  Templates.Skin.Skin (Some title)

                                           {
                                            LoginInfo = Widgets.LoginInfo
                                            Banner = fun ctx -> [H2 [Text title]]
                                            Menu = menu
                                            Main = main
                                            Sidebar = fun ctx -> [Text "Put your side bar here"]
                                            Footer = fun ctx -> [Text “Copyright (c) 2011 YourCompany.com"]
                                       }



Copyright © 2004-2011 IntelliFactory             Platform-Independent Mobile Applications     http://www.intellifactory.com   | 14
WebSharper sitelets

  /// The pages of this website.
  module Pages =

      /// A helper function to create a hyperlink
      let ( => ) title href = A [HRef href] -< [Text title]

        /// The home page.
      let HomePage : Content<Action> =
          Template "Home" <| fun ctx ->
             [
               H1 [Text "Welcome to our site!"]
               “Contact" => ctx.Link Action.Contact
             ]
      ...



Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 15
WebSharper sitelets – composing 1

  // A simple sitelet for the root of the site.
  let home =
     Sitelet.Content "/" Action.Home Pages.HomePage




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 16
WebSharper sitelets – composing 2

  // An automatically inferred sitelet for the basic parts.
  let basic =
     Sitelet.Infer <| fun action ->
        match action with
        | Action.Contact -> Pages.ContactPage
        | Action.Echo param -> Pages.EchoPage param
        | Action.Login action -> Pages.LoginPage action
        | Action.Logout ->
           // Logout user and redirect to home
           UserSession.Logout ()
           Content.Redirect Action.Home
        | Action.Home -> Content.Redirect Action.Home
        | Action.Protected -> Content.ServerError


Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 17
WebSharper sitelets – composing 3

  // A sitelet for the protected content.
  let authenticated =
     let filter : Sitelet.Filter<Action> =
        {
            VerifyUser = fun _ -> true
            LoginRedirect = Some >> Action.Login
        }

      Sitelet.Protect filter
      <| Sitelet.Content
         "/protected“
         Action.Protected
         Pages.ProtectedPage


Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 18
WebSharper sitelets – composing final

  let EntireSite =
     // Compose the above sitelets into a larger one.
     Sitelet.Sum
        [
          home
          authenticated
          basic
        ]




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 19
Powerful abstractions - Formlets


  • Type-safe
  • Composable
  • First-class

  • Dependent formlets – can express dependencies
  • Flowlets – provide step-by-step layout




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 20
WebSharper formlets

  let TB label msg =
     Controls.Input ""
     |> Validator.IsNotEmpty msg
     |> Enhance.WithValidationIcon
     |> Enhance.WithTextLabel label



  Formlet.Yield (fun v1 v2 ... vn -> <compose all vi’s>)
  <*> formlet1
  <*> formlet2
  ...
  <*> formletn




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 21
WebSharper formlets

  type Person = { Name: string; Email: string }

  [<JavaScript>]
  let PersonFormlet () : Formlet<Person> =
     let nameF = TB “Name” “Empy name not allowed”
     let emailF = TB “Email” “Please enter a valid email address”

        Formlet.Yield (fun name email -> { Name = name; Email = email })
      <*> nameF
      <*> emailF
      |> Enhance.WithSubmitAndResetButtons
      |> Enhance.WithLegend "Add a New Person“
      |> Enhance.WithFormContainer




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 22
WebSharper formlets

  And you get:




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 23
WebSharper formlet extensions


  • Available for various UI control set libraries
         –    jQuery UI
         –    Yahoo UI
         –    Ext JS
         –    jQuery Mobile




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 24
WebSharper formlet extensions - jQM

  let loginSequenceF =
     Formlet.Do {
        let! username, password, remember =
           Formlet.Yield (fun user pass remember -> user, pass, remember)
           <*> (Controls.TextField "" Theme.C "Username: "
               |> Validator.IsNotEmpty "Username cannot be empty!")
           <*> (Controls.Password "" Theme.C "Password: "
               |> Validator.IsRegexMatch "^[1-4]{4,}[0-9]$" "The password is wrong!")
           <*> Controls.Checkbox true Theme.C "Keep me logged in "
               |> Enhance.WithSubmitButton "Log in" Theme.C
        let rememberText =
           if remember then "" else "not "
        do! Formlet.OfElement (fun _ ->
           Div [
               H3 [Text ("Welcome " + username + "!")]
               P [Text ("We will " + rememberText + "keep you logged in.")]
           ])
     }
     |> Formlet.Flowlet



Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 25
WebSharper formlet extensions - jQM

  Div [HTML5.Attr.Data "role" "page"] -< [
    Div [HTML5.Attr.Data "role" "header"] -< [
       H1 [Text "WebSharper Formlets for jQuery Mobile"]>
    ]

      Div [HTML5.Attr.Data "role" "content"] -< [
               loginSequenceF
        ]

      Div [HTML5.Attr.Data "role" "footer"] -< [
        P [Attr.Style "text-align: center;"] -< [Text "IntelliFactory"]
      ]
  ]




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 26
WebSharper formlet extensions - jQM


  As you expect:




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 27
Other extensions


  • GIS
         – Google Maps
         – Bing Maps
  • Visualization
         – Infovis
         – Protovis
         – Google Visualization




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 28
Other extensions – Google Maps

type CurrentLocationControl() =          let setMap (map : Bing.Map) =                           let map =
  inherit Web.Control()                   let updateLocation() =                                  Div []
                                            // Gets the current location                          |>! OnAfterRender (fun this ->
                                            let loc = Mobile.GetLocation()                          // Renders a map control
  [<JavaScript>]                                                                                    let map =
                                            // Sets the label to the current location
  override this.Body =
                                            Rest.RequestLocationByPoint(<<your-bingmaps-key>>,
   let screenWidth =                              loc.Lat, loc.Long, ["Address"],                    Bing.Map(this.Body, MapOptions)
         JQuery.Of("body").Width()            fun result ->
                                                                                                   map.SetMapType(Bing.MapTypeId.Road)
                                                 let locInfo =
   let MapOptions =                                    result.ResourceSets.[0].Resources.[0]
                                                                                                   setMap map)
      Bing.MapViewOptions(                       label.Text <-
                                                       "You are currently at " +
                                                                                                  // Returns markup for this control
       Credentials = bingMapsKey,                                                                 Div [
                                                       JavaScript.Get "name" locInfo)
       Width = screenWidth - 10,                                                                     label
       Height = screenWidth - 10,                                                                    Br []
                                           // Adds a pushpin at the current location
       Zoom = 16)                                                                                    map
                                           let loc = Bing.Location(loc.Lat, loc.Long)
                                                                                                  ] :> _
                                           let pin = Bing.Pushpin loc
   let label = H2 []                       map.Entities.Clear()
                                           map.Entities.Push pin
                                           map.SetView(Bing.ViewOptions(Center = loc))

                                          // Keep updating your location regularly
                                          JavaScript.SetInterval updateLocation 1000
                                          |> ignore




  Copyright © 2004-2011 IntelliFactory          Platform-Independent Mobile Applications          http://www.intellifactory.com    | 29
Other extensions – Google Maps




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 30
Other extensions


  • HTML5
         – WebGL
         – O3D
         – GlMatrix




Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 31
Summary


  F# + WebSharper gives:
  • Absolutely huge productivity gain
  • Access to a growing market opportunity
  • Quick path to multiple platforms
  • Scaling to desktop and to the cloud

  Advocates functional programming to
         – Use more powerful abstractions
         – Cut development time
         – Produce shorter, more maintainable code

Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 32
Extra


  FPish.net - “everything functional”:
  • Events – webcasts, meetups, etc.
  • Courses
  • User groups
  • Conferences
  • Blogs
  • Topics – Q&A
  • Developers
  • Companies


Copyright © 2004-2011 IntelliFactory   Platform-Independent Mobile Applications   http://www.intellifactory.com   | 33
Questions?




                                                  Find out more at:
                                              http://intellifactory.com
                                                http://websharper.com
                                        http://infoq.com/articles/WebSharper
                                       CUFP 2011, Tokyo, Japan - Sep 24, 2011


Copyright © 2004-2011 IntelliFactory         Platform-Independent Mobile Applications   http://www.intellifactory.com

Contenu connexe

Similaire à Applying Functional Programming to Build Platform-Independent Mobile Applications

Plattformübergreifende App-Entwicklung (ein Vergleich) - MobileTechCon 2010
Plattformübergreifende App-Entwicklung (ein Vergleich) - MobileTechCon 2010Plattformübergreifende App-Entwicklung (ein Vergleich) - MobileTechCon 2010
Plattformübergreifende App-Entwicklung (ein Vergleich) - MobileTechCon 2010Heiko Behrens
 
Front-end. Global domination
Front-end. Global dominationFront-end. Global domination
Front-end. Global dominationStfalcon Meetups
 
Costruire applicazioni multi-tenant e piattaforme SaaS in PHP con Innomatic
Costruire applicazioni multi-tenant e piattaforme SaaS in PHP con InnomaticCostruire applicazioni multi-tenant e piattaforme SaaS in PHP con Innomatic
Costruire applicazioni multi-tenant e piattaforme SaaS in PHP con InnomaticInnoteam Srl
 
IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...
IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...
IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...darwinodb
 
Best Practices - Hybrid App Implementation V 03
Best Practices - Hybrid App Implementation V 03Best Practices - Hybrid App Implementation V 03
Best Practices - Hybrid App Implementation V 03Kam Rezvani
 
SharePoint 2013 App Provisioning Models
SharePoint 2013 App Provisioning ModelsSharePoint 2013 App Provisioning Models
SharePoint 2013 App Provisioning ModelsShailen Sukul
 
AnDevCon: Introduction to Darwino
AnDevCon: Introduction to DarwinoAnDevCon: Introduction to Darwino
AnDevCon: Introduction to DarwinoPhilippe Riand
 
Building jQuery Mobile Web Apps
Building jQuery Mobile Web AppsBuilding jQuery Mobile Web Apps
Building jQuery Mobile Web AppsOperation Mobile
 
IBM Worklight - Technical Overview
IBM Worklight - Technical OverviewIBM Worklight - Technical Overview
IBM Worklight - Technical OverviewIIC_Barcelona
 
JS for Mobile: The Enyo Framework (jsconf.us 2011)
JS for Mobile: The Enyo Framework (jsconf.us 2011)JS for Mobile: The Enyo Framework (jsconf.us 2011)
JS for Mobile: The Enyo Framework (jsconf.us 2011)Ben Combee
 
IBM Mobile portal experience
IBM Mobile portal experienceIBM Mobile portal experience
IBM Mobile portal experienceVincent Perrin
 
PHP in a mobile ecosystem
PHP in a mobile ecosystem PHP in a mobile ecosystem
PHP in a mobile ecosystem Ivo Jansch
 
Dreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile designDreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile designDee Sadler
 
Custom Development with Novell Teaming
Custom Development with Novell TeamingCustom Development with Novell Teaming
Custom Development with Novell TeamingNovell
 
Custom Development with Novell Teaming
Custom Development with Novell TeamingCustom Development with Novell Teaming
Custom Development with Novell TeamingNovell
 

Similaire à Applying Functional Programming to Build Platform-Independent Mobile Applications (20)

Plattformübergreifende App-Entwicklung (ein Vergleich) - MobileTechCon 2010
Plattformübergreifende App-Entwicklung (ein Vergleich) - MobileTechCon 2010Plattformübergreifende App-Entwicklung (ein Vergleich) - MobileTechCon 2010
Plattformübergreifende App-Entwicklung (ein Vergleich) - MobileTechCon 2010
 
Mat Marquis - JQuery Mobile
Mat Marquis - JQuery MobileMat Marquis - JQuery Mobile
Mat Marquis - JQuery Mobile
 
Front-end. Global domination
Front-end. Global dominationFront-end. Global domination
Front-end. Global domination
 
Frontend. Global domination.
Frontend. Global domination.Frontend. Global domination.
Frontend. Global domination.
 
Costruire applicazioni multi-tenant e piattaforme SaaS in PHP con Innomatic
Costruire applicazioni multi-tenant e piattaforme SaaS in PHP con InnomaticCostruire applicazioni multi-tenant e piattaforme SaaS in PHP con Innomatic
Costruire applicazioni multi-tenant e piattaforme SaaS in PHP con Innomatic
 
IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...
IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...
IBM ConnectED SPOT104: Lightning-Fast Development of Native Mobile Apps for I...
 
Best Practices - Hybrid App Implementation V 03
Best Practices - Hybrid App Implementation V 03Best Practices - Hybrid App Implementation V 03
Best Practices - Hybrid App Implementation V 03
 
SharePoint 2013 App Provisioning Models
SharePoint 2013 App Provisioning ModelsSharePoint 2013 App Provisioning Models
SharePoint 2013 App Provisioning Models
 
AnDevCon: Introduction to Darwino
AnDevCon: Introduction to DarwinoAnDevCon: Introduction to Darwino
AnDevCon: Introduction to Darwino
 
Building jQuery Mobile Web Apps
Building jQuery Mobile Web AppsBuilding jQuery Mobile Web Apps
Building jQuery Mobile Web Apps
 
Worklight Overview
Worklight OverviewWorklight Overview
Worklight Overview
 
IBM Worklight - Technical Overview
IBM Worklight - Technical OverviewIBM Worklight - Technical Overview
IBM Worklight - Technical Overview
 
JS for Mobile: The Enyo Framework (jsconf.us 2011)
JS for Mobile: The Enyo Framework (jsconf.us 2011)JS for Mobile: The Enyo Framework (jsconf.us 2011)
JS for Mobile: The Enyo Framework (jsconf.us 2011)
 
Web app
Web appWeb app
Web app
 
IBM Mobile portal experience
IBM Mobile portal experienceIBM Mobile portal experience
IBM Mobile portal experience
 
PHP in a mobile ecosystem
PHP in a mobile ecosystem PHP in a mobile ecosystem
PHP in a mobile ecosystem
 
Web app
Web appWeb app
Web app
 
Dreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile designDreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile design
 
Custom Development with Novell Teaming
Custom Development with Novell TeamingCustom Development with Novell Teaming
Custom Development with Novell Teaming
 
Custom Development with Novell Teaming
Custom Development with Novell TeamingCustom Development with Novell Teaming
Custom Development with Novell Teaming
 

Dernier

Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processorsdebabhi2
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...Neo4j
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Scriptwesley chun
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking MenDelhi Call girls
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationRadu Cotescu
 
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Igalia
 
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxFactors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxKatpro Technologies
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsEnterprise Knowledge
 
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024Results
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptxHampshireHUG
 
Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024The Digital Insurer
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreternaman860154
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityPrincipled Technologies
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?Igalia
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)Gabriella Davis
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)wesley chun
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...apidays
 
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEarley Information Science
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CVKhem
 

Dernier (20)

Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
 
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxFactors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
 
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
 
Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 

Applying Functional Programming to Build Platform-Independent Mobile Applications

  • 1. Applying Functional Programming to Build Platform-Independent Mobile Applications Adam Granicz, CEO IntelliFactory granicz.adam@intellifactory.com CUFP 2011, Tokyo, Japan - Sep 24, 2011 Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com
  • 2. It’s all about business The mobile market† • 3.7 billion mobile users • $1.2 trillion dollars generated: the fastest growing industry on the planet • $8.8 billion on mobile advertising • $3 billion spent on consumer apps • $6 billion spent on corporate applications • Expected to rise sharply † source: http://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the-trillion-dollar-industry-why-is-google-saying-put-your-b.html Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com |2
  • 3. It’s all about business Reaching prospects via mobiles† Channel Cost Reach People/$ Mobile website $30,000 36.40% 2,840 iPhone app $30,000 6.75% 527 Mobile app for $90,000 24.04% 599 major brands † source: http://mashable.com/2011/02/24/mobile-app-dev-cost/ Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com |3
  • 4. Mobile development now – not looking good • iOS – Objective-C hell + pinned to Macs + pinned to custom development environment and tools • Android – Java + a large API to learn • Windows Phone - .NET + a large API to learn • Windows Mobile - … Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com |4
  • 5. Mobile development now – not looking good • Can we multi-target? – Not easily, in fact it’s nearly impossible without rewriting code from one language to another Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com |5
  • 6. What do we need? What would get people really excited? Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com |6
  • 7. What do we need? How about some of the following: – Writing less code – Using higher level abstractions – Type-safe, declarative UIs – Multi-targeting – Scaling into desktop applications – Scaling into the cloud Tremendous saving on time/effort/maintainability Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com |7
  • 8. Native apps vs Web apps • JavaScript is the IL … – of client-side web applications and is becoming the IL … – of desktop applications: Windows 8 – of mobile applications: Android, WP7, etc. • Some even write the server side in JavaScript Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com |8
  • 9. JavaScript-based mobile applications • So let’s write mobile applications in JavaScript! • Hey, but we have PhoneGap and all, what about that? – Sure, but JavaScript is hard to write, we need: • Type safety • Compile time guarantees • Coding assistance – code completion, API help, etc. – We still have N-1 unfulfilled objectives Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com |9
  • 10. WebSharper • Mature, enterprise-ready framework • Write all your server+client code in F# • Compiles to a complete web application • Interface with any client-side JS library via F# • Powerful abstractions • Automatic resource management • Safe URLs, type-safe URLs • and much-much more… Less code (50-90% less!) Quicker to develop Easier to maintain Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 10
  • 11. WebSharper Mobile • Exposes mobile capabilities to JavaScript • Provides the necessary packaging • Enables quick and seamless multi-targeting • Scales into the cloud Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 11
  • 12. WebSharper extensions A couple dozen available extensions http://websharper.com/extensions Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 12
  • 13. Powerful Abstractions - Sitelets • Type-safe • Composable • First-class Parameterized over a union type: /// Actions that correspond to the different pages in the site. type Action = | Home | Contact | Protected | Login of option<Action> | Logout | Echo of string Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 13
  • 14. WebSharper sitelets Strongly-typed templating, safe URLs let Template title main : Content<Action> = let menu (ctx: Context<Action>)= let (!) action = ctx.Link action |> HRef [ A [!Action.Home] -< [Text "Home"] A [!Action.Contact] -< [Text "Contact"] A [!(Action.Echo "Hello“)] -< [Text "Say Hello"] A ["~/LegacyPage.aspx" |> ctx.ResolveUrl |> HRef] -< [Text "ASPX Page"] ] |> List.map (fun link -> Label [Class "menu-item"] -< [link] ) Templates.Skin.Skin (Some title) { LoginInfo = Widgets.LoginInfo Banner = fun ctx -> [H2 [Text title]] Menu = menu Main = main Sidebar = fun ctx -> [Text "Put your side bar here"] Footer = fun ctx -> [Text “Copyright (c) 2011 YourCompany.com"] } Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 14
  • 15. WebSharper sitelets /// The pages of this website. module Pages = /// A helper function to create a hyperlink let ( => ) title href = A [HRef href] -< [Text title] /// The home page. let HomePage : Content<Action> = Template "Home" <| fun ctx -> [ H1 [Text "Welcome to our site!"] “Contact" => ctx.Link Action.Contact ] ... Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 15
  • 16. WebSharper sitelets – composing 1 // A simple sitelet for the root of the site. let home = Sitelet.Content "/" Action.Home Pages.HomePage Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 16
  • 17. WebSharper sitelets – composing 2 // An automatically inferred sitelet for the basic parts. let basic = Sitelet.Infer <| fun action -> match action with | Action.Contact -> Pages.ContactPage | Action.Echo param -> Pages.EchoPage param | Action.Login action -> Pages.LoginPage action | Action.Logout -> // Logout user and redirect to home UserSession.Logout () Content.Redirect Action.Home | Action.Home -> Content.Redirect Action.Home | Action.Protected -> Content.ServerError Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 17
  • 18. WebSharper sitelets – composing 3 // A sitelet for the protected content. let authenticated = let filter : Sitelet.Filter<Action> = { VerifyUser = fun _ -> true LoginRedirect = Some >> Action.Login } Sitelet.Protect filter <| Sitelet.Content "/protected“ Action.Protected Pages.ProtectedPage Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 18
  • 19. WebSharper sitelets – composing final let EntireSite = // Compose the above sitelets into a larger one. Sitelet.Sum [ home authenticated basic ] Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 19
  • 20. Powerful abstractions - Formlets • Type-safe • Composable • First-class • Dependent formlets – can express dependencies • Flowlets – provide step-by-step layout Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 20
  • 21. WebSharper formlets let TB label msg = Controls.Input "" |> Validator.IsNotEmpty msg |> Enhance.WithValidationIcon |> Enhance.WithTextLabel label Formlet.Yield (fun v1 v2 ... vn -> <compose all vi’s>) <*> formlet1 <*> formlet2 ... <*> formletn Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 21
  • 22. WebSharper formlets type Person = { Name: string; Email: string } [<JavaScript>] let PersonFormlet () : Formlet<Person> = let nameF = TB “Name” “Empy name not allowed” let emailF = TB “Email” “Please enter a valid email address” Formlet.Yield (fun name email -> { Name = name; Email = email }) <*> nameF <*> emailF |> Enhance.WithSubmitAndResetButtons |> Enhance.WithLegend "Add a New Person“ |> Enhance.WithFormContainer Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 22
  • 23. WebSharper formlets And you get: Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 23
  • 24. WebSharper formlet extensions • Available for various UI control set libraries – jQuery UI – Yahoo UI – Ext JS – jQuery Mobile Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 24
  • 25. WebSharper formlet extensions - jQM let loginSequenceF = Formlet.Do { let! username, password, remember = Formlet.Yield (fun user pass remember -> user, pass, remember) <*> (Controls.TextField "" Theme.C "Username: " |> Validator.IsNotEmpty "Username cannot be empty!") <*> (Controls.Password "" Theme.C "Password: " |> Validator.IsRegexMatch "^[1-4]{4,}[0-9]$" "The password is wrong!") <*> Controls.Checkbox true Theme.C "Keep me logged in " |> Enhance.WithSubmitButton "Log in" Theme.C let rememberText = if remember then "" else "not " do! Formlet.OfElement (fun _ -> Div [ H3 [Text ("Welcome " + username + "!")] P [Text ("We will " + rememberText + "keep you logged in.")] ]) } |> Formlet.Flowlet Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 25
  • 26. WebSharper formlet extensions - jQM Div [HTML5.Attr.Data "role" "page"] -< [ Div [HTML5.Attr.Data "role" "header"] -< [ H1 [Text "WebSharper Formlets for jQuery Mobile"]> ] Div [HTML5.Attr.Data "role" "content"] -< [ loginSequenceF ] Div [HTML5.Attr.Data "role" "footer"] -< [ P [Attr.Style "text-align: center;"] -< [Text "IntelliFactory"] ] ] Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 26
  • 27. WebSharper formlet extensions - jQM As you expect: Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 27
  • 28. Other extensions • GIS – Google Maps – Bing Maps • Visualization – Infovis – Protovis – Google Visualization Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 28
  • 29. Other extensions – Google Maps type CurrentLocationControl() = let setMap (map : Bing.Map) = let map = inherit Web.Control() let updateLocation() = Div [] // Gets the current location |>! OnAfterRender (fun this -> let loc = Mobile.GetLocation() // Renders a map control [<JavaScript>] let map = // Sets the label to the current location override this.Body = Rest.RequestLocationByPoint(<<your-bingmaps-key>>, let screenWidth = loc.Lat, loc.Long, ["Address"], Bing.Map(this.Body, MapOptions) JQuery.Of("body").Width() fun result -> map.SetMapType(Bing.MapTypeId.Road) let locInfo = let MapOptions = result.ResourceSets.[0].Resources.[0] setMap map) Bing.MapViewOptions( label.Text <- "You are currently at " + // Returns markup for this control Credentials = bingMapsKey, Div [ JavaScript.Get "name" locInfo) Width = screenWidth - 10, label Height = screenWidth - 10, Br [] // Adds a pushpin at the current location Zoom = 16) map let loc = Bing.Location(loc.Lat, loc.Long) ] :> _ let pin = Bing.Pushpin loc let label = H2 [] map.Entities.Clear() map.Entities.Push pin map.SetView(Bing.ViewOptions(Center = loc)) // Keep updating your location regularly JavaScript.SetInterval updateLocation 1000 |> ignore Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 29
  • 30. Other extensions – Google Maps Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 30
  • 31. Other extensions • HTML5 – WebGL – O3D – GlMatrix Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 31
  • 32. Summary F# + WebSharper gives: • Absolutely huge productivity gain • Access to a growing market opportunity • Quick path to multiple platforms • Scaling to desktop and to the cloud Advocates functional programming to – Use more powerful abstractions – Cut development time – Produce shorter, more maintainable code Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 32
  • 33. Extra FPish.net - “everything functional”: • Events – webcasts, meetups, etc. • Courses • User groups • Conferences • Blogs • Topics – Q&A • Developers • Companies Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com | 33
  • 34. Questions? Find out more at: http://intellifactory.com http://websharper.com http://infoq.com/articles/WebSharper CUFP 2011, Tokyo, Japan - Sep 24, 2011 Copyright © 2004-2011 IntelliFactory Platform-Independent Mobile Applications http://www.intellifactory.com

Notes de l'éditeur

  1. Need more icons: MVC, Linq
  2. Need more icons: MVC, Linq