All Projects → nutshellit → Blazor-Survey

nutshellit / Blazor-Survey

Licence: other
A hybrid F#/C# blazor sample app to kick the tyres of blazor.

Programming Languages

F#
602 projects
C#
18002 projects
CSS
56736 projects

Labels

Projects that are alternatives of or similar to Blazor-Survey

BlazorAndTailwind
Tips and notes about Blazor and Tailwind
Stars: ✭ 27 (+68.75%)
Mutual labels:  blazor
Try
Try .NET provides developers and content authors with tools to create interactive experiences.
Stars: ✭ 2,271 (+14093.75%)
Mutual labels:  blazor
blazor-docs
Public Documentation for Telerik UI for Blazor components.
Stars: ✭ 42 (+162.5%)
Mutual labels:  blazor
iridiumlive
web visualizer for gr-iridium frames
Stars: ✭ 36 (+125%)
Mutual labels:  blazor
Awesome Blazor
Resources for Blazor, a .NET web framework using C#/Razor and HTML that runs in the browser with WebAssembly.
Stars: ✭ 6,063 (+37793.75%)
Mutual labels:  blazor
Chromely
Build HTML Desktop Apps on .NET/.NET Core/.NET 5 using native GUI, HTML5, JavaScript, CSS
Stars: ✭ 2,728 (+16950%)
Mutual labels:  blazor
RoleBasedAuthWithBlazor
Companion code sample for my blog post - Configuring Role-based Authorization with client-side Blazor
Stars: ✭ 22 (+37.5%)
Mutual labels:  blazor
AsteroidsWasm
Collection of applications based on a single C# .NET Standard project running in: Blazor Client (WebAssembly), Blazor Server, Electron, WPF, WinForms, Xamarin
Stars: ✭ 136 (+750%)
Mutual labels:  blazor
Blazorise
Blazorise is a component library built on top of Blazor with support for CSS frameworks like Bootstrap, Bulma, AntDesign, and Material.
Stars: ✭ 2,103 (+13043.75%)
Mutual labels:  blazor
Blazor-CRUD
Simple CRUD application using C#/Blazor
Stars: ✭ 25 (+56.25%)
Mutual labels:  blazor
blazor-ui-messages
Localization messages for Telerik UI for Blazor components: https://www.telerik.com/blazor-ui
Stars: ✭ 24 (+50%)
Mutual labels:  blazor
Ant Design Blazor
🌈A set of enterprise-class UI components based on Ant Design and Blazor WebAssembly.
Stars: ✭ 3,890 (+24212.5%)
Mutual labels:  blazor
rpirobot
A Raspberry Pi Robot Arm using .NET 5
Stars: ✭ 24 (+50%)
Mutual labels:  blazor
BlazorMonaco
Blazor component for Microsoft's Monaco Editor which powers Visual Studio Code.
Stars: ✭ 151 (+843.75%)
Mutual labels:  blazor
bUnit
bUnit is a testing library for Blazor components that make tests look, feel, and runs like regular unit tests. bUnit makes it easy to render and control a component under test’s life-cycle, pass parameter and inject services into it, trigger event handlers, and verify the rendered markup from the component using a built-in semantic HTML comparer.
Stars: ✭ 857 (+5256.25%)
Mutual labels:  blazor
blazor-tailwindcss-template
This template demostrates the integration of tailwindcss with blazor and covers important features like hot-reload and css isolation
Stars: ✭ 38 (+137.5%)
Mutual labels:  blazor
Matblazor
Material Design components for Blazor and Razor Components
Stars: ✭ 2,599 (+16143.75%)
Mutual labels:  blazor
AspNetCore6Experiments
ASP.NET Core Blazor BFF with Azure AD and Razor page
Stars: ✭ 43 (+168.75%)
Mutual labels:  blazor
SdvCodeWebsite
Simeon Valev - Personal Blog - Developed on ASP.NET Core MVC - Server-Side Blazor - See README.md file for more information
Stars: ✭ 38 (+137.5%)
Mutual labels:  blazor
memealyzer
Memealyzer is an app built to demonstrate some the latest and greatest Azure tech to dev, debug, and deploy microservice applications.
Stars: ✭ 97 (+506.25%)
Mutual labels:  blazor

Blazor-Survey

A hybrid F#/C# blazor sample app to kick the tyres of blazor.

I wanted to see how I could mix up F# and C# in a sample Blazor app, F# on the server, C# on the client but be able to make calls into shared F# code on the client. I have found that when building backend services in F# one often has to work with frontend developers that only work in C#/Javascript so one has to deal with where C# world meets the F# world. This is what I built as a first attempt at hacking around in Blazor and hopefully it is of some interest to someoue out there.

  • The biggest issue that I encountered was the deserialisation of FSharp records on blazor. As I understand Blazor comes with a library called SimpleJson which does not deserialise f# record or union types.
    • One way to solve this is by using f# classes rather than records for dtoing between client and api.
    • I was able to serialise simple f# command records on blazor and send to api endpoint.
  • Client side there is no problem calling into and consuming F# types from Blazor C# so one can pack as much F# magic into a Blazor app as required.

Survey functionality

You can setup a Survey definition with sections and 4 types of questions within those sections. Once you make the survey definition live you can add one or more survey responses based on survey definition. Clearly in a real world app you would do survey admin in one place and survey responses in another but this app is just to evaluate what is possible in Blazor.
Please forgive brutal css design, send me a PR if you can improve.

Main Screen

Main Screen

Survey Definition Screen

Survey Definition

Survey Response

Edit Question Response Response overview

Build and Run

From the root directory you can run buildseedrun.bat and it should build, seed the app and run. You can also run from visual studio. If you have not run Blazor on your system before then head over here to Blazor site get started

Technologies used

  • Client side
    • Blazor in c# but making calls to shared F# library
  • Server side
    • Asp.Net core api endpoint in F#
    • Sqlite for storage
    • Chessie for validation ROP
    • Expecto for testing - (not very many tests, but was good to drive out the initial Survey Definition model)

See also

  • Trail if you want to go all in with F# on Blazor
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].