My Django Journey

A while back I discussed how I had settled on not using a CSS framework in the Python/Django backed websites that I maintain. I also mentioned that I would start employing HTMX to add a bit more interactivity to those sites. The site you are reading it is one of those and I have spent the past few days making some small tweaks. The most significant are not visible to the reader. I have built my own basic content management system in place to be able to add content without visiting the built-in administration.

What is visible to the reader is that I swapped the "Current Category" header for changing the background of the active category box in the navigation bar. Since I am not using a CSS framework, my navigation bar is quite simply a series of boxes that are stacked top-to-bottom on mobile and left-to-right on wider screens.

In the end it is just as functional as using a Javascript/CSS framework, though perhaps not quite as stylish. Touching or clicking a box shows the last four blogs in any one category. I for one think it is better than a hidden menu which is often the choice on mobile screens. I know I get frustrated trying to find a menu on many sites. However, scrolling is so easy on mobile, I figure why not let the menu take up a lot of the screen and the user can just scroll to the content.

What I did change today was adding some more HTMX, this time to change the background color of the navigation box of the active category. It was not an obvious change either. The box is set in HTMX to change the content below. HTMX can only make one change per event. Doing some online reading I realized that events can trigger another event.

What I did was add an invisible HTML tag to the changed content below that upon loading triggers another HTMX call that changes the navigation bar. Since the category is known I was able to pass that in and with some template logic change the class of the active category and have it show up with a yellow background.

I'm continuing my changes to create an interactive and visually appealing interface for adding and editing content. I'll admit I don't really need it, but I want to work through it on this site before I move on to the project I'm really eyeing.

I am part of a group called iubase.com that covers Indiana University Baseball. The group has a Wordpress which has been fine and inexpensive for generating blog and podcast content. I had considered trying to port the whole site to Python/Django, but the work involved in migration would take up all of my free time for months when I really just want to add some dynamic applications to expand what we can provide fans of the team.

So my plan now is spin up a separate Python/Django site named apps.iubase.com on Digital Ocean to host a series of dynamic apps that will be linked to from the main WordPress site. The first of these is an app that will allow more than one of us to post to the live game blogs at a time and automatically format the game status of inning and score.

I have more apps in mind, but I will be taking it one a time. The college baseball season starts in mid-February so we will see what I am able to produce in that time frame. I will blog here periodically about what I learn and what I accomplish.