Add file server to response caching sample

samples/ResponseCachingApp/Program.fs

@@ -3,11 +3,14 @@ open Microsoft.AspNetCore.Builder
 open Microsoft.AspNetCore.Http
 open Microsoft.Extensions.DependencyInjection
 open Microsoft.Extensions.Hosting
+open Microsoft.Extensions.FileProviders
 open Giraffe
 open Giraffe.EndpointRouting
 
+let STATIC_ASSETS_PATH = IO.Path.Combine(__SOURCE_DIRECTORY__, "assets")
+
 let expensiveOperation () : DateTime =
-    let fiveSeconds = 5000 // ms
+    let fiveSeconds = 5_000 // ms
     Threading.Thread.Sleep fiveSeconds
     DateTime.Now
 
@@ -48,9 +51,17 @@ let configureServices (services: IServiceCollection) =
     services.AddRouting().AddResponseCaching().AddGiraffe() |> ignore
 
 let configureApp (appBuilder: IApplicationBuilder) =
+    let fileServerOptions =
+        new FileServerOptions(
+            FileProvider = new PhysicalFileProvider(STATIC_ASSETS_PATH),
+            RequestPath = "/assets",
+            EnableDirectoryBrowsing = false
+        )
+
     appBuilder
         .UseRouting()
         .UseResponseCaching()
+        .UseFileServer(options = fileServerOptions)
         .UseEndpoints(fun e -> e.MapGiraffeEndpoints(endpoints))
         .UseGiraffe(notFoundHandler)
 

samples/ResponseCachingApp/README.md

@@ -4,6 +4,8 @@ The purpose of this sample is to show how one can configure the Giraffe server t
 
 You can find their documentation here: [Giraffe Docs - Response Caching](https://giraffe.wiki/docs#response-caching).
 
++ Update november/2024: Adding a [file server](https://learn.microsoft.com/en-us/aspnet/core/fundamentals/static-files#usefileserver-for-default-documents) feature. You can use it checking the endpoint `http://localhost:5000/assets/main.css` after starting the web server.
+
 ## How to test
 
 First, start the server at the terminal using:

samples/ResponseCachingApp/ResponseCachingApp.fsproj

@@ -9,6 +9,10 @@
     <Compile Include="Program.fs" />
   </ItemGroup>
 
+  <ItemGroup>
+    <Content Include="assets/*" />
+  </ItemGroup>
+
   <ItemGroup>
     <ProjectReference Include="../../src/Giraffe/Giraffe.fsproj" />
   </ItemGroup>

samples/ResponseCachingApp/assets/main.css

@@ -0,0 +1,15 @@
+.tippy-box[data-animation=shift-away-subtle][data-state=hidden] {
+    opacity: 0
+}
+
+.tippy-box[data-animation=shift-away-subtle][data-state=hidden][data-placement^=top] {
+    transform: translateY(5px)
+}
+
+.tippy-box[data-animation=shift-away-subtle][data-state=hidden][data-placement^=bottom] {
+    transform: translateY(-5px)
+}
+
+.tippy-box[data-animation=shift-away-subtle][data-state=hidden][data-placement^=left] {
+    transform: translate(5px)
+}