Created
March 25, 2021 13:09
-
-
Save jkone27/55680bcec6e287738b7f4af6487a97f1 to your computer and use it in GitHub Desktop.
Feliz.ViewEngine in F# aspnetcore MVC and NET5
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//useful links for F# FE stuff | |
//https://github.com/dbrattli/Feliz.ViewEngine | |
//https://dzoukr.github.io/Feliz.Bulma/ | |
//https://github.com/zanaptak/TypedCssClasses | |
//https://www.w3schools.com/css/css_howto.asp | |
open Microsoft.AspNetCore.Mvc | |
open Feliz.ViewEngine | |
open Zanaptak.TypedCssClasses | |
open Microsoft.AspNetCore.Hosting | |
//all this stuff is not needed for in-memory view | |
//[<CLIMutable>] | |
//type ViewModel = { Name: string } | |
//Views/[ControllerName]/[ViewName].cshtml | |
module Constants = | |
[<Literal>] | |
let bootstrapCdn = "https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" | |
// A "Bootstrap" type pointing at a remote Bootstrap CSS file. | |
type Bootstrap = CssClasses<Constants.bootstrapCdn, Naming.PascalCase> | |
[<Route("")>] | |
type ViewController() = | |
inherit Controller() | |
[<Route("")>] | |
[<HttpGet>] | |
member this.Index() = | |
//vs cshtml files... not neeed anymore | |
//this.View({ Name = "hello"}) | |
// NO I/O and strongly typed html !!! | |
// it's functions/expressions so we can refactor HTML as we like! | |
let head = | |
Html.head [ | |
prop.children [ | |
Html.link [ | |
prop.rel "stylesheet" | |
prop.href Constants.bootstrapCdn | |
] | |
] | |
] | |
let header = | |
Html.div [ | |
prop.className Bootstrap.Container | |
prop.children [ | |
Html.h1 [ | |
prop.className [ Bootstrap.ContainerLg ; Bootstrap.H1 ] | |
prop.text "Hello Feliz.ViewEngine from ASPNETCORE" | |
] | |
] | |
] | |
let body = | |
Html.body [ | |
prop.children [ | |
header | |
] | |
] | |
let html = | |
Html.html [ | |
prop.children [ | |
head | |
body | |
] | |
] | |
|> Render.htmlView | |
this.Content(html, "text/html") | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment