Choosing a tech stack

Part of my discussion with Claude was what tech stack to build the new site on. I considered React, ASP.NET, or even a popular static site generator like Eleventy. But at the end of the day, those all felt like overkill for a static site with at most 2-3 pages. I decided to just have Claude build it with plain HTML and CSS. Any future updates I can handle myself by editing those files directly, and with continuous deployment from GitHub to Netlify, shipping a new build is quick and easy.

That continuous deployment pipeline turned out to be one of the real benefits of using Claude to help build websites. It knows GitHub, and it knows Netlify. I had no idea how to set up a pipeline that deploys automatically from GitHub to Netlify, and researching it myself probably would've taken a few hours. With Claude, I had step-by-step instructions and a working pipeline in under 10 minutes.

Getting the design right

The first design Claude came up with was kind of bland. I told it the design was “meh,” and it responded by putting together three more options for me to choose from. One of the designs seems to have taken inspiration from this very own site, it mimicked the blinking cursor, but gave it its own spin, pulling in some design cues from terminals and code. I chose that one. I toned it down a bit from the original concept, but I think it turned out pretty well.

This was the other big benefit of rebuilding the site with Claude. I can build websites, but I'm not much of a designer. Giving Claude some direction and getting back multiple design options to choose from, made that part of the process a lot less painful.

Sunsetting apps.dinobansigan.com

In other news, I took down the Blazor Web App at apps.dinobansigan.com. The site itself is still up, but it's now been replaced by a maintenance page (also built by Claude Code). That also means the Write.as Archive Page Generator app that used to live there is now gone.

Truth is, that app has needed a fix every few months since I built it. The root cause is different each time, but there's always something going on with it. At this point I don't have the bandwidth to keep chasing the fixes, especially for something only a handful of people ever used. So I'm letting it go.

That's it for this update. Between the new homepage and letting go of of the archive page generator app, it feels like I freed up space in my brain to focus on new stuff. Thanks for reading, and I'll catch you in the next DevLog.

Tags: #DevLog #ClaudeCode #WebDevelopment #WriteAs

Discuss... or leave a comment below.

Took me awhile, but I finally found a fix for the error. Turns out, I now need to add a “user-agent” default header value to my requests, to allow the api call to go through. This seems to be an issue affecting Web APIs written using C#/.NET starting June 2024. Credit goes to this answer from StackOverflow.

Tags: #DevLog#ASPNETCore #WebDevelopment #WriteAs

Discuss... or leave a comment below.

It was an easy fix, though it wasn't the web app that was broken, but the API that it was calling. I mentioned in a previous post, that I was working on an API to power my Blazor WASM apps. The API is functional, it's out there on the internet, running as an Azure App Service. And it's the one with the bug that I just fixed a few hours ago.

So, the Write.as Archive Page Generator should be working correctly now. You no longer need to do a “search and replace” on the output to correct the URLs.

Tags: #Blazor #WriteAs

Discuss... or leave a comment below.

I did notice, during my testing, that it can fail on blogs with a huge number of posts. That's mainly because the API call times out at like the 1.7 minute mark. I'll see if I can fix that in the future. But for now, just getting the archive page generator working is a win. So I'll call it a day.

Tags: #Blazor #WriteAs

Discuss... or leave a comment below.

This very minor update adds an interface for the WriteAsClient class, which opens it up for use with dependency injection in ASP.NET Core. This allows you to create a single WriteAsClient instance and re-use it when needed, making the caching additions from Version 1.2.0 much more useful.

This also frees me up to make better use of it in the API I'm working on.

You can install it via nuget: Install-Package WriteAs.NET -Version 1.2.1

Or via the .NET Core command line interface: dotnet add package WriteAs.NET --version 1.2.1

If you find any bugs or issues with it, please let me know. Thanks and y'all have a good night.

Tags: #DotNet #WriteAs #WriteAsNet

Discuss... or leave a comment below.

Tags: #DevLog#ASPNETCore #WebAPI #WriteAs

Discuss... or leave a comment below.

I remember working on some update to my Blazor apps, but the limitation of Blazor WASM as a client-side application, plus the CORS restrictions I kept running into, made it a headache and so I stopped. I eventually created a WPF app just for my own use.

This is what I used today to generate the contents for my archive page. Yes I know it is ugly. But I just need it to work, I don't need it to look pretty. And well, it does the job just fine, so I'm happy with it.

Since it is a WPF app, it will only run in Windows. So sorry folks, it's not something that everyone else can easily use. But if there's enough interest on it, I can share the source code in a public repo. Let me know in Remark.as or in the comments below.

Tags: #WriteAs #WPF

Discuss... or leave a comment below.

This latest version now allows you to enter an API key when initializing a WriteAsClient instance. This API key will allow you to bypass the rate limiting checks on the Write.as API.

Some basic in-memory caching has also been added to the client. You can configure some of the cache settings when initializing a WriteAsClient instance. The new settings are described below:

• cacheExpirationInSeconds determines how long data will stay in the cache before it expires. The default value for this setting is 300 seconds.
• cacheSize determines how many objects it can store in the cache. Note that a collection of posts (List<Post>) and a single post each count as 1 item. The default value for this setting is 4.

You can install it via nuget: Install-Package WriteAs.NET -Version 1.2.0

Or via the .NET Core command line interface: dotnet add package WriteAs.NET --version 1.2.0

If you find any bugs or issues with it, please let me know. Thanks and y'all have a good weekend.

Tags: #DotNet #WriteAs #WriteAsNet

Discuss... or leave a comment below.

The two issues that I ran into were: figuring out what the cache key was going to be for the cached object and removing the oldest object in the cache. I now have solutions for those issues.

For the cache keys, I figured I could use the method name plus the parameter values.

For clearing out the oldest cached object, I decided to make use of a generic Queue collection that could accept the cache key values. Then I could just pop-off the oldest value from the Queue and use that to remove the associated object in the cache.

And so anyway, I should have the updated version of the client/wrapper library out soon. I just need to do some more testing on it.

Tags: #DotNet #WriteAs #WriteAsNet

Discuss... or leave a comment below.

# Archive📜

<span class="lastUpdatedDate">Last Updated: 2021-03-17</span>

Now, instead of having it show up under the title all the time, I also wanted it to show up to the right of the title, if the screen was wide enough.

So, if the page is being viewed on a wide screen, like on a desktop computer, the “Last Updated Date” will show up on the right side. If the page is being viewed on a small screen, like on a mobile phone, the “Last Updated Date” will show up under the title.

Here is how I made it responsive using Custom CSS:

span.lastUpdatedDate {
   font-size: 0.7em; 
   color: silver; 
}
@media screen and (min-width: 480px) {
   span.lastUpdatedDate {
      float: right; 
      margin-top: -4em; 
      margin-bottom: -4em;
   }
}
@media screen and (max-width: 479px) {
   span.lastUpdatedDate {
      margin-top: -2em;
      padding-bottom: 2em;
      display: block;
   }
}

Here is what it looks like on a wide screen:

Here is what it looks like on a mobile phone:

If you know of an easier way to do this with less CSS, please let know in the comments below. Or you can do so privately by leaving me a message.

Tags: #HowTo #CSS #WriteAs

Discuss... or leave a comment below.