Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
  • Loading branch information
NielsPilgaard committed May 26, 2023
2 parents 88f3f39 + dd05176 commit 9823497
Show file tree
Hide file tree
Showing 13 changed files with 168 additions and 37 deletions.
7 changes: 5 additions & 2 deletions src/Pilgaard.Blog/Features/BlogPost/BlogPost.cs
Original file line number Diff line number Diff line change
Expand Up @@ -5,22 +5,25 @@ public class BlogPost
public BlogPost(string title,
string description,
string pathName,
DateOnly publishDate,
DateTimeOffset publishDate,
DateTimeOffset lastUpdated,
int numberInSeries = 1,
params string[] tags)
{
Title = title;
Description = description;
PathName = pathName;
PublishDate = publishDate;
LastUpdated = lastUpdated;
NumberInSeries = numberInSeries;
Tags = tags;
}

public string Title { get; }
public string Description { get; }
public string PathName { get; }
public DateOnly PublishDate { get; }
public DateTimeOffset PublishDate { get; }
public DateTimeOffset LastUpdated { get; }
public int NumberInSeries { get; }
public string[] Tags { get; }
}
62 changes: 33 additions & 29 deletions src/Pilgaard.Blog/Features/BlogPost/BlogPostData.cs
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
namespace Pilgaard.Blog.Features.BlogPost;
using Pilgaard.Blog.Features.Feed;

namespace Pilgaard.Blog.Features.BlogPost;

public static class BlogPostData
{
Expand All @@ -12,70 +14,72 @@ public static class BlogPostData
new(title: "Planning",
description: "In this post, we layout the plan for making a blog.",
pathName: "1-planning",
publishDate: new DateOnly(year: 2022, month: 10, day: 9),
publishDate: new DateOnly(year: 2022, month: 10, day: 9).ToDateTimeOffset(),
lastUpdated: new DateOnly(year: 2022, month: 10, day: 9).ToDateTimeOffset(),
numberInSeries: 1,
"planning"),
new(title: "Hosting on Azure",
description: "In this post, we look at how to host Blazor Server, and where to host it.",
pathName: "2-hosting",
publishDate: new DateOnly(year: 2022, month: 10, day: 9),
publishDate: new DateOnly(year: 2022, month: 10, day: 9).ToDateTimeOffset(),
lastUpdated: new DateOnly(year: 2022, month: 10, day: 9).ToDateTimeOffset(),
numberInSeries: 2,
"hosting", "azure"),
new(title: "Building the MVP",
description: "In this post, we build the blog MVP, and go live!",
pathName: "3-building-the-mvp",
publishDate: new DateOnly(year: 2022, month: 10, day: 9),
publishDate: new DateOnly(year: 2022, month: 10, day: 9).ToDateTimeOffset(),
lastUpdated: new DateOnly(year: 2022, month: 10, day: 9).ToDateTimeOffset(),
numberInSeries: 3,
"prismjs",
"seo"),
"prismjs", "seo"),
new(title: "Improving Appearances",
description: "In this post, we make the blog nicer to look at. I hope.",
pathName: "4-improving-appearances",
publishDate: new DateOnly(year: 2022, month: 10, day: 19),
publishDate: new DateOnly(year: 2022, month: 10, day: 19).ToDateTimeOffset(),
lastUpdated: new DateOnly(year: 2022, month: 10, day: 19).ToDateTimeOffset(),
numberInSeries: 4,
"mudblazor",
"css",
"html"),
"mudblazor", "css", "html"),
new(title: "Adding Comments",
description: "In this post, we add a comment section to each blog post.",
pathName: "5-adding-comments",
publishDate: new DateOnly(year: 2022,
month: 10,
day: 22),
publishDate : new DateOnly(year: 2022, month: 10, day: 22).ToDateTimeOffset(),
lastUpdated : new DateOnly(year: 2022, month: 10, day: 22).ToDateTimeOffset(),
numberInSeries: 5,
"giscus",
"github"),
"giscus", "github"),
new(title: "SEO",
description: "In this post, we add Search Engine Optimizations to make the blog easier to find.",
pathName: "6-seo",
publishDate: new DateOnly(year: 2022,
month: 10,
day: 22),
publishDate: new DateOnly(year: 2022, month: 10, day: 22).ToDateTimeOffset(),
lastUpdated: new DateOnly(year: 2022, month: 10, day: 22).ToDateTimeOffset(),
numberInSeries: 6,
"seo"),
new (title: "Blogpost Navigation",
description: "In this post, we add buttons to make navigating between related posts fast and easy.",
pathName: "7-blogpost-navigation",
publishDate: new DateOnly(2023,
3,
9),
numberInSeries: 7,
publishDate: new DateOnly(year: 2023, month: 3, day: 9).ToDateTimeOffset(),
lastUpdated: new DateOnly(year: 2023, month: 3, day: 9).ToDateTimeOffset(),
numberInSeries: 7,
"mudblazor"),
new (title: "System Theme",
description: "In this post, we update theme loading to watch for changes in the system dark-mode preference.",
pathName: "8-system-theme",
publishDate: new DateOnly(2023,
3,
16),
publishDate : new DateOnly(year: 2023, month: 3, day: 16).ToDateTimeOffset(),
lastUpdated : new DateOnly(year: 2023, month: 3, day: 16).ToDateTimeOffset(),
numberInSeries: 8,
"mudblazor", "theme"),
//new (title: "RSS Feed",
// description: "In this post, we add an RSS/Atom Feed to the blog to allow polling for changes.",
// pathName: "9-rss-feed",
// publishDate: new DateOnly(year: 2023, month: 3, day: 20).ToDateTimeOffset(),
// lastUpdated: new DateOnly(year: 2023, month: 3, day: 20).ToDateTimeOffset(),
// numberInSeries: 9,
// "rss", "atom", "xml"),
//new (title: "",
// description: "",
// pathName: "",
// publishDate: new DateOnly(202´3,
// 3,
// 5),
// numberInSeries: 8,
// publishDate: new DateOnly(year: 2023, month: 3, day: 20).ToDateTimeOffset(),
// lastUpdated: new DateOnly(year: 2023, month: 3, day: 20).ToDateTimeOffset(),
// numberInSeries: 10,
// ""),
}, "blazor", "dotnet");

Expand Down
7 changes: 7 additions & 0 deletions src/Pilgaard.Blog/Features/Feed/DateOnlyExtensions.cs
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
namespace Pilgaard.Blog.Features.Feed;

public static class DateOnlyExtensions
{
public static DateTimeOffset ToDateTimeOffset(this DateOnly dateOnly)
=> new(dateOnly.ToDateTime(new TimeOnly(0, 0, 0)));
}
72 changes: 72 additions & 0 deletions src/Pilgaard.Blog/Features/Feed/FeedApi.cs
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
using Microsoft.SyndicationFeed;
using System.Xml;
using Microsoft.SyndicationFeed.Atom;
using Pilgaard.Blog.Features.BlogPost;
using Pilgaard.Blog.Features.SEO;

namespace Pilgaard.Blog.Features.Feed;

public static class FeedApi
{
public static WebApplication MapRssFeed(this WebApplication app)
{
app.MapGet("/feed.xml", async (HttpContext context) =>
{
context.Response.ContentType = "application/xml";
var stringWriter = new Utf8StringWriter();
await using var xmlWriter = XmlWriter.Create(stringWriter, new XmlWriterSettings
{
Async = true,
Indent = true
});
var writer = new AtomFeedWriter(xmlWriter);
await writer.WriteTitle(DefaultMetadata.Title);
var lastUpdated = BlogPostData
.AllBlogPostSeries
.SelectMany(blogPostSeries => blogPostSeries.BlogPosts.Select(blogPost => blogPost.LastUpdated))
.Max();
await writer.WriteUpdated(lastUpdated);
await writer.Write(new SyndicationLink(new Uri(FeedConstants.BlogUrl)));
foreach (var blogPostSeries in BlogPostData.AllBlogPostSeries)
{
foreach (var blogPost in blogPostSeries.BlogPosts)
{
var link = $"{FeedConstants.BlogUrl}/{blogPostSeries.GetRelativePath(blogPost)}";
var item = new SyndicationItem
{
Id = link,
Title = blogPost.Title,
Description = blogPost.Description,
Published = blogPost.PublishDate,
LastUpdated = blogPost.LastUpdated,
};
item.AddLink(new SyndicationLink(new Uri(link)));
item.AddContributor(new SyndicationPerson("Niels Pilgaard Grøndahl", "[email protected]"));
foreach (var blogPostTag in blogPost.Tags)
{
item.AddCategory(new SyndicationCategory(blogPostTag));
}
await writer.Write(item);
}
}
// This closes the <content> element
await xmlWriter.WriteEndElementAsync();
await xmlWriter.FlushAsync();
return stringWriter.ToString();
});

return app;
}
}
6 changes: 6 additions & 0 deletions src/Pilgaard.Blog/Features/Feed/FeedConstants.cs
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
namespace Pilgaard.Blog.Features.Feed;

internal static class FeedConstants
{
internal const string BlogUrl = "https://pilgaard-blog.azurewebsites.net";
}
8 changes: 8 additions & 0 deletions src/Pilgaard.Blog/Features/Feed/Utf8StringWriter.cs
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
using System.Text;

namespace Pilgaard.Blog.Features.Feed;

internal sealed class Utf8StringWriter : StringWriter
{
public override Encoding Encoding => Encoding.UTF8;
}
2 changes: 1 addition & 1 deletion src/Pilgaard.Blog/Features/SEO/MetadataComponent.razor
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<meta name="og:title" content="@Title" />
<meta name="og:description" content="@Description" />

@if (Tags is not null)
@if (!string.IsNullOrEmpty(Tags))
{
<meta name="tags" content="@Tags" />
}
Expand Down
15 changes: 15 additions & 0 deletions src/Pilgaard.Blog/Pages/posts/making-a-blog/9-rss-feed.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
Making an RSS feed is (apparently) fairly

## Summary

We learned how to use MudBlazor to keep dark/light mode settings in sync with system preference.

Thank you [TDroogers](https://github.com/TDroogers) for [adding this feature to MudBlazor](https://github.com/MudBlazor/MudBlazor/pull/6320)!

### See the code

[Pull Request implementing the changes in this post](https://github.com/NielsPilgaard/Pilgaard.Blog/pull/29)

### The state of the blog

![State of the blog](https://user-images.githubusercontent.com/21295394/224152139-cd53b1a6-a89f-4b85-b10a-4beae4b83a22.png)
6 changes: 6 additions & 0 deletions src/Pilgaard.Blog/Pilgaard.Blog.csproj
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@
<None Remove="Pages\posts\making-a-blog\6-seo.md" />
<None Remove="Pages\posts\making-a-blog\7-blogpost-navigation.md" />
<None Remove="Pages\posts\making-a-blog\8-system-theme.md" />
<None Remove="Pages\posts\making-a-blog\9-rss-feed.md" />
</ItemGroup>

<ItemGroup>
Expand All @@ -31,6 +32,9 @@
<Content Include="Pages\posts\making-a-blog\4-improving-appearances.md">
<CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
</Content>
<Content Include="Pages\posts\making-a-blog\9-rss-feed.md">
<CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
</Content>
<Content Include="Pages\posts\making-a-blog\8-system-theme.md">
<CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
</Content>
Expand All @@ -48,6 +52,8 @@
<ItemGroup>
<PackageReference Include="GiscusBlazor" Version="2.3.1" />
<PackageReference Include="Markdig" Version="0.31.0" />
<PackageReference Include="Microsoft.IO.RecyclableMemoryStream" Version="2.3.2" />
<PackageReference Include="Microsoft.SyndicationFeed.ReaderWriter" Version="1.0.2" />
<PackageReference Include="Microsoft.Azure.SignalR" Version="1.21.3" />
<PackageReference Include="MudBlazor" Version="6.3.0" />
</ItemGroup>
Expand Down
3 changes: 3 additions & 0 deletions src/Pilgaard.Blog/Program.cs
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
using Microsoft.Azure.SignalR;
using MudBlazor.Services;
using Pilgaard.Blog.Features.Feed;
using Pilgaard.Blog.Shared;

var builder = WebApplication.CreateBuilder(args);
Expand Down Expand Up @@ -41,5 +42,7 @@ static WebApplication ConfigureRequestPipeline(WebApplication app)
app.MapBlazorHub();
app.MapFallbackToPage("/_Host");

app.MapRssFeed();

return app;
}
2 changes: 1 addition & 1 deletion src/Pilgaard.Blog/Shared/AppBar.razor
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<MudAppBar Fixed="false" Elevation="5" Style="@($"background: linear-gradient(90deg, {Colors.Teal.Darken2} 0%, {Colors.Teal.Darken3} 35%);")">
<MudButton Color="Color.Inherit" Href="/">
<MudButton Color="Color.Inherit" Class="pa-0" Href="/">
<MudText Typo="Typo.h3" Class="logo-text">PILGAARD</MudText><MudText Typo="Typo.h6" Class="ml-2 d-none d-sm-flex">dotnet blog</MudText>
</MudButton>
<MudSpacer />
Expand Down
15 changes: 11 additions & 4 deletions src/Pilgaard.Blog/wwwroot/css/site.css
Original file line number Diff line number Diff line change
Expand Up @@ -7,17 +7,23 @@ h1:focus {
outline: none;
}

@media screen and (max-width: 1500px) {
@media screen and (max-width: 600px) {
.logo-text {
font-family: mallanna !important;
font-size: 5vw;
}
}
@media screen and (max-width: 1100px) and (min-width: 600px) {
.logo-text {
font-family: mallanna !important;
font-size: 3.5vw;
}
}

@media screen and (min-width: 1500px) {
@media screen and (min-width: 1100px) {
.logo-text {
font-family: mallanna !important;
font-size: 75px;
font-size: 2.5vw;
}
}

Expand All @@ -37,4 +43,5 @@ h1:focus {
padding-right: 24px;
margin-bottom: 12px;
}
}
}

Binary file modified src/Pilgaard.Blog/wwwroot/favicon.ico
Binary file not shown.

0 comments on commit 9823497

Please sign in to comment.