web dev & more!

Projects

Coming up with a comprehensive list of every project I’ve ever worked on would be difficult. Instead, I’ve put together this list of some of my favorites. Of course, this website is my personal favorite but I've documented the details surrounding it more thoroughly here. If you would like to talk to me about any of the projects listed here, send me a message!

The homepage of michaelsteelefornd.com showing a red banner at the top, followed by a large image of Michael Steel in a dark suite jacket with a white shirt underneath.

michaelsteelefornd.com

When I was told that a family member would be running for a political office, I jumped at the chance to get involved. I think lots of people enjoy doing work where they can see real, positive impacts in the community. When starting this grassroots campaign, it was important for us to meet people where there were. This meant we needed tools to integrate tightly with various social media platforms. I would typically use WordPress for this sort of thing but the person in charge of the campaign's social media was already familiar with Ghost, so I took the chance to learn a more about theme development with Ghost.

After finding a base theme that fit most of our needs, I was able to make several modifications to the source code thus customizing it to be the perfect fit. After coupling the site with a customized CI/CD pipeline,I was able to quickly make adjustments to the theme source code, and deploy them immediately instead of worrying about losing theme settings when uploading a .zip file each time the theme was changed.

The homepage of helth.app shows inputs as well as buttons for quickly adding calories, water, sodium, and protein to the user's daily total.

helth.app

I wanted an Progressive Web App (PWA) that would help me track my calorie and water intake. Unhappy with the options available to me, I decided to build my own. While helth.app started as a joke, it quickly become a passion project that I use on a regular basis. It continues to evolve regularly with improvements like Cloud Sync allowing users to access data across multiple devices.

The homepage of helth.app shows inputs as well as buttons for quickly adding calories, water, sodium, and protein to the user's daily total.

openprairie.tech

Along with two of my very talented friends, I started a consulting company that specialized in providing digital solutions. While we were particularly good at creating web applications, our combined professional experiences have gone far beyond building simple web apps.

Shortly after forming the company, I got to work creating branding and marketing materials for the business. I created a logo that was representative of our company, with three stalks of wheat as a nod to the three members' midwestern roots. To get the word out and allow potential clients to contact us, I quickly put together a website using Svelte, SvelteKit, and Tailwind CSS.

The homepage of sveltekitbook.dev is shown with an orange colored background, dark grey elements that text and an the book cover are shown on. At the top, is the navigation of the site.

sveltekitbook.dev

After having written an entire book about SvelteKit, I needed a way to tell people about the book. Since I seem to know a thing or two about SvelteKit and web development in general, it seemed fitting to build a website to market the book. This website even takes concepts like server-less deployments taught in the book and applies them, because it would be silly not to.

While building the site, I took the opportunity to learn Tailwind CSS. Like most modern websites, it is mobile friendly and looks great on devices of any screen size!

White text on a black background showing the words WORK:REST TIMER with numbers showing the time elapsed. Below is a green "start" button, a red "stop" button, and a blue "reset" button. Next to those is a slider that allows a user to adjust the rest multiplier.

Work Rest Timer

If you’ve ever met a CrossFitter, you know that they take their workouts very seriously. When a client expressed his desire for a timer that would allow him to ensure he wasn’t resting for too long, I jumped at the challenge. We began brainstorming and discussing various features to suit his and his clients’ needs.

The CrossFit Minot Work:Rest Timer is the result of that brainstorming session and my efforts. Not only does it track active intervals and total time, but it also allows users to set custom rest intervals between sets. Changing the rest multiplier guarantees that rest times are proportional to active intervals, ensuring workouts stay on track.

The hompage of cfminot.com shows a title of "Making every rep count" with a man in a red shirt lifing weights over his head. Below the title are photos of gym members, the gym's values, and various news posts.

cfminot.com

When a long time friend started his business, he knew it would need an online presence. He was aware of Facebook Pages but realized that if he ever lost access to his Facebook account, he would also be locked out of his business’s page. He came to me looking for a website that would look great, be affordable, easy to use, and ensure potential customers could easily get in touch with him.

We sat down and discussed details. In the end, we settled on using WordPress with a popular theme that included page building tools. I put together contact forms as well as pricing information and included various professional photos taken of the gym. The site also incorporated a third party extension to show the gym’s schedule throughout the week. However, his gym members expressed the desire to access information about the Workout of the Day (WOD). To get this data on the site would take more than just installing a WordPress plugin.

To display the WOD, the website would need to interface with a third party service used by the gym. Conveniently, that service provided a simple JavaScript (JS) snippet that could be easily included on any web page. Unfortunately, the display and styles of the button it created were not easily customized as it was controlled by the third party provider.

After analyzing how the JS snippet worked, I decided to create a custom WordPress plugin that would fetch all of the same information but could display it directly on the website via a WordPress shortcode. The plugin, which is called CrossFit Minot SugarWOD (SugarWOD is the third party provider); can be viewed below. Now the gym members have easy access to get the WOD that is dynamically updated every day and looks great by incorporating design elements consistent with the rest of the website.