We know that it's often useful to have slightly larger demonstration applications to illustrate common patterns, best practices or simply provide confidence and ideas when adopting technologies that may be new to you. As part of that, we created the SAFE Search application - a cloud-native F# web application that contains several moving parts and different technologies. As part of our launch of SAFE Stack 5, we've now upgraded this application to the latest SAFE Stack 5 technologies.
In this post, I wanted to give an overview of the application, the moving parts behind it, and illustrate how this application uses many off-the-shelf Azure and ASP .NET components in conjunction with specific F# technologies.
The SAFE Search app
The SAFE Search application is a tool which monitors UK house price sales, as published by the UK government. It downloads prices and postcode data on a regular basis and stores them in several storage services for archival, search and lookups. It then surfaces that data using free libraries for mapping and data grid views, and allows searching by text as well as postcode, with support for features such as faceted search and geolocation searching.
F# first
The first thing to note is that SAFE Search is an application written in F#. The back-end code is written in F#; Azure integration is written in F#, and makes extensive use of standard Microsoft Azure NuGet packages (written in C#). The client side code is written in F#, transpiled into JavaScript; UI elements are React components, configured in F#. The UI elements make use of the Bulma CSS framework, with an F# wrapper providing typesafe access to specific styles.
ASP Net Core integration
The backend of o SAFE Stack 5 application is at it's most basic just an ASP .NET Core program running on .NET 8, with some extensions to better take advantage of F#'s featureset. In the case of SAFE Search, this means making use of standard ASP .NET Core features, including:
- IConfiguration and App Settings
- Dependency Injection
- Background Services
- Serilog and OTel integration
Client Side features
SAFE Search makes use of popular client side technologies, including JavaScript, CSS frameworks and React components. This includes popular third-party components such as AG Grid, Leaflet Maps and Recharts. All code is still written in F#, making use of the popular Elmish pattern to provide a simple, forward-only immutable UI. The application also makes use of custom React Components to simplify Elmish messaging - a common pattern we see with scaling applications.
The use of Fable means that validation checks can occur on both client and server side - for example, validation of post codes and search text occurs on the client as you type.
Hosted in Azure
SAFE Search is deployed in Azure's App Service on Linux, fully automated through the Farmer project - an F# infrastructure-as-code DSL which generates ARM templates for repeatable deployments. The App Service works seamlessly with ASP .NET and .NET 8, and the Linux version automatically dockerises your application code for you at deployment time.
Platform Services
SAFE Search makes use of multiple platform services, such as Azure Cognitive Search as well as Azure Storage - both Blobs and Tables - for property sales and postcode lookups.
We found Azure Tables to be a simple, scalable and cost-effective solution for a key/value store for postcodes, which shard naturally based on the two elements of a postcode. For example, the postcode N1 1AB maps naturally to Azure Table's Partition Key / Row Key model.
Azure Search contains many powerful features - we use it in this application for fuzzy matching, search suggestions, facets and geo-location search. In addition, it has a useful indexer capability which means that it can automatically ingest CSV files into its search index as they are ingested from the UK government.
Again, all of these services have .NET SDKs and as such can be consumed naturally from F#.
Summary
The SAFE Search app is a good example of what we originally envisaged as a SAFE Stack application, and one that aligns well with CIT's vision too: an application that takes advantage of the benefits of both .NET and the cloud - and in particular, Microsoft Azure - whilst also ensuring that F# developers feel at home across the application stack. I encourage you to look at the source code in more detail - and perhaps even submit pull requests with additional features!
