Attach to Process

Thoughts and Notes on Software Development

On my Above the Earth and Seas photo-blog, I was able to add a link to get a random post using just plain JavaScript.

The reason this works is because I decided to use numbers for all the post slugs/urls. That allows me to use simple Math functions in JavaScript to come up with a random number. Then I use that random number to construct a url to link to. It's pretty basic but it works.

Here is the Custom JavaScript that I added:

// This number matches the url of my latest post
const latestIndex = 36;

/* Get random post */
const a = document.querySelector('a[href$="/random"]');
if (a !== null) {
    const randomIndex = Math.floor((Math.random() * latestIndex) + 1);
    const pad = '000';
    const randomPostIndex = (pad + parseInt(randomIndex)).slice(-pad.length);
    const randomPostUrl = 'https://ateas.dinobansigan.com/' + randomPostIndex;
    a.setAttribute('href', randomPostUrl);
    a.setAttribute('title', 'Get a random post');
}

Tags: #JavaScript

Discuss... or leave a comment below.

To get a list of the global config options for Git, you can run this:

git config --global --list

When setting config options, you need to add the location of the config file. So for example, if you want to set core.autocrlf to false as a global or system option, you can run either one of the following commands (depending on the location you want to run it for):

git config --global core.autocrlf false
git config --system core.autocrlf false

Tags: #Git

Discuss... or leave a comment below.

The git pull command is basically like “Get Latest Version” in TFS. It pulls down the latest changes for a repository and merges them into the local files in your computer.

I don't think there is an equivalent in TFS for the git fetch command. The closest thing to it in TFS is probably viewing history, then manually checking to see what changes you are missing. Or doing a merge of branches to see what is different.

In comparison to the git pull command, running git fetch will not pull down any changes. From what I understand, all it does is compare the changes/code in the remote repository with your own local repository. Then it can tell you whether your local repository is behind or ahead, as far as changes go, with the remote repository. This is even better than what you can do in TFS, because it allows you to see exactly what changes you don't have on your local repository.

Tags: #Git #TeamFoundationServer

Discuss... or leave a comment below.

A few months ago, I ran into a situation where I had to increase the timeout for a WCF service call, that my ASP.NET Web API was making. It wasn't as straightforward as just adding configuration to a config file, like you would do with a WCF service. You actually have to do it in code. The answers to the stackoverflow question listed below, helped a lot in figuring out a solution for it.

Link: How to increase the timeout values for a WCF service in a dot net core 2.1 project – Stack Overflow

In your Web API code, you can create a partial class for the WCF client you are trying to call. In that class, you should be able to get to the Endpoint object. This object allows you get to the WCF bindings where you can set the timeout values. Then you can do something similar to the code I have below to set the timeouts.

TimeSpan timeSpan = new TimeSpan(hours: 0, minutes: 0, seconds: timeoutInSeconds);
Endpoint.Binding.CloseTimeout = timeSpan;
Endpoint.Binding.OpenTimeout = timeSpan;
Endpoint.Binding.ReceiveTimeout = timeSpan;
Endpoint.Binding.SendTimeout = timeSpan;

Tags: #AspDotNet #AspDotNetWebApi #WCF

Discuss... or leave a comment below.

This is a pretty good guide to building a blog using ReactJS and Sanity. That said, I did run into a number of issues while trying to follow it. This post is about the issues I ran into and the solutions for them.


When I got to the part where it says to run sanity init, I got errors in Visual Studio Code saying the PowerShell script is not digitally signed, so it's not allowed to run. The fix for this was to run: Set-ExecutionPolicy -Scope CurrentUser -ExecutionPolicy Bypass -Force in the VS Code terminal.


Then I got the error Error: self signed certificate in certificate chain. Looked it up online and found that it seems to be caused by my VPN connection. I disconnected from my work VPN and it did resolve my issue.


I got all the way to the part of the guide where I was Building the page for all the blog posts. After following the instructions and copying the provided code into src/components/AllPosts.js , I kept running into a post.mainImage undefined error. It turns out, the provided code is expecting all posts I created in Sanity to have a main image. I had one for my first post, but didn't add one to my second post.

The fix for the issue above was to replace <img src={post.mainImage.asset.url} alt="" /> with {typeof post.mainImage !== 'undefined' && <img src={post.mainImage.asset.url} alt="" />}.

What that new line of code does, is check if post.mainImage is NOT undefined, and if so, render the img tag. If it was undefined, as is the case with my second post, it wouldn't render the tag, thereby avoiding the error.


After finishing the guide, I needed to figure out how to deploy the React app to Netlify. Posts online say it is as easy as dropping a Build folder into Netlify. However, there's no Build folder in sight in VS Code. Turns out, I had to run npm run build to generate the Build folder and its contents. After that, it was as easy as dropping the folder into the Netlify's deploy folder. You can find the live site on here.

Initially the site would load, but the blog posts wouldn't show up. The fix for this was to add the site url, https://laughing-lamarr-50f7df.netlify.app, as a CORS Origins entry in my Sanity account's API settings.

Tags: #ReactJS #Blog #Bookmarks

Discuss... or leave a comment below.

Extremely good read on how to advance in your career as a software developer. While this guide was mainly written for Junior software developers working at medium-large companies, I reckon even Senior software developers can learn a thing or two from this guide.

Link: Leveling Up: Career Advancement for Software Developers

Tags: #Bookmarks #Career

Discuss... or leave a comment below.

On some of the pinned pages on my journal, I added a “Last Updated Date” value right under the title. I did it using a span element, like this:

# 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: Last Updated Date showing up on the right side of the title.

Here is what it looks like on a mobile phone: Last Updated Date showing up under the title on a small screen.

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.

Due to the rate-limiting feature that the Write.as team introduced into their API, a number of my Blazor WASM apps, like the WriteFreely Archive Page Generator I created, have stopped working. All of the Write.as related Blazor WASM apps I created, use the WriteAs.Net client/wrapper library that I wrote. And it is actually this client/wrapper library that is running into the rate-limiting problem.

But, as Matt mentioned here, a solution is in place through the use of Application keys.

I've already updated the WriteAs.Net client to make use of Application keys. But before I release the latest version, I also want to give it some caching abilities. That's what I'm working on and testing right now in my spare time. Once that's done, I'll publish the latest version of the WriteAs.Net client to Nuget.

After that, I plan to get the WriteFreely Archive Page Generator working once again. Then I'll work on getting the Search app for my journal working as well.

Tags: #Blazor #WriteAs #WriteAsNet

Discuss... or leave a comment below.

Visual Studio, when used with TFS (Team Foundation Server), has this feature called “Annotate”. You get to it by right clicking somewhere in the code, then selecting Source, then Annotate.

Doing so shows you who made changes, when those changes were made, and what changeset those changes belong to, for the specific line of code you are looking at. It's pretty helpful especially when you're trying to understand the context or history of a specific line of code.

I've been looking for the same feature in Visual Studio Code. Unfortunately, this feature doesn't exist when using Git with Visual Studio Code. But, you can install an extension called Gitlens that does the same thing and then some.

And just to clarify, there is no “Annotate” command/feature in Git. But there is a corresponding one called git-blame.

Tags: #VisualStudioCode #Extensions #Git

Discuss... or leave a comment below.

In the past, I used Wyam to generate the website files for my software development blog. I chose Wyam because it is a .NET static site generator and I am a .NET software developer. With Wyam, I got to play around with Razor and C# while working on my blog. And I learned a lot about HTML, CSS, JavaScript and even Markdown. But now it's time to move on.

I've already made some changes at the start of this year. Namely, I decided to start publishing new software development posts onto my journal. As I mentioned in this post, I didn't really like how it turned out. I didn't like how the content was getting mixed in with other totally unrelated posts. So, after only a few months with that setup, I decided to move my dev blog out into a stand alone blog once more.

Instead of going back to a static site generator, I decided to spin up a new blog with write.as. There are two main reasons for this.

Ease of Publishing

First, I loved the ease of publishing new content with write.as. Their Markdown editor is superb. The writing experience is distraction free. And all I really need to write new posts is a web browser. Yes, even the web browser on my mobile phone will work. I can't exactly say the same thing about writing new posts with a static site generator.

Keeping it Simple

Second, I wanted to keep things simple by keeping most of my sites under one roof.

I've realized that it was hard to maintain websites that were on different platforms. To post to my dev blog, I had to do it with Wyam. To post to my microblog, I had to do it at micro.blog. To post to my journal or music blog or photo blog, I had to use write.as.

Keeping my sites under one roof, using the same method of publishing, would make things a lot simpler. At least, that's the idea. So, I'm trying that out.

Whether this new setup will work or not, only time will tell. But the one great thing about owning your domain and personal websites, is that you can do whatever you want. You want to experiment with a different way of publishing, go ahead. You want to try a new theme, give it a go. You want to write longer posts, or shorter posts, it's all up to you. Your websites, your rules.

Anyway, that's all for tonight. I just wanted to publish a formal migrated to write.as post for this blog. I feel better now with that out of the way. So, I'll catch y'all in the next post. Thanks for reading.

Tags: #SiteUpdates #Blog

Discuss... or leave a comment below.

Enter your email to subscribe to updates.