project details

Tarp Configurations Calculator

Tech used

github inkscape

This is a personal project that aligns with my interests in bushcraft and wilderness survival. It calculates the height of the rope(s) used to raise your tarp for 33 different tarp configurations.

It also notes whether the user is able to 1) sit under the tarp, and 2) sit in a chair under the tarp.

You can try out the app on Netlify or take a look at the code on Github.

Why I built this app?

I wanted to do something unique so I converted my spreadsheet equations for tarp configuration into a React/JS application.

This app would be useful for campers, backpackers, and bushcrafters.

What was challenging about this app?

I had to do some research for my Hamburger menu and PNG files that were not outputting due to their small size and default Webpack settings.

I also had to redesign the overall file structure due to re-renders of components.

Example of results output

What did I learn from the project?

The ease of Tailwind and the basics of React such as react-router-dom, use hooks (useState, useContext, useEffect, useRef, useNavigate, and useLocation), and conditional JSX.

Final thoughts:

Using useContext was better than useState but I would like to incorporate useReducer for my state values. I would also prefer to create my own webpack.config file for greater control.

Example of tarp fold(s) and tie points

Guitar Chord Namer

Tech used

bootstrap github

This app returns the name of a guitar chord, the chord intervals, the chord tendencies, whether or not it equals another chord by a different name, and the scales that build the chord.

You won't find a more accurate and complete guitar chord namer app! If you or someone you know plays guitar then try out the app on my guitar website or check out the code on GitHub.

Why did you build this app?

I started this project after viewing SVG Guitar Chord repos on GitHub and noticed that their names were often wrong. I also was not able to find any quality websites on the subject.

How I built this app

I had to create a lot of variables for my form elements, output fields, and music note arrays. I also had to write all the for loops and conditions within a single function.

Output shown for a valid chord

What did I learn building this app?

It was a challenge building the majority of the functionality inside a single function that is called from the form event listener.

Also. the use of the JS method every was the main "helper" method for getting the functionality I needed.

Is the app complete?

This app is complete for its purpose but it can be much better. I would like to have an option for ukeleles, banjos & mandolins.

I also intend to load the users' tuning and sharp/flat selection into local storage.

Writing Assistant

Tech used

github

I built this app for my aunt who has cerebral palsy. My hope was that she would be able to select words and phrases for better emails to friends and family.

If you know someone with a disability that could use this tool then send them to the live version and have someone get in touch with me. Also, take a look at the code on GitHub.

Why I built this app

It is for anyone with reduced fine motor control who has better control clicking with an assistive mouse than using a keyboard. The hope is that they would be able to type more text in less time.

How I built this app

I added the most common words to an alphabetical mega menu, added the functionality for the keyboard keys, added the textarea with clear/copy buttons, and lastly, I added the proper nouns section behind an accordion button.

Example of drop-down list for phrases

What did I learn building this app?

It is absolutely essential to have a clear plan outlined of what you need to accomplish, and I learned that the hard way. This was my first project and the details were not clear in my mind.

Is the app complete?

No, I need to use the File API so users can upload a file of proper nouns and sample text so that they can have a custom-built page. I would also like to create keyboards for other languages.

Custom WordPress Theme

Tech used

Wordpress php github

In 2018 I installed WordPress on one of my websites but I found the lack of design options and the decrease in page speed from page builders problematic. So I decided to learn how to build my own theme.

I was able to duplicate the design of page builders but without any loss in page speed. I have only built a simple plugin but will be builing more in the future! Check out the live site and the GitHub repo.

Why I built a WordPress theme

To understand WordPress better, improve the page speed metrics for my websites, and have the design and features that I wanted.

How I built the theme

I took three Theme Dev courses on Udemy and slowly started creating my template files during each lesson of the last course. I also used the WP Theme Docs along the way.

Services card from home page

What did I learn building the theme?

WordPress overall is impressive! The template file structure and template tags enable you to give the overall design that you want.

Is your theme complete?

I am not happy with some of my designs, and I have only built super-simple plugins. So no, my theme, PHP skills and WordPress journey continue.