Skip to content

Commit 0d2c92c

Browse files
Merge pull request #1 from SQL-MisterMagoo/new-detection-method
Swapped to a new method of detecting pre-rendering and included a ser…
2 parents c2c84bb + 6de638c commit 0d2c92c

24 files changed

+221
-193
lines changed

Directory.Build.props

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
<Project>
22
<PropertyGroup>
3-
<BlazorVersion>0.9.0-preview3-19154-02</BlazorVersion>
4-
<ReleaseVersion>0.1.0-beta-1</ReleaseVersion>
3+
<ReleaseVersion>0.2.0-beta-1</ReleaseVersion>
54
</PropertyGroup>
65
</Project>

README.md

+31-11
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,49 @@
11
# PreRenderComponent
22

3-
Provides a CascadingValue exposing whether the app is in PreRendering or not.
3+
Provides a DI Service and/or a CascadingValue exposing whether the app is in PreRendering or not.
44

55
## Usage
66

77
Install the nuget https://nuget.org/packages/PreRenderComponent
88

9-
Add references to Components/_ViewImports.cshtml
9+
### Add the service (Required)
10+
Add the service to your startup Configure method
11+
This component has a dependency on HttpContextAccessor, so also add that.
1012

11-
```
12-
@using PreRenderComponent
13-
@addTagHelper *, PreRenderComponent
13+
``` CSharp
14+
services.AddHttpContextAccessor();
15+
services.AddScoped<IPreRenderFlag,PreRenderFlag>();
1416
```
1517

18+
Consume the service wherever you need it (unless you want to use the Cascading Value component)
19+
``` HTML
20+
@inject PreRenderComponent.IPreRenderFlag PreRenderFlag
21+
@if (PreRenderFlag.IsPreRendering)
22+
{
23+
<h1>Pre-Rendering</h1>
24+
}
25+
```
26+
### Cascading Value (Optional)
1627
Wrap the Router component in PreRenderCascade in the App.razor file
1728

18-
```
19-
<PreRenderCascade>
20-
<Router AppAssembly="typeof(Startup).Assembly" />
21-
</PreRenderCascade>
29+
``` HTML
30+
<PreRenderComponent.PreRenderCascade>
31+
<Router AppAssembly="typeof(App).Assembly">
32+
<Found Context="routeData">
33+
<RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
34+
</Found>
35+
<NotFound>
36+
<LayoutView Layout="@typeof(MainLayout)">
37+
<p>Sorry, there's nothing at this address.</p>
38+
</LayoutView>
39+
</NotFound>
40+
</Router>
41+
</PreRenderComponent.PreRenderCascade>
2242
```
2343

2444
Consume the CascadingValue in your own pages/components
2545

26-
```
46+
``` CSharp
2747
@if (IsPreRendering)
2848
{
2949
<button class="btn btn-dark" onclick="@IncrementCount" disabled>Don't Click me</button>
@@ -34,7 +54,7 @@ else
3454
}
3555

3656

37-
@functions {
57+
@code {
3858
[CascadingParameter(Name = "PreRendering")]
3959
protected bool IsPreRendering { get; set; }
4060
}
+12-7
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,12 @@
1-
@*
2-
The Router component displays whichever component has a @page
3-
directive matching the current URI.
4-
*@
5-
<PreRenderCascade>
6-
<Router AppAssembly="typeof(Startup).Assembly" />
7-
</PreRenderCascade>
1+
<PreRenderComponent.PreRenderCascade>
2+
<Router AppAssembly="typeof(App).Assembly">
3+
<Found Context="routeData">
4+
<RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
5+
</Found>
6+
<NotFound>
7+
<LayoutView Layout="@typeof(MainLayout)">
8+
<p>Sorry, there's nothing at this address.</p>
9+
</LayoutView>
10+
</NotFound>
11+
</Router>
12+
</PreRenderComponent.PreRenderCascade>

samples/PreRenderSample/Components/Pages/Counter.razor

+10-4
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,24 @@
11
@page "/counter"
2-
To see the Pre-Rendering in effect, open the browser dev tools,
3-
set the network speed to slow, then refresh.
2+
<mark>
3+
To see the Pre-Rendering in effect, open the browser dev tools,
4+
set the network speed to slow, then refresh.
5+
</mark>
6+
@if (IsPreRendering)
7+
{
8+
<h1>Pre-Rendering</h1>
9+
}
410

511
<h1>Counter</h1>
612

713
<p>Current count: @currentCount</p>
814

915
@if (IsPreRendering)
1016
{
11-
<button class="btn btn-dark" onclick="@IncrementCount" disabled>Don't Click me</button>
17+
<button class="btn btn-dark" @onclick="IncrementCount" disabled>Don't Click me</button>
1218
}
1319
else
1420
{
15-
<button class="btn btn-primary" onclick="@IncrementCount">Click me</button>
21+
<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
1622
}
1723

1824
@functions {

samples/PreRenderSample/Components/Pages/FetchData.razor

+13-4
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,15 @@
11
@page "/fetchdata"
22
@using PreRenderSample.Services
3-
@inject WeatherForecastService ForecastService
3+
@inject PreRenderComponent.IPreRenderFlag PreRenderFlag
4+
@inject IWeatherForecastService ForecastService
5+
<mark>
6+
To see the Pre-Rendering in effect, open the browser dev tools,
7+
set the network speed to slow, then refresh.
8+
</mark>
9+
@if (PreRenderFlag.IsPreRendering)
10+
{
11+
<h1>Pre-Rendering</h1>
12+
}
413

514
<h1>Weather forecast</h1>
615

@@ -34,11 +43,11 @@ else
3443
</tbody>
3544
</table>
3645
}
37-
38-
@functions {
46+
@code
47+
{
3948
WeatherForecast[] forecasts;
4049

41-
protected override async Task OnInitAsync()
50+
protected override async Task OnInitializedAsync()
4251
{
4352
forecasts = await ForecastService.GetForecastAsync(DateTime.Now);
4453
}
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,24 @@
11
@page "/"
2+
<mark>
3+
To see the Pre-Rendering in effect, open the browser dev tools,
4+
set the network speed to slow, then refresh.
5+
Also check out the Counter page and Weather forecast for other examples.
6+
</mark>
7+
@if (IsPreRendering)
8+
{
9+
<h1>Pre-Rendering</h1>
10+
}
211

312
<h1>Hello, world!</h1>
413

514
Welcome to your new app.
615

7-
To see the Pre-Rendering in effect, open the browser dev tools and set the network speed to slow, then refresh.
816

9-
Also check out the Counter page for another example.
1017

1118
@if (IsPreRendering)
1219
{
13-
<h2>Warming up the engine...</h2>
20+
<h2>Warming up the engine...</h2>
1421
}
1522
@functions {
16-
[CascadingParameter(Name = "PreRendering")] protected bool IsPreRendering { get; set; }
23+
[CascadingParameter(Name = "PreRendering")] protected bool IsPreRendering { get; set; }
1724
}

samples/PreRenderSample/Components/Shared/NavMenu.razor

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
<div class="top-row pl-4 navbar navbar-dark">
22
<a class="navbar-brand" href="">PreRenderSample</a>
3-
<button class="navbar-toggler" onclick="@ToggleNavMenu">
3+
<button class="navbar-toggler" @onclick="ToggleNavMenu">
44
<span class="navbar-toggler-icon"></span>
55
</button>
66
</div>
77

8-
<div class="@NavMenuCssClass" onclick="@ToggleNavMenu">
8+
<div class="@NavMenuCssClass" @onclick="ToggleNavMenu">
99
<ul class="nav flex-column">
1010
<li class="nav-item px-3">
1111
<NavLink class="nav-link" href="" Match="NavLinkMatch.All">
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
@using System.Net.Http
22
@using Microsoft.AspNetCore.Components.Forms
3-
@using Microsoft.AspNetCore.Components.Layouts
3+
@using Microsoft.AspNetCore.Components.Web
44
@using Microsoft.AspNetCore.Components.Routing
55
@using Microsoft.JSInterop
66
@using PreRenderSample.Components.Shared
7-
@using PreRenderComponent
8-
@addTagHelper *, PreRenderComponent

samples/PreRenderSample/Pages/Index.cshtml samples/PreRenderSample/Pages/_Host.cshtml

+21-5
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
1-
@page "{*clientPath}"
1+
@page "/"
2+
@namespace PreRenderSample.Pages
3+
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
4+
25
<!DOCTYPE html>
3-
<html>
6+
<html lang="en">
47
<head>
58
<meta charset="utf-8" />
69
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
@@ -14,13 +17,26 @@
1417
asp-fallback-href="css/bootstrap/bootstrap.min.css"
1518
asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute"
1619
crossorigin="anonymous"
17-
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"/>
20+
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" />
1821
</environment>
1922
<link href="css/site.css" rel="stylesheet" />
2023
</head>
2124
<body>
22-
<app>@(await Html.RenderComponentAsync<App>())</app>
25+
<app>
26+
<component type="typeof(PreRenderSample.Components.App)" render-mode="ServerPrerendered" />
27+
</app>
28+
29+
<div id="blazor-error-ui">
30+
<environment include="Staging,Production">
31+
An error has occurred. This application may no longer respond until reloaded.
32+
</environment>
33+
<environment include="Development">
34+
An unhandled exception has occurred. See browser dev tools for details.
35+
</environment>
36+
<a href class="reload">Reload</a>
37+
<a class="dismiss">🗙</a>
38+
</div>
2339

24-
<script src="_framework/components.server.js"></script>
40+
<script src="_framework/blazor.server.js"></script>
2541
</body>
2642
</html>
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
@using PreRenderSample.Components

samples/PreRenderSample/Pages/_ViewImports.cshtml

-3
This file was deleted.

samples/PreRenderSample/PreRenderSample.csproj

+3-9
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,10 @@
1-
<Project Sdk="Microsoft.NET.Sdk.Web">
1+
<Project Sdk="Microsoft.NET.Sdk.Web">
22

33
<PropertyGroup>
4-
<TargetFramework>netcoreapp3.0</TargetFramework>
5-
<LangVersion>7.3</LangVersion>
6-
<_RazorComponentInclude>Components\**\*.cshtml</_RazorComponentInclude>
4+
<TargetFramework>netcoreapp3.1</TargetFramework>
5+
<LangVersion>latest</LangVersion>
76
</PropertyGroup>
87

9-
<ItemGroup>
10-
<PackageReference Include="Microsoft.AspNetCore.Components.Server" Version="3.0.0-preview3-19153-02" />
11-
<PackageReference Include="Microsoft.AspNetCore.Mvc.NewtonsoftJson" Version="3.0.0-preview3-19153-02" />
12-
</ItemGroup>
13-
148
<ItemGroup>
159
<ProjectReference Include="..\..\src\PreRenderComponent\PreRenderComponent.csproj" />
1610
</ItemGroup>

samples/PreRenderSample/Program.cs

+12-20
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,20 @@
1-
using System;
2-
using System.Collections.Generic;
3-
using System.IO;
4-
using System.Linq;
5-
using System.Threading.Tasks;
6-
using Microsoft.AspNetCore;
71
using Microsoft.AspNetCore.Hosting;
8-
using Microsoft.Extensions.Configuration;
92
using Microsoft.Extensions.Hosting;
10-
using Microsoft.Extensions.Logging;
113

124
namespace PreRenderSample
135
{
14-
public class Program
6+
public class Program
157
{
16-
public static void Main(string[] args)
17-
{
18-
CreateHostBuilder(args).Build().Run();
19-
}
8+
public static void Main(string[] args)
9+
{
10+
CreateHostBuilder(args).Build().Run();
11+
}
2012

21-
public static IHostBuilder CreateHostBuilder(string[] args) =>
22-
Host.CreateDefaultBuilder(args)
23-
.ConfigureWebHostDefaults(webBuilder =>
24-
{
25-
webBuilder.UseStartup<Startup>();
26-
});
27-
}
13+
public static IHostBuilder CreateHostBuilder(string[] args) =>
14+
Host.CreateDefaultBuilder(args)
15+
.ConfigureWebHostDefaults(webBuilder =>
16+
{
17+
webBuilder.UseStartup<Startup>();
18+
});
19+
}
2820
}

samples/PreRenderSample/Properties/launchSettings.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
"PreRenderSample": {
1919
"commandName": "Project",
2020
"launchBrowser": true,
21-
"applicationUrl": "http://localhost:5000;https://localhost:5000",
21+
"applicationUrl": "http://localhost:5001;https://localhost:5002",
2222
"environmentVariables": {
2323
"ASPNETCORE_ENVIRONMENT": "Development"
2424
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
using System;
2+
using System.Threading.Tasks;
3+
4+
namespace PreRenderSample.Services
5+
{
6+
public interface IWeatherForecastService
7+
{
8+
9+
Task<WeatherForecast[]> GetForecastAsync(DateTime startDate);
10+
}
11+
}

samples/PreRenderSample/Services/WeatherForecast.cs

+7-7
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,14 @@
22

33
namespace PreRenderSample.Services
44
{
5-
public class WeatherForecast
6-
{
7-
public DateTime Date { get; set; }
5+
public class WeatherForecast
6+
{
7+
public DateTime Date { get; set; }
88

9-
public int TemperatureC { get; set; }
9+
public int TemperatureC { get; set; }
1010

11-
public int TemperatureF { get; set; }
11+
public int TemperatureF { get; set; }
1212

13-
public string Summary { get; set; }
14-
}
13+
public string Summary { get; set; }
14+
}
1515
}

0 commit comments

Comments
 (0)