TrickJarrett.com

Learning React.js

I have decided to improve my coding skills and catch up with some modern trends and tackle one of the most popular javascript frameworks, React. Up to now my front-end coding has been HTML + Jquery which ages me by decades compared to the modern day.

It's been a long time since I learned a new programming langue. I messed around a bit with Python recently but, to be honest, it felt very meh to me. Nothing revolutionary. To be clear, I recognize it as a great language and am not trashing it but I found no real hook for me.

So, in my effort to learn and adopt react as my front-end coding of choice, I have this rough development process in mind:

1. Tutorial project - Done! This was a very simple task manager tool that showed the basics.
2. A D&D HUD - This would be a tool I could use for managing combat in D&D as well as something to provide a nice front-end view for players to know who's up in the initiative, and out of combat, an easy way for me to show then stuff and convey bits of info about the world. We'll see how complicated it gets.
3. Fixture Picker - This was the project that actually caused me to jump into learning React. The way I want to take the tool really leans heavy on Javascript to allow people to personalize stuff. So I'll be using React as part of a full rewrite, making it the V4 of the Fixture Picker.
4. Glowbug - While I'm not blogging as much as I want to, I think this would be an excellent project to learn React and rebuild my admin functionality in it. The frontend will likely not change for readers, we'll see.
5. Pick'em - This is a further off project. I just did the major rewrite of my Pick'em site for this past season. I don't intend to do this in the short term, but it is a very likely development in the future. Probably 12-18 months down the line.

I am sure other projects will pop up, given time, but this is my road map of projects which I'll work on to develop my react.js chops. And of course, I'll keep this blog semi-updated with my progress.

Learning React.js

I have decided to improve my coding skills and catch up with some modern trends and tackle one of the most popular javascript frameworks, React. Up to now my front-end coding has been HTML + Jquery which ages me by decades compared to the modern day.

It's been a long time since I learned a new programming langue. I messed around a bit with Python recently but, to be honest, it felt very meh to me. Nothing revolutionary. To be clear, I recognize it as a great language and am not trashing it but I found no real hook for me.

So, in my effort to learn and adopt react as my front-end coding of choice, I have this rough development process in mind:

1. Tutorial project - Done! This was a very simple task manager tool that showed the basics.
2. A D&D HUD - This would be a tool I could use for managing combat in D&D as well as something to provide a nice front-end view for players to know who's up in the initiative, and out of combat, an easy way for me to show then stuff and convey bits of info about the world. We'll see how complicated it gets.
3. Fixture Picker - This was the project that actually caused me to jump into learning React. The way I want to take the tool really leans heavy on Javascript to allow people to personalize stuff. So I'll be using React as part of a full rewrite, making it the V4 of the Fixture Picker.
4. Glowbug - While I'm not blogging as much as I want to, I think this would be an excellent project to learn React and rebuild my admin functionality in it. The frontend will likely not change for readers, we'll see.
5. Pick'em - This is a further off project. I just did the major rewrite of my Pick'em site for this past season. I don't intend to do this in the short term, but it is a very likely development in the future. Probably 12-18 months down the line.

I am sure other projects will pop up, given time, but this is my road map of projects which I'll work on to develop my react.js chops. And of course, I'll keep this blog semi-updated with my progress.

Yesterday's Linux experiment did not last long. I ended up reverting the laptop to Lubuntu, I found that while Bunsenlabs looked nice, its support was lacking and I was not in the mood to dive deep into learning its intricacies.

That said, this morning I found myself diving deep on two arcane nerd tools: vim & lisp.

Vim is a code editor that is notorious for its power but also for its steep learning curve. It is a byproduct of the early days of unix and linux and it is a truly amazing piece of software, except that it is like learning a foreign language for all the jargon and key codes you have to learn. So, naturally, I am fascinated by it and eager to try and unlock it.

Secondly, Lisp, is a programming language. It is most widely used today for doing things like AI, but it is an old language. I had a course in college which used a version of Lisp. I have no real plans for a Lisp project, but I just find it interesting to explore things like this from time to time.

I have been using a FreshRSS install for a few months now, allowing myself to return to the realm of RSS feeds. And after those past few months I've dealt with a number of websites using truncated bodies of posts in the RSS feed, and occasionally clicking through to the full article on the website.

Well, last night I discovered a feature of FreshRSS that I had not known - and that is the ability to actually have it pull the full post body from the website through defining of the post body's CSS container. It's technically somewhat simple (I understand how to implement it, conceptually) but still having that function is amazing and has already made my RSS feed so much better.

Project: CeMeNT

I have started thinking about my next coding project. For those of you not aware, in the past year I've written a homebrew blog engine (Glowbug, which you're probably reading right now) and I've rewritten my MLS Pick'em website, which has taken roughly 3 months of on/off work. Next on my bigger coding projects is a project I've codenamed "CEMENT" - CollEction ManagEr aNd Tracker.

I have a large collection of Magic cards (a sorting project that I've been working on for over a year.) My wife has a large collection of PEZ. We both need a system for tracking them. There are plenty of collection management software options out there, but, as I am feeling motivated to try and roll my own.

I spent a while yesterday doodling a database diagram and it is fairly complex. I've thought about whether a relational database is what I want or if I want to go with a NoSQL structure. I'm not sure. If I use MySQL, here is my initial database structure:

This structure is hugely flexible, allowing a completely formless and infinitely deep nesting taxonomy system such that I can define every collection via taxonomy. Let's start though at the actual things. The database has Objects and Entities. Objects are the type of things, and Entities are the actual items in the collection of that. For example I might have multiple printings of a specific Magic card. That's my thinking on it.

The taxonomy is such that I could define a structure as follows:

• Magic
• Rarity
• Common
• Uncommon
• Rare
• Mythic Rare
• Land
• Set
• Strixhaven
• Kaldheim
• Quality
• NM
• Played
• Damaged
• PEZ
• Quality
• Loose
• In Blister
• In bag
• PEZ Type
• Oversized
• Normal
• Funko Pez

Essentially the system would see any Taxonomy entry without childen as values and any with children as categories. And is infinitely able to add more collections in case I want to start tracking my scotch cabinet, or books, or boardgames or something else.

The downside to this flexibility is that doing things based off taxonomies is now extremely complicated. For example, if I was importing a price list, then coding it becomes quite a bit more complicated I think.

I also have a location tracking in mind for tracking both where things come from and where they get stored. This is more notable for my Magic collection so I could track if cards are in the stacks or in decks, etc.

As I wrote this blog post there is one feature which is not currently included: usage tracking. This came to me as I was noting that I could track my boardgame. I have a spreadsheet for tracking my boardgame collection and the vast majority of the data could be ported over to the taxonomy system I'm designing, but the usage tracking is not directly transferrable except for a very clunky use of the taxonomy system (I could create a category for 'Used' and then add a child option for a date. It works but isn't great.)

What I need is an ability to define "free text" fields for entities. I could do this as part of taxonomy, adding a flag for it to be a field to be filled out and what type of field it is. Text, number, date, etc. Going to need to think that one over.

I mean, I am thinking the whole thing over. But this is the start of the project. We'll see where it goes.

Schmetz is Live

After a fair bit of fiddling, Schmetz, the newest Raspberry Pi in my house, to be used as my home development webserver, is up and running! Apache, PHP, MySQL, PHPMyAdmin... it took some fiddling for various weird behaviors but we got there and I'm now developing on a local instance of my current coding project. Later tonight or tomorrow I'll set up Glowbug on it.

Up to now my secret shame has been web developing on live. It's not something I'm proud o,f but for the scale of projects I'm working on, it's been fine. But this is obviously far better and will make bigger developments for ongoing projects possible.

Pick'em 3.0

This morning, coding work on a complete rewrite of one of my other coding projects begins. In 2016 I created a website to run a casual MLS Pick'em with friends. I had run it for a season or two via an extremely complicated Google Sheet and the website was the next iteration. Over the years the code has grown more and more troublesome to update and last year that problem was exacerbated as Covid forced a truly awful (from the coding standpoint) series of exceptions and things I had to rework on-the-fly.

So, with the new season starting in the middle of April, I am setting out to do a complete rewrite. Some of it will be inherited from the previous version, or informed by it, but I intend 95% or more of it to be rewritten and cleaned up.

It is written in PHP and MySQL with some JavaScript. Today is primarily about laying groundwork. I had written out my expected database schema, today I'm implementing it in MySQL and I'll set up the git codebase, etc. We'll see how far I go.

I continue my efforts to learn Python, tonight's project was to implement a calendar function. Python has a built in tool that does this, but it's about learning the language and implementing the tools for it. I was able to do it in about 60 minutes, with most of that being troubleshooting errors and learning some of the requirements for Python.

As I come from PHP, getting used to strict typing on variables is a big learning for me.

One of the common pitfalls I fall into is naming my files an obvious filename, which ends up being also something I import. For example, tonight's file was originally called 'calendar.py' but since I am importing the calendar library in python, it was erroring. So it got renamed to cal.py.

Here's the code I came up with:

import calendar
from datetime import datetime

date = input("Enter Date: ")

dt = datetime.strptime(date,"%m/%d/%Y")

header = datetime.strftime(dt,"%B %Y")

weekday = int(datetime.strftime(dt,"%w"))
date = int(datetime.strftime(dt,"%-d"))

month = int(datetime.strftime(dt,"%-m"))
year = int(datetime.strftime(dt,"%Y"))
firstDateOfMonth = int(datetime.strftime(datetime.strptime(str(month)+"/1/"+str(year),"%m/%d/%Y"),"%w"))

lengthOfMonth = int(calendar.monthrange(int(year),int(month))[1])

print(header)
print("[Sun][Mon][Tue][Wed][Thu][Fri][Sat]")

line = ""

if firstDateOfMonth > 0:
    k = 0
    while k  6:
        print(line)
        line = ""
        k = 0
    filler = " "
    if i == date:
        filler = "*"
    if i This code outputs a simple text calendar such as the following:

What Software Languages does NASA Prefer for Rockets?

Watching today's landing of the Perseverance on Mars, I was curious what it was coded in. A quick googling makes it seem like C is what they would be using on the rover. Fascinating stuff.

Python online Textbook

Now that I've gotten a few Python projects under my belt by process of code segments and rough guesses, I figured it was time I give a book a read and learn what else Python holds in store for me.

Coding Adventure: Chess AI

Given yesterday's foray into coding Rock, Scissors, Paper, Lizard, Spock and Tic, Tac, Toe, I woke up today with the idle thought about playing chess against my own computer opponent. This isn't a new thought, but it is also not something I have ever delved into lightly before. So when I opened YouTube and saw this video, I of course decided to watch it.

He's coding in Java, which I have experience with from probably 20 years ago, so I am not going to use any of his code snippets, but the discussion was still illuminating as he covered various issues he faced and some methods he used in determining moves, etc. So, with the snow coming down outside and the dogs gathered by the fire, I'm going to start my own chess quest.

Added audio functionality

[{audio}]8bit.mp3[{/audio}]

Among my development work today, after messing with Python I came back home to Glowbug and added some functionality that has been on my list. I can now upload mp3s and have it generate the play functionality.

Simple Tic-Tac-Toe in Python

My learning of Python continued today with me coding a simple Tic-Tac-Toe client. It is very dumb, the computer always plays randomly and currently has no intelligence to it. But I wrote it from scratch with no outside resource or code segments. Doing things like this is always a great feeling for me, learning something is one of my favorite things to do.

Here is my Python code:

from random import randint

board = [1,2,3,4,5,6,7,8,9]
legalplays = [1,2,3,4,5,6,7,8,9]

def drawboard(board):
   print(board[0],"|",board[1],"|",board[2])
   print("---------")
   print(board[3],"|",board[4],"|",board[5])
   print("---------")
   print(board[6],"|",board[7],"|",board[8])


def checkboard(board):
   patterns = [[0,1,2],
               [3,4,5],
               [6,7,8],
               [0,3,6],
               [1,4,7],
               [2,5,8],
               [0,4,8],
               [2,4,6]]
   for pattern in patterns:
       if board[pattern[0]] == board[pattern[1]] and board[pattern[0]] == board[pattern[2]]:
           return board[pattern[0]]
   return 0


def computerPlay(board):
   availableplays = []
   for i in board:
       if i in legalplays:
           availableplays.append(i-1);
   moves = len(availableplays)
   move = randint(0,moves-1)
   return availableplays[move]


playfirst = randint(1,2)

if playfirst == 1:
   #Computer Plays First
   play = randint(0,8)
   board[play] = "O";

noresult = True

while noresult:
   drawboard(board)
   player = input("Choose where to put your X: ")

   if player.isnumeric():
       player = int(player) - 1
       if player 

Remote Impact.io - Remote developer jobs for companies working towards the UN's Sustainable Development Goals

Came across this link on Reddit to a guy's website which lists remote working jobs for companies who are working towards the Sustainable Development Goals by the UN. First off, I wasn't actually aware of these goals, but also it's cool to see. I'm not looking to be a developer, but I love this idea.

I am working on learning Python as a programming language and getting used to it. I sat down and coded "Rock, Scissors, Paper, Lizard, Spock" - First I did the endless if, elif, else statements then decided to go for a more compact solution via a dense multidimensional array.

from random import randint

t = [["Rock",[0,-1,1,1,-1],["ties","is covered by","smashes","crushes","is thrown by"]],
   ["Paper",[1,0,-1,-1,1],["covers","ties","is cut by","is eaten by","disproves"]],
   ["Scissors",[-1,1,0,1,-1],["smashed by","cuts","ties","decapitates","is used by"]],
   ["Lizard",[-1,1,-1,0,1],["is crushed by","eats","is decapitated by","ties","poisons"]],
   ["Spock",[1,-1,1,-1,0],["throws","is disproven by","uses","is poisoned by","ties"]]]

#assing a random play to computer
computerindex = randint(0,4)

player = False;

while player == False:
   player = input("Rock, Paper, Scissors, Lizard, Spock? ")

   noresult = True
   for entry in t:
       if entry[0] == player:
           if entry[1][computerindex] > 0:
               noresult = False
               print("You win! ",player,entry[2][computerindex],t[computerindex][0])
           elif entry[1][computerindex] 

A Raspberry Pi Cluster vs. Macbook

This video is neat because the code he uses to test the performance ends up being a fairly simple script that looks for prime numbers. This was hugely nostalgic for me as, in high school, I had a coding challenge with a buddy of mine named Josh to do this. We wrote code to find the primes between 1 and 1,000,000. But ours wasn't about processing power so much as optimized code.

My big realization, which seems so obvious looking back, was that I only needed to check a number up to it's square root for factors. So if I have the number 81, I don't need to look past 9. If there are no factors for 81 below 9, then it is a prime number. Obviously, 81 is not prime, it's a perfect square.

I also have a love for cluster Raspberry Pi projects and still have idle plans to build my own cluster one day. The only reason I haven't is that I don't have any need at all for it. The closest I've come is the idea of running this blog on a raspberry pi cluster out of my house, but that also comes with a number of headaches and challenges. Maybe one day.

Elizebeth Friedman was the First Female Cryptanalyst

There is a serious need for us to give this woman a movie, given that she was forced to live in the shadow of those who took credit for her work until 2008. I can't wait to check out the PBS documentary, and the book it is based on.

This evening after I finished up work I sat down to tackle the final major component of the new tagging feature for the blog: a page to manage tags. This constitutes largely a page that lists off every tag, and gives me three functions:

• Merge - The ability to essentially delete one tag and re-assign all posts which used the deleted tag into the new tag
• Rename - Self-explanatory
• Delete - Self-explanatory

Knocked it out with about 2 total hours of coding for front and backend. Could have probably done it faster, but I spent some time chasing a ghost of a bug - that is, I got an error page and couldn't figure out the issue because I had forgotten to upload the updated code file. Whoops.

This morning's Glowbug coding is a long overdue feature: admin searching. This is for my use, I haven't yet decided how to give visitors search capabilities. I'm tempted to offload that to google, but that would be a stopgap solution. Eventually I'd want to give actual search I think.

But for now, I can now do searching based on titles, urls, and the body text. I haven't yet done searching based on the tags. That will be slightly more complicated. I might tackle it later today, we'll see.

Alan Turing's chess computer

I think I came across this article while looking for the previously posted old computer engines. This is a nice little article discussing Turing's chess engine. Notably he acted as the computer with it, there was no computer able to originally run it. So he had to do the math by hand and would take around 30 minutes to calculate a move.

Sadly the "code" for it has been lost. In the 2000s, Chessbase (then a giant in chess computing) built a chess engine based on the Turing engine. But it was overall underwhelming, and later removed (though I can find no reason why.)

Here is an excellent companion article, which covers more of the methodology that went into Chessbase's Turing engine.

It's still interesting to read about. I became aware of Turing's chess love when I was reading the biography of Claude Shannon, who was a contemporary of Turing and the two bonded over chess (and, of course, their national roles in WW2.)

Toledo Javascript Chess Game

A reddit post shared a user's old chess computer, and I wondered if any nerds had emulated some of the old chess systems to play. I am not a grandmaster, but I'd love to play against them and see how I'd do. In googling, I came across this tiny Javascript chess engine. The total script is 2.1 kilobytes which is stunning. The javascript which runs the backend of Glowbug is many times that size, and looking at the Toledo sourcecode, it is incredibly dense.

It's so dense in fact, the creator has released a book that dives into his code and explains every single detail. I haven't purchased the book, but it's existence is case enough to be impressed.

I played two games against the computer and was very impressed. I won one and managed to draw the other.

Tonight's coding is not on Glowbug but on another one of my projects. One in need of a refresh and rewrite: My Fixture Picker. Currently it lives on firsttou.ch, but honestly I might let the domain drop and just bring it over to trickjarrett.com. We'll see.

This site solves a problem for me: I really like watching soccer. I have access to lots of games in different leagues on different channels or streaming services. How do I pick what I should watch?

What exists right now is entirely made via server side code using PHP. What I need is to rewrite it so instead it provides your browser with all the raw match data and then you can set some variables for preferences, pick favorite teams, etc. And then it is saved in cookies or as a unique user for you.

So, my plan today is to begin working on that rewrite. I might use this as a chance to experiment with ReactJS since I have no experience with it. We'll see.

Late night Glowbug coding. I have had this idea for a few days. On the back end I can save drafts of posts. Primarily it's a link queue saved either from a bookmarklet when I come across a link to read later, or a link saved from my phone.

Well there is a cron job which runs every twenty minutes that, as of now, does two things.

1. If a draft is older than 48 hours, it deletes it. Sometimes I save a link meaning to read it and I keep putting it off. Well, if it gets to 48 hours I lose the chance. Or if I meant to save it longer than that it should be a browser bookmark instead.
2. If the system hasn't grabbed the page's title, it goes ahead and does that. It's a small thing but it is much nicer than the sometimes opaque URLs which I don't know what I'm linking too.

Small coding thing, took me 15 minutes. The majority of which was triple checking my timeout deletion query, but otherwise I had it mapped out in my head and it went lickety-split nice and easy.

The Guardian Newspaper has a new automated tool for copyediting

Newspapers follow style guides. Rules which define how they grammatically write. When do you write eleven vs. 121? How do you refer to individuals who cause an uprising in a country? Etc. etc. Essentially, it is the programming language rules for that newspaper's use of language.

Heck, I've even thought about my own style guide rules for this blog.

Here is a link to the virtual reference of the Guardian's own style guide. Chicago Manual of Style. And here is the Associated Press's Stylebook. You get the idea.

The linked article is a coder focused deep dive in the system the Guardian set up for improving automated fixes of the style guide for the paper.