whatnotery / fizzbuzz

a simple fizzbuzz that also interacts with the DOM

Hey Y'all!

My name is Jos and I'm a Rubyist & software developer in Lexington KY.

After coding on and off since I was a teenanger I spent the better part of a decade doing I.T. support at an enterprise level. After my IT career I pivoted to software engineering where I developed my skills in Ruby and JavaScript leading me to take on contract work and a full-time position as a support engineer. I started development work shortly there after and was quickly promoted to a development role. In this time, I’ve refined my skills with Ruby on Rails, testing with RSpec and Capybara, frontend development with Svelte, and React.

When I’m not coding, I find joy in being outside (walking, hiking, or cycling), listening to my record collection, drinking natural wines, spending time with my partner, and serving on the board of directors of my local bike co-op.

Tech Skills:

• HTML & CSS

• Bootstrap

• Tailwind

• Javascript & Svelte

• PostgreSQL

• Ruby & Ruby on Rails

Interests :

• Bikes & the Outdoors

• Independent Film & Music

• Civic Engagement & Urban Policy/Design

• Natural and Low Intervention Wines & Winemaking

• Community Engagement

fizzbuzz's Issues

Add event handlers to make this more obvious

body click to highlight input and start typing automatic on keydown

Multiple input handling

if a user puts in a new input without clearing the output, the new output is appended to the bottom of the old output and the newest clear button does not work. If this is output appending is the desired behavior that is fine, You could rework the event listener to grab all clear buttons and have them clear all output no matter which is pushed. You could alternatively have new input automatically clear the old output, you could have each clear button only clear the section of output it is tied to, etc...

Erroneous input handling and UI

Add an on change or on input event listener to grab each character as it is typed and only allow numerical input. This could be further elaborated with some user messaging in the form of a hover title, a collapsible explanation of the app, and some user messaging when the wrong input is entered. Also enforce or coerce positive value numerical input.

Networking

Put a link to the github repo at the bottom of the screen and a link back to the main portfolio so that people can more easily jump around the site and find your info

Line characters rework

At the moment each line is handled as a new div with a '>' character in the text node in front of the newest line of numerical input. You could rework this so that each number is a new list item in an unordered list and then change the li element from a disc to a '>'. You could also handle this by altering the ::before element in CSS. I think it is better practice to have the HTML formatted more intuitively by creating a list and then styling that list with CSS.