Gitty up with baby steps

I just read this article by Ariel Camus on FreeCodeCamp about becoming a Git Master. While I understand the need to have branches when working with others, I have been slack to adopt that process when working on my own projects. That is changing.

Slowly. Slowly because I have to remember to do it, not because I am resistant. Swiss cheese for brains.

I returned to one of my early assignments. I had completed a vanilla JavaScript Hangman in time, but I felt it could be better. Upon completion, it functioned as a hangman game and had a nice look to it:

hangman

I’d like to have the chalkboard and window closer, but the last thing I’ll change is the styling. The first thing I did was add Gulp to bundle and watch. There’s a branch. Next up was to give it better functionality. When I turned it in, it had a word bank that did not have words or phrases, so I had no desire to deal with hyphens, apostrophes, or spaces. Next I wanted to add more word banks. One for different themes and have the players choose a theme. Currently, the only theme is “pants”. Then I’ll deal with keeping track of losses as well as wins before ending this with styling.

Instead of touching the master, that was good enough as it was and possibly ruining it, I created my first branch: tests. I have since finished the tests and added that new function to the branch and merged. Next up, I checked out a word banks branch. This is where I am now.

Such a great habit to get into and it took me this long to do it? No. Not really. I have done it before, but I just forget to. When I realize I need to be on a branch, I’m already working on the master. It would not occur to me to work on the master when I’m part of a team, so why is this hard to remember when it is just me? Maybe I should just rip myself a new one so that mucking up the master is something that terrifies me. Put a mirror on my desk to really make the argument with myself seem real. Storm out. Apologize. Make up with ice cream. I see this as a win-win sitch.

 

 

My Brain Hurts: recursion with factorials

With pencil and paper in hand, I have no problem with recursive patterns. Fibonacci schmibbo-hotsytotsy. Factorials schmacks-Oreos.

“Write a recursive function to …” blah mork loopy loo let me leave the interview now so you can continue with someone better, and I can drown my sorrows in two scoops of ImNotWorthy. 

I know this because it was not until I was asked to demonstrate recursion in a mock interview (I requested this topic), that I saw that my comprehension was passive. I understood it when I saw it. … ish. Understood-ish. But there was absolutely no active comprehension. I could not do it on my own. No ish. Nuthin. Fear? Nerves? A pebble in my shoe?

It is that whole “snake eating it’s tail” that was throwing me. I could not recreate what was going on. There is no stack with pencil and paper. I can write it out and do them in my head until I needed a calculator, but even with a calculator, all I needed was a line:

5! = 5 x 4 x 3 x 2 x 1

I understood stacks in other terms (callbacks, pancakes), but the recursion was hurting my brain, until I made it a literal stack in my head. I was treating the part of the code block after the base case as a spiral when (for me) thinking about it as slapping 3×5 cards down. No wonder I didn’t understand the stack; I wasn’t treating it like one.

I’ve been playing with recursion and different tasks as I plow through books on algorithms and tech interview skills. Factorials and Fibonacci are the easier ones to grasp. Not easy. EasIER. Comparative. Like farts smell better than decomposing bodies. They don’t smell good, just better.

I wouldn’t say that I could whip out recursion any time, and I know that I wouldn’t want to with factorials (O(n2) and all that), but I’m getting there. I spent some time on JSFiddle and with my markers to play.

factorial_recursion

The code is old news.

const factorial = n => {
if(n===1){
return 1; //my base case
}
return n * factorial(n - 1); //my nut case
}

I did not set include checking to see that n is a non-negative integer. That was not the point of my doodling because checking for that was not the hard part. This post isn’t about a fully-tested function to return the factorial of a number; this is about me getting the recursive part.

100 Days of Code III and Codie Jodie

After going 150+ days in the second round, I put this challenge to bed.

Until this year. On the first, I started the challenge over. I will adjust some of the rules as they’re rigid (to me). They’re better rules for those not taking classes and following tutorials. I am doing both. I won’t count classwork or homework as part of the challenge, but I will count any supplemental tutorials or mini-projects. In doing so, I hope to balance my days. If I’m learning NodeJS, then support that with a tutorial, but also keep the UI and frontend fresh with a small snippet, bit of research, or a little project.

Don’t we all need to keep our backend and frontend fresh?

My first few days have been dedicated to finishing Wes Bos’s Learn Node tutorial. This makes my fourth completed WB tute: JavaScript30, What The Flexbox, React for Beginners, and Learn Node. I am always working on ES6 for everyone. I start that one over all of the time to get the practice in. When he releases his CSS grid tutorial, I’ll do that one, too.

Learn Node is a large project that jumps into Node at the late beginning stages. No play in the terminal. Just starting off index and Express, requiring, exporting … He’s taken care of the project decision (a Yelp-like app) and the styling. While at first I felt overwhelmed, by the end, I felt this was a great way to see what it is like to come into a project other people have started.

Now I’m ready to do another that is more ground up. Hello, Andrew “Fantastic” Mead. Honestly, he says “fantastic” all of the time. I like to pretend he has to force himself to say “fantastic” or else he’ll end up saying “fucking awesome”. He’s also like a hot Pee Wee Herman.

Two different styles. I like them both.

But all of this Node is leaving my fronted out to get stale. Ha ha, Code Matey! Not for long. Every workday I have to look at horrible Secretary of State websites. They’re just awful. And you know what has happened. Some manager has dumped the web and online content management to someone who was good with email. Poor sod is already overworked and now has to build and maintain the website.

I do not want to be the person who laughs at ugly sites. They are the same people who love correcting other people’s grammar. Thou shalt not be a dick. Ever. Or we shall try not to, and we shall scold ourselves when we get high and mighty.

Instead of mocking the websites, why not use them as a way to learn and practice the CSS grid system and keep up with Flexbox? (Screw you, Bootstrap. You bore me and junk up my HTML!) The content of those sites is pretty boring. Or at least the section I have to visit. I’d have to keep it ipsummy loremmy. All I care about are the colours, layout, and responsiveness. We’ll see. It’s an idea.

As is Dressy Bessy or Codie Jodie! The doll, which I never had, seemed to have all the fun things: snaps, a button, zipper, laces. She was a shocking mess for fashion, but her purpose was to teach kids to zip, tie, snap, fasten, and whatever else you can do with clothing. Taking notes about the states’ SoS sites, I got to thinking about just the states in general. 50 states. About 50 weeks in a year with two for fluff time. Why not a state a week that had facts about the state, some decoration, enough boxes and divs to fill a page, buttons that did things, etc? Wouldn’t be pretty, but if the only goal is to practice frontend play, why not? Codie Jodie. She’s got buttons, a responsive grid, some css animations, jQuery plug ins, …

Again. We’ll see. I will need to have all things outside of the class and its homework be short and sweet. Not interested in losing more time.

Planning to plan. On it!

Even boot camps have busy work

I am not going to throw anyone under the bus. What a cliché and totally irrelevant in Austin. No one here rides the bus or the one train. The most I can do here is throw someone under the car driven by someone texting or posting to social media. No matter who is behind the wheel and what those wheels are carrying, I am not throwing anyone under it.

Yes, I got my first lot of busy work from my boot camp, but I’ve given out busy work (I am sure of it) as has everyone who has ever taught or been in charge of curricula.

Busywork is mostly caused by laziness on the side of the teacher or curriculum team, but it’s sometimes caused by lack of time or even the challenge to make an exercise to practice a new skill relevant. It’s not always easy to do and instructors have to both teach the skill, make sure most of the students have a working grasp before they’re set off to be assessed. Sometimes teachers come up with a great way to enforce the new skill or show where it’s used. Other times the ideas just do not come, and they don’t get to pause time to let the ideas come. That is teaching life.

I remember coming up with the best ideas ever. So much ever that I should write everrrrrrr. Other times, I just was stuck. They need to practice this, but I am just forcing some silly situation where this new skill would be used.

I just had my first busywork homework assignment. I didn’t have time to do the more challenging “rock, paper, scissors” game. That is another blog post about defensive driving online classes interfering with coding, but LET US NOT GO THERE, PEOPLE! After trying the RPS game and writing the pseudocode, I realized that I could not complete that to my liking. (Do not speed, people. The consequences pop up everywhere.) I switched to the train scheduler, and immediately regretted it.

The idea behind the train scheduler is to practice using Firebase and also MomentJS. Perhaps the two should not have been combined. Just practice with a little in-class work for MomentJS and then come up with your own way to use it however. Let the Firebase practice be however the student wants to make it. As it is, I am turning in the most unrealistic project ever. No one who has used a departure board would believe this. We are required to use Military time (not 24-hour time, but Military). I’ve lived in cities with a thriving public transportation system in the US and overseas. None uses military time. All in the US have used 12-hour time with am/pm. I offered a screenshot of Penn Station’s departure board. The old one and the screens that replaced it use the 12-hour system (Old and new Penn Station Departure Boards). The stations I used in Europe and in Australia use the 24-hour time with colons. Military time does not use colons. So there’s that.

Another thing that bothered me was that the basic assignment was to use input forms. Who would do this? No one would build a program that would have people type in names such as Waxahachie, Poughkeepsie, or Chattanooga. Destination stations would be set and either typeahead or a drop-down would be available. Typeahead I got to work but struggled with capturing the value when I had only Pen written and wanted Pensacola. That’s ok. I am cool with that challenge, but not in a short time. So I started to disconnect. I could not stand making a train scheduler so unrealistic. The other issue I had was writing down the train line names. They’d also already be in. Three disconnects (time, destination, line names).

I did enjoy the challenge of using MomentJS, which is not intuitive to me. Not yet. In struggling with the will to do the homework at all and the desire to learn Firebase and MomentJS, I thought that the better idea would have been to admit that both skills are better learned practicing à la worksheet. Forcing them together in a short assignment was just that — forced.

I have not permanently set it aside. I’d like to return to it either after the boot camp has finished or over the winter break to deal with typeahead or a dropdown and then edit. I do not think that the average station master would be adding these lines. They’d have been added months ago. Lines do not change that often. If anything, I’d like to know how to edit the arrival time without changing the original. I’d also rather deal with the styling to warn people when there are less than 5 minutes before the next train. I’d also take out the Boo’strap. I use it to practice it, but, to me, Bootstrap is for those who don’t like to style. I lerve it.

So yeah. It was busy work and totally unrealistic, and I put the effort I saw my own students do when I did that to them. Empathy goes a long way. I get that students will get bored or disconnected, but educators also get stuck for ideas.

Now, about that online defensive driving course …

 

(This was today’s 750words challenge. today’s stats)

750Words d3: Ideas (picture books)

Whoo hoo! I’m three for three in the goal of forever! I’ll take it. I won’t publish them all. The purpose of 750Words.com is to just write. It is not to write to you. Sometimes I’m too whiny, sad, or mad. Enough yuck out there without my adding to it.

This topic came to me as I work through a VueJS tutorial by Maximilian Schwarzmüller. I like to have a plan build as I learn. I find it especially helpful as I’m getting smaller chunks in with an instructor like Big Max. Because his tutorial is organised into small chunks, I have little breathers that allow me to think to myself, “How would I use this?”. I could say that after an hour, but then the “this” would be more about a larger concept instead of smaller tools. It’s harder for me to think “How will I use Vue” or “What will I build with Node” than to ask myself how I could use changing the style dynamically with Vue and a method.

I have more time now to think, plan, and write. Not much more time, though, so let me just publish this and move on to my next lesson. (today’s stats)


When I taught math to 4th graders, I loved reading aloud from picture books. People can blather on about chapter books as though a child must graduate from picture books to chapter books completely. Books are no classrooms; however, you learn plenty from them. I believe that a good picture book offers so much more to the reader than what a chapter book can. Mind you, I love fiction and wish I had unlimited funds so that I could sit home and read and not apply for jobs. I am not here to compare the two as though one is better. There’s enough of that bullshit between childless-by-choice and parents, stay-at-home moms and “working” moms (“”s of sarcasm as we know that SaHMs work plenty).
Although I was a math teacher, I read to the children plenty. One group could handle “Flatlands” even. Expurgated. I’m not a fool. The kids were 9 and 10. There were some things they weren’t going to hear for the first time in their math class! I also read “Where the Red Fern Grows”—not once without snotty tears. But what I absolutely loved the most was finding a beautiful picture book. I loved a good story and the complementary pictures. Read, show, read and show. A good story does not have to be a long one. For me, length is how it stays with me.
Mostly the stories I read were what you might think about when you think of a picture book: an adventure, a lesson learned, a special someone, cute animals, etc. That’s what I thought of when I started teaching, but we had excellent librarians when I taught. They pointed me in the direction of picture books that explained math concepts: multiplication, exponents, geometry, etc. How awesome was that? I still refer to those books when I tell people that math and art are not separated. Proportion? Ratio? Geometry? Symmetry? Have you not heard of daVinci, Michaelangelo, Mondrian?
When I stopped teaching, I remember wanting to write children’s books to make math less frightening or to supplement a math concept. Wanting to write is much easier than deciding to write. Deciding to write is different from having the story and concept down.
It goes without saying that I have not written a book, but in the years since leaving the classroom one never leaves teaching), I have discovered my love of coding, specifically HTML/CSS, JavaScript and its libraries. I am currently getting my VueJS and NodeJS on, and while I’m learning them, my mind keeps returning to writing a picture book. I can’t draw. I can. Everyone can. I am not an artist one pays to draw. How is that? Clearer? Especially as I work through VueJS, I think about making a picture book with my words and my SVG illustrations.
Until I get skilled enough, I need a place to store ideas. I’ll start with a few here.
ABC BOOKS
I love ABC books. Edward Gorey is wonderful and a reminder that picture books and ABC books do not have to be cutesy. Why not one for math or narrow it down to geometry? If geometry, less about ABCs and more about just terms? I’m teaching coding to children (middle schoolers). What about the ABCs of dev. Or keep it to language or basics? What about a build-your-own ABC book? Let the student choose the theme, letter (no need to build ABCs in order), and supply their own images? The program could scale the images to the appropriate size. The child just needs to make the SVG on her own. I don’t know. Work with me here! What made me think of that one is that so many city- or town-specific books aren’t about the town the child hails from. Why not have Clare from Pooperville build an ABC book of her town? Andrew from Fartzburg might build the ABCs about what the people in his village do. Why not? ABCs of good deeds? Seriously, ABC books are unlimited as all they have to be is in alphabetical order. How is that for a scope?
I’m too new of a dev to have that be a theme for me, so I’d have to return to that.
RESCUE ANIMALS
I have greyhounds and have fostered them for years. I’m deeply concerned about their treatment by handlers and the industry. I know that some handlers and greyhound owners who race them truly do love their dogs, but the industry is not friendly. You, Mr Gentle Owner, may keep your hound long after she’s stopped winning and until a ripe age of 16, but we all know that is not the norm. Unfortunately, there are a lot of people who do not know a lot about the greyhound and don’t think of them as an option for a pet. “They must need a lot of space.” “They must want to run all day.” “They’re so big, and I have an apartment.” All myths. Greyhounds and other sighthounds won’t be for everyone—same with any breed—but the more literature that is out there, the more people will read and consider. Maybe a book will help a greyhound find its forever home, and maybe it will keep the wrong person from adopting and surrendering. No. Do not adopt a greyhound for you to do your 10k runs with. Usain Bolt is not a marathoner, right?
MATH (of course)
I specifically think of 4th graders as they’re at that cusp of going from concrete-sequential to abstract. I used to have a car covered in bumper stickers. Covered! All over. Not just on the bumper. In the middle of the back was one that read “I hate bumper stickers!”. Students who thought that was hilarious were ready for fractions. Those who were stumped and confused? Well, perhaps this year wouldn’t be the year they got fractions. There are so many ways to show math in a picture book: ratio, fractions (but please leave the cliché pizzas out), division, multiplication, factorials, … Of course, addition and subtraction, but that’s getting to an age I’m not aiming at.
AWFUL TOPICS
Huh? What? How hard is it to parent and bring up awful topics? I’m thinking about pet death, a parent’s job loss, bullying, body changes. There are many topics here, but to just write and include images without researching the topic and how to address it to kids? This is heavy. I’d have to be careful. I should be careful with any topic, but obviously these have an edge to them.

I hope to add more when I think of them. I should also probably quit adding and start planning, but that is another post!

ES6 makes the Hokey Pokey easy

As I make my way through various tutorials, some topics stick out more than others. This is especially true for tutorials that cover change. These are different from those that are about a new (to me) language or framework. For those, almost everything is sparkly and sticking out like a neon porcupine. There are the ah-ha moments, short for “Ah-ha, so that’s why this framework came to be needed”, but that’s not the same ah-ha I get when I learn about improvements to something that exists.

I’m following Wes Bos‘s ES6 for Everyone and had to stop for a few days after the section on swapping variables with destructuring. My first reaction was THANK CHEESES! My second was “Srsly, it took them this long to find their inner hatred of var temp?!” I always found this not only to be a pain for the extra lines but also for just the logic. I am all about logic puzzles like the River Crossing problem, but your code shouldn’t be a logic problem. It should be a logical solution.

Out with the old:

let footOut = "left foot";
let footIn = "right foot";
var temp = footOut;
footOut = footIn;
footIn = temp;
"That's no way to live your life!" - Wes Bos (my favourite Bosism)

I hated that. I can see it, but it doesn’t flow when I type it, and it’s never become automatic the way other things have (for-loops, named and anon functions, etc.). If I have to think about it every time, my time is wasted. I majored in German. I can get my head around change like shoving a conjugated verb to the end of a subordinate clause. I don’t need simplicity. I need speed, Ms. Mead. I need a flow, Moe.

Thus spake JavaScrusthra:

let footOut = "left foot";
let footIn = "right foot";
[footOut, footIn] = [footIn, footOut];

Short. Sweet. Complete. If this doesn’t matter to you, imagine writing an app for the Hokey Pokey. Too much? Then a function for shuffling.

Or don’t change at all. Stick with var temp = “Edsel”.

 

State the Rainbow of Fruit Colors

When I first started to learn ReactJS, state and props did my head in. I was learning mounds in a short time. Too short for a visual learner who likes to see the connections. I need time between lecture and homework to do my doodles. I did get it, though, and I learned to love React. I still do, but it is something that fades if I do not keep it up.

After too much time had gone by, I felt insecure with my understanding of state, so I revisited ReactJS with React for Beginners by Wes Bos. My instructors at The Iron Yard were clear and (ERMAHGERD) patient, but they were teaching live, so I could not stop them whenever I wanted, rewind what they said exactly, pause, repeat until I made sure my notes were clear to me. Sure, I could have recorded them myself, but what we see online has been scripted and edited. I want to repeat and review edited lectures. Online tutorials solve that problem for me. I sure miss my instructors helping me via conversation, though. I don’t get that in a tutorial. There are pros and cons to both. Apples and oranges, to use a cliché.

After many viewings of the section on state (clip 13), I was ready to write it out for reference. Although colouful, I crammed too much on a small piece of paper. By the time I realised it, it was too late to plan for scissors and tape. No big deal. The more I do this, the more it sets in.

beforenotes
Problem: State on one wee page

Solution: make state big and colourful like a jacked unicorn at a Skittles factory.

Step 1: Write the finished code in a bluhblah colour. No offense to navy blue. Optional step 1b is to make it look like real screens. If you do step 1b, then it’s mandatory that you do step 1c: quit stalling by colouring.

codedone
Code done: 1 page per js file

Step 2: Get comfy with your lap desk, relegate laptop to your shins, have a sentient being who thinks you hang the moon in case you need the ego boost.

armedandready
Getting read: Tutorial and Audience

Step 3: Go to town with colours, arrow, and notes. Know how you learn and learn that way. I kept my numbers in one colour but used other colours to separate my notes by theme or topic. I highlighted or underlined my code as needed. I gave all of zero rat arses for whether this makes sense to anyone but myself. My brain; my rules.

addfishform
Page 1: AddFishForm.js
app
Page 2: App.js
inventory
Page 3: Inventory.js

Et voilà! I glued and taped the sheets together and used tape to reinforce the edges. I am keeping The State Scroll forever!

afternotes
Final: State all gussied up
 While I was doing this, I got Vanilla Ice stuck in my head (you may have guessed from the start) and had “State state, baby” in my head for a few days. There is really only one way to get it out of my head. This is horrible, but it’s therapy:
Yo, VIP, let’s get it!
State state baby
State state baby
All right stop
Colour-code and listen
State’s not bad but I need intervention.
Something’s off; my notes are unsightly
Then I code like a zombie daily and nightly.
Will I get it?
Yo, I don’t know
Turn off the rules and I’ll flow.
To the extreme, I colour and I doodle
Fill up a page and scribble from my noodle.
Dance
Bum numb. Sittin on cushion.
The bigger the state the sweeter the pushin’.
Deadly, when my app gets stately,
So anyway I learn improves it greatly.
Colour and draw it
This is my own way
I better git push now
Don’t got all day.
React’s state was my problem
So I solved it.
Check out my notes while my colors resolve it:
State state baby. React. Jay. Ess.
State state baby. React. Jay. Ess.
State state baby. React. Jay. Ess.
State state baby. React. Jay. Ess.
Now let’s make an AddForm component

Render return and put a form on it.
Adding refs makes my form breathtaking
They hook up inputs to the object I’m making.

Refs takes in (input) and then fat arrow
this dot name is input, straight n narrow.
And I make an object with this info:
like name colon *this* dot name dot value.

Object is in this form, you know

But it’s not in state, so my App don’t know
Build a constructor()
and quick call super()
Why do that?!
Because you need *this*!
Keep on coding to the next step:
*this* dot ‘n’ state and I’m building me an object.
That state was bare.
Yo so I continued to create one much-needed method.
I update state, spread a copy in a new state,
but it’s not yet there so I update with a setState.
Jealous of this method of mine?
When I started out it was barely more than slime.
Ready for this method and kiss.
Constructor’s acting chill because it’s got bind(this)!
Now props, like a wave they’re swell
They send stuff to state, like a bat from hell.
Addin’ to the child component
make now a prop, this dot method
Bumper to bumper the App file’s packed
I’m moving to the child before my mind goes slack
Props on the scene
You know what I mean
I use props now, between the *this* and method.
React’s state was my problem
So I solved it.
Check out my notes while my colors resolve it:
State state baby. React. Jay. Ess.
Too bad, I’m not a talented poet.
I Googled my rhymes in case you didn’t know it.
AddForm, that created this here smackdown
Gets *this* dot props dot method all around.
‘Cause my style’s like a sewage spill
Queasy dull rhymes worse than a pneumonic drill.
Constructor, props, state:
They’re a hell of a concept.
I make it mine and you want to do your own.
Memories can fade, so I do what I can now.
Save like a git commit so fast
Better young devs say, “damn”
If my rhyme made you pissed.
I would take it on the lam.
Keep my composure when it’s time to code live.
Mesmerised by the job and I might nosedive.
React’s state was my problem,
So I solved it.
Check out my notes while my colors resolve it:
State state baby. React. Jay. Ess.

Yo Katy, let’s get out of here
Word to your developer.
State state baby. No toast. No toast.
State state baby. No toast. No toast.
State state baby. No toast. No toast.
State state baby. No toast. No toast.