使用SAFE栈进行F# Web开发

看新闻很累？看技术新闻更累？试试 下载InfoQ手机客户端 ，每天上下班路上听新闻，有趣还有料！

SAFE栈是一套可以用来构建Web应用程序的F#库。近日，Tomasz Heimowski在 F# eXchange 2018大会 的一个现场编码环节中介绍了这个栈。他在演讲中说明了创建和部署一个评估应用程序的全部过程。

SAFE栈包括：

• Suave，一个独立Web服务器库
• Azure
• Fable，一个F#到Javascript的转译器
• Elmish，一个受Elm启发的UI库

开发依赖于.NET SDK 2.0和Nodejs。运行应用程序只需要.NET Core。开始的时候，有一个模板可以用来创建一个基础的应用程序。该应用程序包含示例代码和构建文件。

dotnet new -i SAFE.Template
dotnet new SAFE
build run

Fable.Elmish提供了面向HTML元素的F#绑定。HTML元素是用F#构建的，可以在编写元素定义时设置事件处理器。

let submit (model : Model) (dispatch : Msg -> unit) =
Button.aFa
[ Button.Color IsPrimary
Button.IsFullwidth
Button.OnClick (fun _ -> dispatch Submit)
Button.IsLoading model.Loading ]
[ str "Submit" ]

SAFE模板还 包含webpack用于热加载 。Webpack是一个客户端模块打包器。SAFE栈感兴趣的webpack特性是“模块热替换（Hot Module Replacement）”，让应用程序可以替换应用程序的某些部分而不丢失状态。

Fable.Remoting提供了一种在客户端和服务器之间共享接口的方式。它处理在客户端和服务器端的序列化和反序列化。对象定义和服务接口位于一个不同的库中，客户端和服务器端都引用了这个库。

// 定义服务的接口
type IVotingProtocol =
  { getResults : unit -> Async<VotingResults>
  addVote : Vote -> Async<VotingResults> }

// 客户端代码使用的类型化服务定义
let api : IVotingProtocol =
  Proxy.createWithBuilder<IVotingProtocol> Route.builder

在服务器端，接口实现是使用面向Suave的Fable.Remoting辅助程序在服务器库中接入的。

let init : WebPart =
let votingProcotol : IVotingProtocol =
  { getResults = getResults
  addVote = addVote }

// 针对特定实现创建一个WebPart
FableSuaveAdapter.webPartWithBuilderFor votingProcotol Route.builder

在演讲结束时，应用程序部署到了Azure上。SAFE模板并没有直接与云提供商集成。相反，可以创建一个 Docker 镜像，然后部署到云提供商，在这个例子中是Azure容器。

GitHub提供了有关 SAFE栈 的文档和代码样例。

查看英文原文： F# Web Development With the SAFE Stack