Scott Scharl

A few days ago, I deployed my first Next app to the world wide web. BuddyTask is now in production and in use by a friend and I. It's basically a partner accountability app. Two users form a partnership, then each commit to completing a personal list of tasks. Each

function getProgressBar(numerator: number, denominator: number) { const percentage = Math.round((numerator / denominator) * 100); const tenths = Math.round(percentage / 10); const barTenths = [ '⬜️⬜️⬜️⬜️⬜️⬜️⬜️⬜️⬜️⬜️', '🟦⬜️⬜️⬜️⬜️⬜️⬜️⬜️⬜️⬜️', '🟦🟦⬜️⬜️⬜️⬜️⬜️⬜️⬜️⬜️', '🟦🟦🟦⬜️⬜️⬜️⬜️⬜️⬜️⬜️', '🟦🟦🟦🟦⬜️⬜️⬜️⬜️⬜️⬜️', '🟦🟦🟦🟦🟦⬜️⬜️⬜️⬜️⬜️', '🟦🟦🟦🟦🟦🟦⬜️⬜️⬜️⬜️', '🟦🟦🟦🟦🟦🟦🟦⬜️⬜️⬜️', '🟦🟦🟦🟦🟦🟦🟦🟦⬜️⬜️', '🟦🟦🟦🟦🟦🟦🟦🟦🟦️⬜️', '🟩🟩🟩🟩🟩🟩🟩🟩🟩🟩', ]; return barTenths[tenths]; };

New features:Dynamic username displayed in the top nav barSettings page w/ user-configurable Daily Goal and TimezoneDynamic counter in the app title, visible in the browser tab showing Public Comments Today (followed this helpful post)Converted from single- to multi-page app using react-router→ zendash.vercel.app (user: test pw: zendash)

"This is ridiculous", I thought. "Surely there must be a way to fix this with software!"

Most of the UI is now built for my app. I now am learning how to signup and log in users via Firebase, and how to create/read/update/destroy data in their accounts with Cloud Firestore database. I also renamed the app: BirthdayBot is now BirthdayBird!

I'm proud of how this is starting to look! I'm learning TailwindCSS for the design.

It's time to reboot this blog! The past year has been the most challenging of my life. My family was forced to move (across town) on short notice, I started a new job, and my mother-in-law died. But, thankfully, though I neglected to post on this blog, I kept going

This week I'm doing a bunch more refactoring of my file structure to make it easier to work in. I'm also STILL tackling state and making some cards in the center of my screen editable.

Using Javascript and props to read an array and build multiple components of the same type. Intro to Javascript Events using the example of onClick=

Broke out a number of the portions of my files into separate files. Built a single <Button /> class, with props relating to different CSS styling for several types: Primary Secondary Transparent Danger

Because of emergency travel out of state, I was not able to meet with my friend this week. I'm working on building out additional React components for my site.

Today we introduced state in React. It was challenging to try to understand such an abstract concept. My task is to continue building out different views within my app. They still aren't connected to any data or backend.

Topics covered: Intro. to the react-router library. Using <Link /> components to change the URL bar and viewable content on the page.