Joel Zehring

Blog

Back to React with the Pic Click Game

tech bootcamp react

With a month left in my boot camp program, we're going all-in on React.js. For our first solo project, I built a memory-style game that works a little different than the typical matching game. It was great way to reinforce how React components pass props and how to manage and update state. That whole props passing thing cause me more than a few hang ups, but once I got the hang of it, things came together pretty well on the local development server. Deploying was another headeache, and after battling with Github Pages, I went to Netlify (where this site is hosted) and got the Github repo deployed with minimal effort or issue.

Deployed app here and repo here.

A New Music Scraper with MongoDB and Handlebars

tech bootcamp node.js express mongodb handlebars

Some boot camp projects come easy, and some require MongoDB and Handlebars. The goal for this project involved scraping a site for recent news articles, inserting parts of those articles in a MongoDB database, then displaying the scrapings through Handlebars views. Scraping with Cheerio was relatively easy, especially since my new job as Robotic Process Automation involves a lot of web scraping through UiPath. Things definitely got wonky once I started adding routes to the server.js file. Scraping took longer, and only a few articles were added to the database. Introducing Handlebars to view the articles added even more complexity, mainly by adding an extra syntax to keep track of. The app should include the ability to save and add notes to a given article, but that functionality will have to wait for a rainy day when I have more time to chip away at the project.

Deployed app here and repo here.

Friend Finder Express App

tech bootcamp node.js express

I've been slowly wrapping my head around back end development concepts, and all the effort has culminated in a simple Heroku app that takes user input, compares that input against a small set of data, and returns the best match. The components of the app are all routed through Express.js, which added a whole different level of complexity to the process of creating a deployable app. I got all the JavaScript and HTML wired up in Express and working over a local Node server, then slowly got the app logic hammered out across several server, routing, and jQuery files. The upside: it works! The downside: it's ugly. Nevertheless, the deployed app can be found here and the repo here.

jQuery Cheatsheet

tech javascript

jQuery may be past it's prime, but it can still play a key part in learning web development. Oscar Otero put up a sweet jQuery Cheatsheet that I find myself returning to frequently. It's a great way to browse jQuery selectors and methods and get a feel for some of the things JavaScript can do when it comes to manipulating the DOM and dynamically generating content.

Flexbox Cheatsheets

tech dev css flexbox

Website layout has always been tricky business, and it only gets trickier with the proliferation of different screen sizes and orientations. Flexbox is a great way to make a website responsive to the multitude of target devices. Beau Carnes has an excellent cheatsheet on the Free Code Camp blog, complete with animated illustrations:

https://www.freecodecamp.org/news/flexbox-the-ultimate-css-flex-cheatsheet/

Chris Coyier's Flexbox guide has been my go-to resource for a while. He includes several handy examples for common layout situations:

https://css-tricks.com/snippets/css/a-guide-to-flexbox/

freeCodeCamp Tucson Meet Up

tech

Had the chance to tag along at another meet up, this one connected with a Facebook group of folks here in Tucson leveraging freeCodeCamp for learning to code. What a great time. Something about talking code with smart people in real life... Here's one take-away for me: Wherever you're at in your coding journey, you're not alone. Someone has been through the same thing before you and would be happy to help you. Someone else newer than you would be happy to learn from you. And these people live in your town. Looking forward to the next one.

The React Tutorial I've Been Looking For

tech

React is just far enough away from plain HTML, CSS, and JavaScript that I've been having a hard time actually building with it. Then I stumbled across this tutorial on the official React site, and it slowly started to click. Now I've got a project with a few React components strung together to make a really basic random kid picker web app.

Regex is Hurting My Brain A Little

tech

Regular expressions basically give JavaScript super search powers. But the number of options and combinations of options quickly becomes overwhelming to my newbie brain. Time to find a cheat sheet for some lunch-break coding on my phone so I can get comfortable with in the ins and outs of regex.

My First Meetup with Tucson Web Stackers

tech

In a modernish meeting room on the third floor of the University of Arizona library, several web development enthusiasts sat scattershot around a handful of tables making introductions and testing the waters of talking tech. This was the setting for my first web dev meetup and my first effort to take my concentrated course of study from solo mission to collaborative effort. Some take aways:

  • Everyone in this meetup, save the organizer, was a first-time attendee. Started out more like an orientation than an established group, but that dynamic quickly changed as the facilitator of the meeting lead us through the lean coffee meeting method.
  • The UA Coding Bootcamp was well represented by current participants and recent graduates. A bunch of really smart folks from a variety of contexts. They all spoke very highly of their experiences with the boot camp.
  • Self-taught folks (like myself) were also represented, albeit to a lesser degree. Some really interesting projects and comments from this group, including some new ideas for the bootcampers to consider.
  • I left the group feeling inspired to keep on my current course of self-directed study. I may pivot to a coding bootcamp at some point in the future, but until then, my goal is to hustle and hack together my own bootcamp experience through freeCodeCamp, personal networking, and meetups. The folks at the gathering today were all extremely encouraging, so I like my chances.

My Web Development Journey (July 2019)

tech

I've been very interested in technology for a very long time. As a kid and an adult, I played with computers personally and professionally. As a teacher, I leveraged the web as a classroom tool and professional development resource. In my spare time, I hacked on Nintendo Wiis and flashed custom ROMs on Android phones.

In January 2019, I resolved to turn my interest and occasional hobby into a self-directed course of study. I started with Python, working through Guido van Rossum's Python tutorial.

I hacked together a couple simple Python apps and realized quickly that it was really hard to share these apps with my family to show off what I was learning. So in February I shifted gears to learn HTML, CSS, and JavaScript. I started with Jon Duckett's HTML & CSS, then moved on to Marijn Haverbeke's Eloquent JavaScript.

I found additional resources through Pima County Public Library, working through David McFarland's CSS: The Missing Manual in April.

With my new knowledge of HTML, CSS, and JavaScript, I hacked together my first web app: a Bible memory game. It's far from done, but it's been a good MVP to remind me that I can build and ship something of value.

In June, I found freeCodeCamp. I hustled through their Responsive Web Design program and claimed the first of six certifications. My prior study made it a little easier to complete, I think. Now I'm working through the JavaScript Algorithms And Data Structures program. The early topics are mostly review from my prior foray into JavaScript.

My goal: transition from a web development enthusiast to a web development professional.