docs: recommend using using static Htmxor.Constants in getting starte…

…d guide
egil · May 5, 2024 · 8f47657 · 8f47657
1 parent 66d183c
commit 8f47657
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 24 deletions.
diff --git a/README.md b/README.md
@@ -1,7 +1,7 @@
 # Htmxor - supercharging Blazor Static SSR with Htmx
 ![Htmxor logo](https://github.com/egil/Htmxor/blob/main/docs/htmxor-x.svg)
 
-This packages enables Blazor Static SSR (.NET 8 and later) to be used seamlessly with Htmx. 
+This packages enables Blazor Static SSR (.NET 8 and later) to be used seamlessly with Htmx.
 
 Blazor Static SSR comes with basic interactivity via enhanced navigation and enhanced form handling.
 Adding Htmx (htmx.org) to the mix gives you access to another level of interactivity while still
@@ -23,4 +23,5 @@ The following Blazor Web Apps (Htmxor) are used to test Htmxor and demo the capa
 
 - **[Getting Started](https://github.com/egil/Htmxor/blob/main/docs/getting-started.md)** - how to create a new Htmxor/Blazor project.
 - **[Routing in Htmxor](https://github.com/egil/Htmxor/blob/main/docs/routing.md)** - there are two types of routing in Htmxor, standard and direct.
+- **[Routing in Htmxor](https://github.com/egil/Htmxor/blob/main/docs/routing.md)** - there are two types of routing in Htmxor, standard and direct.
 
diff --git a/docs/getting-started.md b/docs/getting-started.md
@@ -5,7 +5,7 @@ To create a minimal Blazor + htmx app with various examples, download the [Minim
 To start fresh, follow these steps:
 
 1. **Add the Htmxor Package**
-   
+
    Install the [Htmxor package from NuGet](https://www.nuget.org/packages/Htmxor).
 
 
@@ -15,41 +15,41 @@ To start fresh, follow these steps:
 
 	```diff
 	  var builder = WebApplication.CreateBuilder(args);
-	  
+
 	  // Add services to the container.
 	  builder.Services
 	  	.AddRazorComponents()
 	+   .AddHtmx();
-	  
+
 	  var app = builder.Build();
-	  
+
 	  // Configure the HTTP request pipeline.
 	  if (!app.Environment.IsDevelopment())
 	  {
 	  	app.UseExceptionHandler("/Error", createScopeForErrors: true);
 	  	app.UseHsts();
 	  }
-	  
+
 	  app.UseHttpsRedirection();
-	  
+
 	  app.UseStaticFiles();
 	  app.UseAntiforgery();
 	+ app.UseHtmxAntiforgery();
 	  app.MapRazorComponents<App>()
 	+    .AddHtmxorComponentEndpoints(app);
-	  
+
 	  app.Run();
 	```
 	Note: You can use `AddHtmx(options => { ... })` to change [htmx's config](https://htmx.org/reference/#config) for your app.
 
-3. **Update App.razor**  
-   
+3. **Update App.razor**
+
    Modify `App.razor` to include Htmxor components:
 
 	```diff
 	  <!DOCTYPE html>
 	  <html lang="en">
-	  
+
 	  <head>
 	  	<meta charset="utf-8" />
 	  	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
@@ -61,33 +61,33 @@ To start fresh, follow these steps:
 	+   <HtmxHeadOutlet />
 	  	<HeadOutlet />
 	  </head>
-	  
-	  <!-- 
-	    Adding hx-boost="true" is optional. 
-	    Learn more here: https://htmx.org/  attributes/hx-boost/ 
+
+	  <!--
+	    Adding hx-boost="true" is optional.
+	    Learn more here: https://htmx.org/  attributes/hx-boost/
 	  -->
 	+ <body hx-boost="true">
 	  	<Routes />
-  
+
 	-   <script src="_framework/blazor.web.js"></script>
 	  </body>
-	  
+
 	  </html>
 	```
 
 4. **Create an Optional Direct Request Layout**
-   
+
    Optionally, create a layout that will be used during [direct routing](routing.md#direct-routing), e.g., `/Components/Layout/HtmxorLayout.razor`:
 
 	```razor
 	@inherits HtmxLayoutComponentBase
 	@Body
 	```
 
-	The `HtmxLayoutComponentBase` includes the `<HeadOutlet>` component. This makes it possible to use the `<PageTitle>` component during htmx requests to update the page title. 
+	The `HtmxLayoutComponentBase` includes the `<HeadOutlet>` component. This makes it possible to use the `<PageTitle>` component during htmx requests to update the page title.
 
 5. **Update _Imports.razor (Optional)**
-   
+
    Modify _Imports.razor to include Htmxor namespaces and set a default layout:
 
 	```diff
@@ -102,7 +102,8 @@ To start fresh, follow these steps:
 	+ @using Htmxor.Components
 	+ @using Htmxor.Http
 	+ @using Htmxor
-
+	+ @using static Htmxor.Constants
+
 	+ @attribute [HtmxLayout(typeof(HtmxorLayout))]
 	```
 

diff --git a/samples/MinimalHtmxorApp/Components/_Imports.razor b/samples/MinimalHtmxorApp/Components/_Imports.razor
@@ -1,4 +1,4 @@
-@using System.Net.Http
+@using System.Net.Http
 @using System.Net.Http.Json
 @using Microsoft.AspNetCore.Components.Forms
 @using Microsoft.AspNetCore.Components.Routing
@@ -12,5 +12,5 @@
 @using Htmxor.Components
 @using Htmxor.Http
 @using Htmxor
-
-@attribute [HtmxLayout(typeof(HtmxorLayout))]
+@using static Htmxor.Constants
+@attribute [HtmxLayout(typeof(HtmxorLayout))]