<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Natalie Hummel</title>
    <description>The latest articles on DEV Community by Natalie Hummel (@nmhummel).</description>
    <link>https://dev.to/nmhummel</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F494363%2Fc1d030dc-27c4-416d-bf30-38b3c71d12ae.png</url>
      <title>DEV Community: Natalie Hummel</title>
      <link>https://dev.to/nmhummel</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/nmhummel"/>
    <language>en</language>
    <item>
      <title>Learning the Big O</title>
      <dc:creator>Natalie Hummel</dc:creator>
      <pubDate>Thu, 10 Jun 2021 04:25:57 +0000</pubDate>
      <link>https://dev.to/nmhummel/learning-the-big-o-1eod</link>
      <guid>https://dev.to/nmhummel/learning-the-big-o-1eod</guid>
      <description>&lt;p&gt;The concept of the Big O and Time Complexities is DAUNTING for a new software engineer, which is why I won't try to reteach it here. I will, however, dive a little into the two fastest "Order of N" complexities, with a concentration on using a Binary Search. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;TL;RD - Constant vs. Logarithmic Complexities + Binary Search&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I recently watched an excellent webinar from SkilledInc.com on the Big-O and &lt;a href="https://www.linkedin.com/in/michael-mroczka" rel="noopener noreferrer"&gt;Michael Mroczka&lt;/a&gt; broke down the concept in a fun ad interesting way. Many of you have probably seen this chart floating around on the internet:&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fuk746sar5siy05ao8hj6.jpeg" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fuk746sar5siy05ao8hj6.jpeg" alt="Big O Chart"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;If you look at the bottom of the graph, you'll see that the two fastest Time Complexities (TCs) are Constant O(1) and Logarithmic O(log N). "N" is the variable at play. In my Ruby project "Welcome to Westeros," the variable "house" below returns a parsed, JSON response, and serves as our "N" variable:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt; def display_house_details(house)
        puts "Name: " + house 
 end
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This method simply prints the name of the house in &lt;em&gt;Game of Thrones&lt;/em&gt;. Fortunately, I drastically reduced the the number of houses returned by the API so I wasn't dealing with a larger Max Input (the highest constraint an algorithm can handle before timing out). The above example would constitute a Constant O(1) TC because only one action is carried out and will always execute in the same time, no matter the size of the input. &lt;/p&gt;

&lt;p&gt;However, sometimes you have more complex methods. Take a LeetCode challenge during an interview. If you've ever noticed the below section at the bottom of the problem description: &lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F6r2o97rzs8fdhwas4dyp.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F6r2o97rzs8fdhwas4dyp.PNG" alt="Constraints"&gt;&lt;/a&gt;&lt;br&gt;
This tells you that the minimum input will be 1 and the maximum will be 10,000. (Side note: the Max Input for anything in the "horrible" region in our chart below could not handle this input, as it is generally capped at 5,000. This eliminates the possibility using some algorithms, like a Bubble Sort.) We need to use anything in between "bad" and "excellent." &lt;/p&gt;

&lt;p&gt;"Great, Natalie, but what does that mean?"&lt;/p&gt;

&lt;p&gt;Let's take a look at the next step down the TC tree at Logarithmic O(log N), more specifically, a &lt;a href="https://en.wikipedia.org/wiki/Binary_search_algorithm" rel="noopener noreferrer"&gt;binary search&lt;/a&gt;, whose average complexity is O(log N). I was taught this by a very patient mock interviewer, and now I shall pass it on to you. &lt;/p&gt;

&lt;p&gt;The concept of the binary search is to cut your workload in half with each pass of the loop. If you have a sorted array of numbers (our N), you won't know if it will contain 2, 12, or 2,000,000 numbers. If you have 2,000,000 names, a sequential search would have to perform 2,000,000 operations. Oh boy. Let that run and come back next week. Maybe it'll be done by then. But with the binary search, imagine going from 2,000,000 to 1 in roughly 21 movies. Much better than 2,000,000! Let's see it in action.&lt;/p&gt;

&lt;p&gt;I was going to map out a step by step example, but there are so many in existence and this animated comparison of binary and sequential searches really fit the bill: &lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fcabvdp5iq16igcnw4h4o.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fcabvdp5iq16igcnw4h4o.gif" alt="binary vs. sequential search"&gt;&lt;/a&gt;&lt;/p&gt;
https://devopedia.org/binary-search



&lt;ul&gt;
&lt;li&gt;The low is set at index 0. &lt;/li&gt;
&lt;li&gt;The high is set to length (17) - 1, which is index 16. &lt;/li&gt;
&lt;li&gt;Mid is set to (0 + 16) / 2, giving us index 8 (value is 23). &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;In the example, they are searching for the number 37. If 23 === 37, return 23. It's not, so we go on down to 37 &amp;gt; 23. It is, so we change our search area to by setting the low parameter to 8 + 1 (index 9 is a value of 29). If it hasn't been greater than 23, the high parameter would have changed. The loop continues in that manner until it is narrowed down to the target itself. &lt;/p&gt;

&lt;p&gt;Broken down into code:&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F20uusg2e5yvzaolwiea2.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F20uusg2e5yvzaolwiea2.PNG" alt="binary search in code"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Since the binary search only iterates through a fraction of the original input, it is still relatively quick with way fewer steps. This concept could also be applied as a &lt;a href="https://devopedia.org/binary-search" rel="noopener noreferrer"&gt;binary search tree&lt;/a&gt;, if you're into that kind of thing. &lt;/p&gt;

&lt;p&gt;I hope I scratched the surface of understanding for you with regards to the Big O. I plan to blog again with other TCs as more examples unfurl. In the meantime, if you need a cheat sheet of how the TCs rank, consider this handy guide, which I heartily approve of:&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fsjh0bp861gph8rd2rhmw.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fsjh0bp861gph8rd2rhmw.jpg" alt="I approve of this Big O Update"&gt;&lt;/a&gt;&lt;br&gt;
Now go back and look at that joke in the header and see if it clicks. :)&lt;/p&gt;

</description>
      <category>binarysearch</category>
      <category>javascript</category>
      <category>hireme</category>
    </item>
    <item>
      <title>Coding is like Art.</title>
      <dc:creator>Natalie Hummel</dc:creator>
      <pubDate>Sun, 21 Mar 2021 23:27:57 +0000</pubDate>
      <link>https://dev.to/nmhummel/coding-is-like-art-1bbh</link>
      <guid>https://dev.to/nmhummel/coding-is-like-art-1bbh</guid>
      <description>&lt;p&gt;Sometimes there's so much going on, but when you step back and see the end results, it's a masterpiece. It also took you weeks to create and you're not even sure you're going to show it to anyone. Maybe it can go in the portfolio one day but you never seem to be "finished" with it. My current project is going to be one of those constantly in-progress pieces. It's also centered around art, so I thought the simile was apropos. &lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fvkgg5uecmx78pgd6homa.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fvkgg5uecmx78pgd6homa.jpg" alt="Alt Text"&gt;&lt;/a&gt;&lt;br&gt;
My project, decUrator, allows you to browse the diverse paintings of the Modern Museum of Art (MoMA to its friends) in New York City. You can create rooms to store your favorite paintings and browse others' exhibits, too. Check out the demo below before we get all technical about it.&lt;br&gt;
&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/lkiR5eIi_0A"&gt;
&lt;/iframe&gt;
&lt;br&gt;
The backend of this project was created with Ruby on Rails. I had two models-- Painting and Room-- with a join table of Exhibiton. The frontend was created using JavaScript, with React as my framework and Redux to give me that sweet, global store action. The backend, like with my last JavaScript project ("Squared Away"), was not worked on as much as the front end. I used it to generate my API or seeded rooms and paintings. With a database of 1,994 paintings, I knew my frontend was going to have a field day trying to load that many paintings. To prevent that, I tweaked my index route like so:&lt;br&gt;
&lt;code&gt;paintings = Painting.order(:artist).sample(20)&lt;/code&gt;&lt;br&gt;
This allowed a random sample of 20 paintings to be loaded at the time. On the front end, that allowed me to fetch 20 new, random paintings with the click of a button:&lt;br&gt;
&lt;code&gt;&amp;lt;button onClick={refreshPaintings}&amp;gt;Click to see different paintings&amp;lt;/button&amp;gt;&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Side note&lt;/strong&gt;: You may be wondering why I had the paintings listed by order of artist, when all the results are random. To be frank, the .sample function was a temporary crutch during development. My true intent was to introduce pagination, but even that would mean scrolling through 100 pages of paintings. I plan to include a feature in the very near future to allow people to search by artist's name, nationality, gender, and more. &lt;/p&gt;

&lt;p&gt;Working in React was interesting. And just as I was getting comfortable with it, we learned how to incorporate Redux. Moving from a local state to a global store was beneficial, but also confusing. There was a day or two where I wasn't sure which was the proper way to accomplish a goal. (Extra fun: when you're working on the Ruby backend and keep trying to set a variable with 'let'.) One thing I knew for sure, though, is that the Connect feature is pretty awesome. &lt;/p&gt;

&lt;p&gt;Connect is a function that is part of the Redux family. It lives in the export line of each component that needs it and connects that component to not only the Redux store (our globally stored data), but also the functions it needs to dispatch actions to the store. There are two important arguments passed to this function-- mapStateToProps and mapDispatchToProps. I want to focus in on one of mapStateToProps' features-- ownProps. &lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;code&gt;mapStateToProps?: (state, ownProps?) =&amp;gt; Object&lt;/code&gt;&lt;br&gt;
If a mapStateToProps (aka 'stateProps) function is specified, the new wrapper component will subscribe to Redux store updates. This means that any time the store is updated, mapStateToProps will be called. The results of mapStateToProps must be a plain object, which will be merged into the wrapped component’s props. If you don't want to subscribe to store updates, pass null or undefined in place of mapStateToProps.&lt;br&gt;
You can read more about them &lt;a href="'https://react-redux.js.org/api/connect'"&gt;here&lt;/a&gt;. &lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;If you DO use stateProps, the first parameter given is the store state. If you use the optional second parameter, you get to use &lt;strong&gt;ownProps&lt;/strong&gt;, the attributes that are passed when the component is used. In plain React, these would be just called props. Take a look at my SingleRoom.js file below:&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fu6b4rk2g02deiqz1i9za.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fu6b4rk2g02deiqz1i9za.PNG" alt="SingleRoom"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;If I placed a debugger after line 9 and typed 'ownProps' and 'currentRoom' into the console, I would get a big red warning that neither is defined. Both live in the stateProps method. However, I was able to manipulate ownProps in that method to get the data I needed into a const called currentRoom. Notice on line 8 I am able utilize currentRoom by adding the prefix this.props-- this being the component, and props being its own props. Take a look at the console log:&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fs9b4gpsoil1eiv6ty4di.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fs9b4gpsoil1eiv6ty4di.PNG" alt="ownProps"&gt;&lt;/a&gt;&lt;br&gt;
We hit the stateProps function first where we see the ownProps and currentRoom variable on display. Following the path, we're able to get the id number of the room we're in using ownProps/match/params: {id: "3"}. Turn that into an integer using parseInt, and we have an actual number 3. Now we can take that room id and find not only its name, but also its paintings and map them out for all to see. &lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fxehv6dva6lfstdnkazdl.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fxehv6dva6lfstdnkazdl.PNG" alt="Room #3"&gt;&lt;/a&gt;&lt;br&gt;
Yippee skippy! Notice I did not need to call the dispatchProps function. Since we didn't need to return new functions that call dispatch(), the dispatch passed to my component by default sufficed. &lt;/p&gt;

&lt;p&gt;This project is my last official one as a student with Flatiron school. I've noticed that with EVERY project, I have doubted my ability to finish it and have it work properly. With this one, I thought for sure it would be the hill I would die on. As it turns out, I finished it in less time than my previous projects. (!!!) Every project week has involved a lot of self-doubt, but there's also been some triumphant moments: when that function I've been working on for an hour finally works right, when I make a cool feature using CSS, when I get no red warnings in the console. These are all moments to cherish and call back to when I'm feeling down. I encourage anyone questioning their abilities to recall how they felt during those moments, and to remember that there was also an "after this" moment that involved a nap and maybe a celebratory beer.&lt;/p&gt;

&lt;p&gt;Coding truly is like art. Some people will understand it, some won't. &lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fxkeyu8vysvyh55qs8zo2.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fxkeyu8vysvyh55qs8zo2.gif" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;One person's gibberish is another person's blood, sweat, and tears. &lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwhzlaum3sc15fg25uiub.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwhzlaum3sc15fg25uiub.gif" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;But the greatest thing about your masterpiece is that it is your very own. Well, yours...and maybe some folks posting on &lt;a href="https://stackoverflow.com/" rel="noopener noreferrer"&gt;StackOverflow&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Cover art: "Untitled", Sam Gilliam (2019)&lt;/em&gt;&lt;/p&gt;

</description>
      <category>react</category>
      <category>redux</category>
      <category>rails</category>
      <category>javascript</category>
    </item>
    <item>
      <title>I will have the last word.</title>
      <dc:creator>Natalie Hummel</dc:creator>
      <pubDate>Sat, 13 Mar 2021 02:39:50 +0000</pubDate>
      <link>https://dev.to/nmhummel/i-will-have-the-last-word-803</link>
      <guid>https://dev.to/nmhummel/i-will-have-the-last-word-803</guid>
      <description>&lt;p&gt;Or at least, the number of letters in it, using this &lt;a href=""&gt;LeetCode challenge (#58)&lt;/a&gt; solution. My cohort colleague, Chay, and I paired up to tackle this one in JavaScript. Let's take a look at the rules:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Given a string &lt;code&gt;s&lt;/code&gt; consists of some words separated by spaces, return &lt;em&gt;the &lt;strong&gt;length&lt;/strong&gt; of the last word in the string. If the last word does not exist, return&lt;/em&gt; &lt;code&gt;0&lt;/code&gt;.&lt;br&gt;
A &lt;strong&gt;word&lt;/strong&gt; is a maximal substring consisting of non-space characters only.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;If you've ever done a LeetCode challenge, you know how talented they are at coming up with ALL KINDS of examples to test against your code. Your three-line solution becomes an 'if' statement becomes an 'if / else if / else' statement. Words and characters you've never dreamt of come out of the woods to test your code and your patience. This challenge was no exception. &lt;/p&gt;

&lt;p&gt;We knew we'd need to find a way to call the last element in the array. But to get there, we needed a workable array. Taking string &lt;code&gt;s&lt;/code&gt;, we used &lt;code&gt;.split(' ')&lt;/code&gt; to break up the words. We experimented in the console and found we were on the right track. Using their starter code:&lt;br&gt;
&lt;code&gt;var lengthOfLastWord = function(s) {     }&lt;/code&gt;&lt;br&gt;
and their example #1, &lt;code&gt;s = "Hello World!"&lt;/code&gt;:&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fc56afrzywqtm547ls7ti.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fc56afrzywqtm547ls7ti.PNG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;We got the length of the last word! First example is a success. After the splitting worked, giving us two items in an array (and its length, 2), we were able to subtract one from the total array length to give us the last word of the array ("World"). Grabbing the length of that, we have 5. Alert the press! &lt;/p&gt;

&lt;p&gt;Onward to example #2: &lt;code&gt;s = " "&lt;/code&gt;! Originally, we wanted to account for this value as a part of the &lt;code&gt;if/else&lt;/code&gt; statement:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;if (s === "") { 
       return 0
    } 
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;But through the hidden examples, we realized we didn't account for &lt;code&gt;s = "  (many spaces)    "&lt;/code&gt; and other such madness. Fortunately, while I was talking to the invisible duck in this blog post, I realized I could shorten my original solution and use the same code for example #1. Thanks, duck!&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;var lengthOfLastWord = function(s) {
    let words = s.split(' ')
    let lastWord = words[words.length-1].length
    return lastWord
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This works for both their provided examples. Done, right? Not quite. We were thrown a curveball with &lt;code&gt;s = "a "&lt;/code&gt;. Well shoot, someone got lazy or crazy. Time to regroup and Google how to &lt;em&gt;trim&lt;/em&gt; whitespace. Enter the &lt;code&gt;.trim()&lt;/code&gt;, a groovy little method that weeds out the lazy/crazy whitespace in a string. Its siblings, trimEnd (aka trimRight) and trimStart (aka trimLeft), allow you to trim before and after the "legible" content, should you need more specific trimming. Since we need to account for all possibilities, we better use regular trim. We added it to the very beginning of the function to prevent more surprise-space heartbreak:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;var lengthOfLastWord = function(s) {
    let trimTheFat = s.trim()
    let words = trimTheFat.split(' ')
    let lastWord = words[words.length-1].length
    return lastWord
}  
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This current solution won't work, though. When we split "a ", we are left with ["a", ""]. We have two items in this array and one is not welcome. Technically, the last official word of the original string is "a". We gotta &lt;em&gt;pop&lt;/em&gt; that last "" off! Let's use &lt;code&gt;.pop()&lt;/code&gt;, shall we? If the last element in the "words" array is "", we'll pop it off the end and return words without it.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;var lengthOfLastWord = function(s) {
    let trimTheFat = s.trim()
    let words = trimTheFat.split(' ')
    if (words[words.length-1] === ""){
        words.pop()
        return words.length
    } else {
        let lastWord = words[words.length-1]
        return lastWord.length
    }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;One caveat-- &lt;code&gt;.pop()&lt;/code&gt; is a destructive method, which means it changes the construction of the original array. That is why when we returned "words" after the pop, it returned the array without our dangling double quotes. I was fine with a little destruction, as it was not specified in the instructions and I was getting hungry. &lt;/p&gt;

&lt;p&gt;After several examples were tested, we submitted the solution and it passed. Chay and I were elated and felt like developer gods. Reminder-- this was an easy challenge. It didn't take a lot to get us excited. But for a couple of students new to this crazy world, I think we did a-ok. &lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fujx57nyrxfvgj8qg3a3v.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fujx57nyrxfvgj8qg3a3v.jpg" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>leetcode</category>
      <category>javascript</category>
    </item>
    <item>
      <title>Nevertheless, Natalie Hummel Coded in 2021!</title>
      <dc:creator>Natalie Hummel</dc:creator>
      <pubDate>Mon, 08 Mar 2021 22:41:33 +0000</pubDate>
      <link>https://dev.to/nmhummel/nevertheless-natalie-hummel-coded-in-2021-1aj8</link>
      <guid>https://dev.to/nmhummel/nevertheless-natalie-hummel-coded-in-2021-1aj8</guid>
      <description>&lt;p&gt;As a young girl, we always had a computer in the house. My father was always tinkering with them and allowing us to explore within them. He would often build complete systems from scratch for friends and relatives and I tried to pay attention as best I could. &lt;/p&gt;

&lt;h2&gt;
  
  
  College Daze
&lt;/h2&gt;

&lt;p&gt;When I got to college, I wasn't sure what I wanted to do for my career quite yet. I enrolled in the Designing Websites interim class and became enthralled with HTML and CSS. Once the class ended, I continued to experiment. I would find inspiration in a beautiful piece of art and create a whole template around it. I had several accounts with the earliest, free web hosting sites, such as Angelfire and Geocities, and had several blogs to practice with. As a result, I decided to major in Computer Science. (I think some of you can already predict the awakening I was in for.)&lt;/p&gt;

&lt;p&gt;Computer Science at a liberal arts college in 1999 was not what I expected it to be. The curve the courses took 2-3 classes in was dramatic. We jumped from PASCAL to C++, which to me seemed like a pianist going from 'Chopsticks' on to 'Flight of the Bumblebee' in five lessons. I struggled. A lot. I cried. I had a breakdown one night and took stock of many things and looked at the facts:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;I was a junior in a competitive college, with the pressure to graduate on time. &lt;/li&gt;
&lt;li&gt;I got my first "D" in any class. Ever.&lt;/li&gt;
&lt;li&gt;Only 3-5% of the Computer Science department at Birmingham-Southern were females.&lt;/li&gt;
&lt;li&gt;What I WAS learning was not what I wanted to BE learning.&lt;/li&gt;
&lt;li&gt;I no longer saw my vision of a career in technology coming true. &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;For these reasons and more, I did not feel confident at the time that I would be successful upon graduating. Therefore, I changed majors and played with my blog layouts on the side. I do regret, at times, not sticking with the major. I have also wondered what it would have been like to have gone to a different school, or to even be an undergrad in today’s world now that the college has broadened their offerings to match the changing times. &lt;/p&gt;

&lt;h2&gt;
  
  
  The Rat Race
&lt;/h2&gt;

&lt;p&gt;After graduating with a BA in English, I took a job nowhere in that field (job != editing || writing). And so it went for 20 years, a series of employment that mostly paid the bills and kept a roof over my head. Don't misunderstand me, though. Each job brought amazing experiences and people into my life and I look back fondly on each. (Except for you, lastStrawJob. You know what you did.) In March 2020, I found myself unemployed and at a loss for what to do next. COVID Quarantine kept me home all summer and by the time it seemed right to start looking again, I dreaded it. &lt;/p&gt;

&lt;h2&gt;
  
  
  Happy Ending?
&lt;/h2&gt;

&lt;p&gt;Apparently, in those 20 years, there were a lot of changes to society and technology AND to the opportunities to learn. I don't even recall how I first stumbled across &lt;a href="https://www.ncwit.org/"&gt;NCWIT&lt;/a&gt;, but they have changed EVERYTHING for me. Thanks to them and their &lt;a href="https://www.aspirations.org/"&gt;Aspirations in Computing&lt;/a&gt; program, I started to believe, once again, that I could make computers and programming my career. With their generosity, I started Flatiron School's Software Engineering track in October 2020. I am now in the last module, React.js, and have started working with one of their career coaches. After so long of having &lt;em&gt;jobs&lt;/em&gt; in different fields, I am so close to starting a &lt;em&gt;career&lt;/em&gt; in an area I have always admired. &lt;strong&gt;It is never too late to find something you love.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Wish me luck with my upcoming job search, and enjoy this Flamenco Gator. &lt;br&gt;
&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F3t3bxfk5qa2i0hs3weh4.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F3t3bxfk5qa2i0hs3weh4.gif" alt="Guitar Noodling" width="728" height="408"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>wecoded</category>
    </item>
    <item>
      <title>Consider THIS</title>
      <dc:creator>Natalie Hummel</dc:creator>
      <pubDate>Sun, 21 Feb 2021 07:04:59 +0000</pubDate>
      <link>https://dev.to/nmhummel/consider-this-3bp5</link>
      <guid>https://dev.to/nmhummel/consider-this-3bp5</guid>
      <description>&lt;p&gt;Okay, Whovians, this one's for you. I decided to make my JavaScript project Doctor Who themed and created a game where the Daleks must collect all the TARDIS (Tardi? Tardises?) in the fewest moves as possible. It's a simple game, but was NOT simple to make. I am not sure why the majority of my cohort decided to create games using the language we struggled with the most, but some of us certainly reached for the stars. I think we were eager to make something more...dynamic? Go big or go home!&lt;/p&gt;

&lt;p&gt;JavaScript is a tough language to learn, but it can also do so many things. You could code your entire index.html page without actually writing anything on it. Everything on the front end could be done on the JS page. Should it be? Probably not. Plus, coding CSS and HTML is too much fun in my opinion. One of my favorite things about JavaScript is "this." I know it sounds like an Abbott and Costello act is about to break out, but I wouldn't do that to you. Yet.&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--UVcqXfuZ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h2o14utxhwz0u3zusymg.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--UVcqXfuZ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h2o14utxhwz0u3zusymg.png" alt="BS"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;So what is this? THIS refers to an object, that object which is executing the current bit of JavaScript code. It has different values depending on where it is used. If you had ZERO CODE in your .js file, opened up the index.html page, and put the word "this" in your console log, you would see "Window", because that is literally all you have. Just a blank page with a promise of more. According to &lt;a href="https://www.w3schools.com/js/js_this.asp"&gt;w3Schools&lt;/a&gt;:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;In a method, this refers to the owner object.&lt;br&gt;
Alone, this refers to the global object.&lt;br&gt;
In a function, this refers to the global object.&lt;br&gt;
In a function, in strict mode, this is undefined.&lt;br&gt;
In an event, this refers to the element that received the event.&lt;br&gt;
Methods like call(), and apply() can refer this to any object.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;My favorite use of "this"?&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--79eNOPkp--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tju38xlda6005qszj229.jpeg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--79eNOPkp--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tju38xlda6005qszj229.jpeg" alt='console.log("is your friend")'&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Meet your new best friend! Along with using debugger in your code, console logging "this" is the most helpful tool for any JS coder. Debugger is helpful when testing out code, but sometimes you don't know what code to even try. When refreshing your index.html page in your browser with the inspect console open, everything that is console logged with "this" will reveal what it represents. This is so helpful when you're trying to determine what data you need to manipulate, and if your output is what you expected. I put this line of code everywhere: in my class constructors, fetch requests, ".catch" errors, and event listeners.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--D9YYquX9--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8o1u4hl8tldiw7n9ubfw.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--D9YYquX9--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8o1u4hl8tldiw7n9ubfw.PNG" alt="Do you see what I see?"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;THIS is one of the many perks of using JavaScript in an object-oriented manner. Combined with Rails on the backend rendering my API's, it made it easier to transition into more difficult concepts. I was almost hesitant to code outside of my defined classes for fear of losing my access to THIS. It was just so convenient! Bonus-- after the 20th "this" in my code, I couldn't stop singing R.E.M.'s "Losing My Religion." &lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--3tIVk-46--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0gyf1jwvdhdxl9fuj7ye.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--3tIVk-46--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0gyf1jwvdhdxl9fuj7ye.gif" alt="Losing My Religion...and Sanity"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;For all your programmers out there:&lt;br&gt;
&lt;strong&gt;What are some of your favorite uses for THIS?&lt;/strong&gt;&lt;br&gt;
Leave me a comment and let me know. &lt;/p&gt;

&lt;p&gt;I do have plans to upload the project onto Heroku, but in the meantime, feel free to &lt;a href="https://youtu.be/pAt8B0xo790"&gt;download the game from GITHUB&lt;/a&gt; and have fun with it. &lt;/p&gt;

&lt;p&gt;And in the meantime...&lt;a href="http://downloads.bbc.co.uk/doctorwho/s1/s1_06/audio/s1_06_aud_03.mp3"&gt;EXTERMINATE!&lt;/a&gt;&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>rails</category>
      <category>firstyearincode</category>
    </item>
    <item>
      <title>The Paths of Least Resistance</title>
      <dc:creator>Natalie Hummel</dc:creator>
      <pubDate>Mon, 25 Jan 2021 05:32:42 +0000</pubDate>
      <link>https://dev.to/nmhummel/the-paths-of-least-resistance-3k1i</link>
      <guid>https://dev.to/nmhummel/the-paths-of-least-resistance-3k1i</guid>
      <description>&lt;p&gt;My latest offering to the world comes in the form of a movie database, dedicated to those horrible movies that make us question our sanity, our sense of humor, and just how someone earned the money to make such a horrific, monstrosity of a film. If you are fans of RiffTrax and MST3K, or just terrible films, in general, I invite you to try out &lt;a href="https://github.com/nmhummel/best-worst-movies"&gt;SCHLOCK FLOP&lt;/a&gt;. On a scale of 1-5 (5 being the worst), you can rank movies based on several attributes, such as editing, acting, and if you would watch it again. It's a great way to find a new movie to rip to shreds. Take a tour in the video below:&lt;br&gt;
&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/9CjF4UbVIog"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;This baby was created with love using Ruby on Rails. If you have never used Rails before, then the best way to sum it up is, "The harder it gets, the easier it gets." Ruby and Sinatra were such green meadows in my life until we started learning how to make our applications smoother and fancier. Concepts that I had a great grasp on were suddenly reworked and repackaged. My old pal HTML was forced to play with these new ERB tags, and I was resistant at first. My attitude changed when I was introduced to: &lt;br&gt;
&lt;strong&gt;&lt;a href="http://localhost:3000/rails/info/routes"&gt;http://localhost:3000/rails/info/routes&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--dHSFSXne--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/vdylss7ho9dzgkez4eg7.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--dHSFSXne--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/vdylss7ho9dzgkez4eg7.PNG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;You mean to tell me I don't have to keep up with how to link to my triple-shallow-nested routes and views? Well butter my biscuit! Look at how easily these link_to's are now (that's &lt;code&gt;&amp;lt;a href=""&amp;gt;&lt;/code&gt; for your old schoolers):&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;%= link_to "Rank this Flop", new_movie_ranking_path(@movie) %&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The ERB tags, affectionately called Squid &amp;lt;%= and Ice Cream Cone %&amp;gt;, allow you to use Ruby in an HTML file. According to the image above, instead of remembering the nested route &lt;code&gt;&amp;lt;a href="http://localhost:3000/movies/4/rankings/new"&amp;gt;Rank This Flop&amp;lt;/a&amp;gt;&lt;/code&gt;, we can simply refer to the &lt;code&gt;new_movie_ranking_path&lt;/code&gt; and it will autogenerate that long URL for us. The &lt;code&gt;(@movie)&lt;/code&gt; is the argument for which movie page to go to (4, in our example).&lt;/p&gt;

&lt;p&gt;There are other features, too. Notice that the image contains the word "rank" in the path search box. When you have a project that easily has 10+ models and a rails-info-routes list that is 5 pages long, a search feature is a must. All of my rank-involved paths were pulled up so I can easily reference where I needed to steer the viewer.&lt;/p&gt;

&lt;p&gt;BUT WAIT! THERE'S MORE! See that last column? That's right-- your routes are listed, too! This tells me that I have 7 RESTful routes needed to have a well-rounded application. The whole gang is here-- index page, show, edit, and more. Notice, too, that the column for HTTP verb ensures that you have all your CRUD actions in place. For example, &lt;code&gt;rankings#destroy&lt;/code&gt; means that, in my Rankings Controller, I can define the routing method for "destroy", use the CRUD method DELETE, and remove an instance with only three lines of code:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;    def destroy
        @ranking = Ranking.find(params[:id])
        @ranking.destroy
        redirect_to movie_rankings_path
    end
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Life. Is. Good. I may have been stubborn in the beginning, but working on this application has truly cemented some amazing new concepts that I cannot wait to use again and again. &lt;/p&gt;

</description>
      <category>ruby</category>
      <category>rails</category>
      <category>css</category>
    </item>
    <item>
      <title>It's a Mad, Mad World</title>
      <dc:creator>Natalie Hummel</dc:creator>
      <pubDate>Sat, 12 Dec 2020 07:12:06 +0000</pubDate>
      <link>https://dev.to/nmhummel/it-s-a-mad-mad-world-4mi9</link>
      <guid>https://dev.to/nmhummel/it-s-a-mad-mad-world-4mi9</guid>
      <description>&lt;p&gt;One of my favorite things to do with my family is play MadLibs. We are all grown adults, but we still love it like we were 12-years-old. (Yes, we still use funny words like "smelly" and "dingleberries.") So, for my second project with Flatiron School, which combined Ruby + Sinatra + ActiveRecord, I decided to make a MadLib application where YOU can write some awesome, nerdy MadLibs. I had planned on providing 3-4 stories to choose from, but my focus was coding, not writing. Therefore, I only wrote one story-- &lt;a href="https://github.com/nmhummel/mad-mad-world"&gt;A Better Star Wars Holiday Special&lt;/a&gt; (because no one liked the original).&lt;br&gt;&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--sk8b8iBW--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/46x4byyv3bfyacaza1v1.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--sk8b8iBW--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/46x4byyv3bfyacaza1v1.jpg" alt="Alt Text"&gt;&lt;/a&gt;&lt;br&gt;
It works just like the original &lt;a href="https://www.MadLibs.com"&gt;MadLibs&lt;/a&gt;. I provided a list of fields to fill in-- noun, verb, animal, etc.-- and based the revealed story off the classic poem, "The Night Before Christmas." I tweaked the original poem and added a lot of well-timed blanks, creating such shenanigans as, "When what to my &lt;strong&gt;pink&lt;/strong&gt; eyes did appear, but a miniature &lt;strong&gt;First Order TIE Fighter&lt;/strong&gt; and &lt;strong&gt;5&lt;/strong&gt; tiny &lt;strong&gt;Wookiee&lt;/strong&gt;!" &lt;/p&gt;

&lt;p&gt;The features I included allow users to:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;create and delete a user account&lt;/li&gt;
&lt;li&gt;validate username, email, and password&lt;/li&gt;
&lt;li&gt;keep the password secure and local&lt;/li&gt;
&lt;li&gt;create, edit, and delete stories&lt;/li&gt;
&lt;li&gt;view all their stories in one place, with time created/updated&lt;/li&gt;
&lt;li&gt;view all stories created by all users, with time created/updated&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Having spent the past few weeks learning the behind the scenes components individually, it was a bit challenging when using them all at the same time. You can't just "INSERT INTO html (views, pages) VALUES (dynamic routes, .erb files)". (Sorry-- programming humor.) You have to make sure they can all work together. Learning SQL was very helpful, but how you learned to code it isn't always how you use it. There are gems and helpers and all kinds of applications that do a lot of the hard work for you. One caveat-- you have to learn THEIR languages to utilize them. However, once you get a grip on all those shortcuts, tags, and methods, life really DOES get easier!&lt;/p&gt;

&lt;p&gt;My favorite shortcut was using the gem &lt;a href="https://github.com/faker-ruby/faker"&gt;Faker&lt;/a&gt;. Faker generates fake data based on what information you need. It was nice to have some real data to seed my database without writing it myself over and over again. The best use of this application comes into play when a user gets tired of coming up with words for the story. If you leave a field blank, Faker will provide an appropriate answer for you. Leave them all blank and watch the madness unfold!&lt;br&gt;
&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/Lib6SwjtsPo"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;Using Faker, however, also presented me with my biggest challenge. How do I root out the empty/nil values in the user's hash (@starwars) and replace those with the corresponding values from the Faker hash (@faker_hash), without writing over EVERY field? I would have to iterate over both hashes and somehow get their keys to match up, compare the values, and see which values are blank, etc. etc. etc. I tried elaborate methods using "if value.empty?...", some direct SQL, and a bit of voodoo and nothing seemed to work. Enter my cohort leader Jenn and the magic .send method!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--FEO71rMg--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/zj8lngmsiz54e3hlp1c5.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--FEO71rMg--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/zj8lngmsiz54e3hlp1c5.PNG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;.send() is an instance method in Ruby's Object class that allows you to call any method without knowing its name. It uses dynamic dispatching to send a method to an object without being explicit about the method’s contents within our application. It is kind of hard to comprehend until you've either repeatedly used it or noticed it being used in other ways. Jenn is a big fan and encourages us to utilize it more. Since this is &lt;em&gt;my&lt;/em&gt; first time using it, bear with me as I try to explain its magic. &lt;/p&gt;

&lt;p&gt;In the above example, I have class Starwar with a long hash of Faker data. I needed the .send method because I had an argument-- the @starwars hash, compiled of data entered by the user-- but I didn't know what data would be in there. But I still have to do something with it based on what it turns out to be. If the value of, say, the key named verb_3, is empty, I need to replace it with a fake verb_3 value. But how do you work with what you don't know? I certainly didn't want to perform an "if/else == this" 27 times! In my code snippet above, I created the method, faker_hash, who's only job is defining @faker_hash with a bunch of fake data. In the method fill_in_the_blanks, I used .each to iterate over the values in @faker_hash to get its keys and values. Using the argument of the object key (verb_3) from the method faker_hash, we called the .send method on class Starwar and checked to see if the key of the @starwars hash has a value of empty (" ") or nil.  If they are, the .send method is used again to call the setter key= method and set it to the value of faker hash's key. &lt;/p&gt;

&lt;p&gt;Confused? I don't blame you. It is hard to operate in this kind of vague work field. I do recommend checking out some more examples of .send and metaprogramming, such as the ones &lt;a href="http://vaidehijoshi.github.io/blog/2015/05/05/metaprogramming-dynamic-methods-using-public-send/"&gt;here&lt;/a&gt;, &lt;a href="https://teamtreehouse.com/community/what-does-the-ruby-send-method-do"&gt;here&lt;/a&gt;, and &lt;a href="http://ruby-metaprogramming.rubylearning.com/html/ruby_metaprogramming_2.html"&gt;here&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;I had fun with this project, despite my trepidation towards the beginning of the week. I am feeling more confident about Ruby in general, but have enjoyed getting to use it in relation to websites. Building them was my only experience with coding when I started Flatiron, so its been a relief to get to play in some familiar territory, like HTML and CSS. I hope you decide to give my MadLibs a try!&lt;/p&gt;

&lt;p&gt;May the force be with you.&lt;/p&gt;

</description>
      <category>ruby</category>
      <category>sinatra</category>
      <category>activerecord</category>
      <category>madlibs</category>
    </item>
    <item>
      <title>A Project of Ice and Fire</title>
      <dc:creator>Natalie Hummel</dc:creator>
      <pubDate>Sat, 14 Nov 2020 20:16:40 +0000</pubDate>
      <link>https://dev.to/nmhummel/a-project-of-ice-and-fire-5727</link>
      <guid>https://dev.to/nmhummel/a-project-of-ice-and-fire-5727</guid>
      <description>&lt;p&gt;I have spent 85% of this week working on my Ruby/CLI project for Flatiron's FT Software Engineering class. We were tasked with taking an available and free API from the internet and pulling data from it. The data would be used in a Ruby program that would sort or search or manipulate in ways to give it an interactive element through the Command Line Interface (CLI). I spent a day looking through APIs and figuring out how I could use each of them. In the end, I went with Joakim Skoog's "An API of Ice And Fire" (&lt;a href="https://www.anapioficeandfire.com/"&gt;https://www.anapioficeandfire.com/&lt;/a&gt;). I haven't read the Game of Thrones books, but I loved the show (up until the last season). The API was based upon the books but acknowledged the show by providing information such as a character's appearance in episodes or seasons. With there being SO MANY CHARACTERS, I opted to focus on the Houses, like Stark and Lannister. &lt;/p&gt;

&lt;p&gt;My program, entitled &lt;a href="https://github.com/nmhummel/gameofthrones"&gt;"Welcome to Westeros"&lt;/a&gt;, assumes you just moved to Westeros, where most of the main Houses reside. Since you're new and not sure where to settle, I show you the different regions and allow you to view the different houses of each region. You get to choose which Houses you want to be allies with, and which ones you can do without. To avoid overloading the user with options, I narrowed the information down by ensuring that the Houses we search through have a House motto ("words"). How else can you get to know a House if you don't know what they stand for?&lt;/p&gt;

&lt;p&gt;Below is my recorded walk-thru of my project. Take a look before we continue.&lt;br&gt;
&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/KlJj54KJfsY"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;Fun, right? Making it was not always fun. I went to every Open Office Hours this week, asking questions and seeing how my fellow students were doing. A brief timeline of this week would read something like this:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Day 1: coding and feeling slightly optimistic&lt;/li&gt;
&lt;li&gt;Day 2: shooting for the moon with all the options I'll give the user&lt;/li&gt;
&lt;li&gt;Day 3: feeling like a fraud and an idiot and wondering why I can't do this; scaling back my project to present a respectable option or two&lt;/li&gt;
&lt;li&gt;Day 4: having a finished product that meets requirements. my first smile this week. &lt;/li&gt;
&lt;li&gt;Day 5: but I want it to do more! Let's try that query in the URL line again. &lt;/li&gt;
&lt;li&gt;Day 6: it's-done-it's-fine-stop-touching-it-lady-put-the-keyboard-down. &lt;/li&gt;
&lt;li&gt;Day 7: blog about this experience and turn it all in. Hi there!&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;I am grateful for the rollercoaster that was this week. As a beginner, it was an excellent learning experience in how to plan a project, map out the steps, and learn what I can and cannot do well (and also what I should and should not do). I am also grateful for our instructors, who were gracious enough to show us how to set up our project skeletons-- files, linking, example API use, etc. We were tasked with making it our own and from the projects I have seen, we did more than that. Kudos to my cohort!&lt;/p&gt;

&lt;p&gt;Let's take a look at some of my highs and lows from this week.&lt;/p&gt;

&lt;p&gt;STRUGGLES:&lt;br&gt;
The first big struggle came with how my API was presented vs. the examples my leaders provided. With using JSON to make our long list of data into a readable hash, I had a problem-- my data did not have a key I could call upon. Every object (in this case, each House from Westeros), was listed in an array, as one long hash, with its details in nested hashes. Each house did not have a key, like "House Stark", to call upon to help me sort out its contents. To a beginner, seeing this is a little overwhelming:&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--n4KeDA-W--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/ff27kx8873yy5ie4ltug.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--n4KeDA-W--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/ff27kx8873yy5ie4ltug.PNG" alt="Array of Hashes"&gt;&lt;/a&gt;&lt;br&gt;
I'm glad we studied nested hashes and how they behave!&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;    def create_houses
        self.fetch_houses.each do |house|
            House.new(house["name"], house["region"], house["words"], house["titles"], house["seats"], house["coatOfArms"], house["ancestralWeapons"])
        end
    end
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;With create_hashes bringing in the API data, I was able to parse through every hash of data using .each and assign them workable attributes, like "name" and "region", with every new instance. Hashes and arrays are so similar with how you can manipulate them that I was able to treat the info as an array from here on out. &lt;/p&gt;

&lt;p&gt;Another struggle with any kind of program like this is the "choose your own adventure" aspect of the program. You are trying to use each page in the appropriate spot without accidentally sending the user to the wrong page. You also Don't want to Repeat Yourself (D.R.Y.). To be frank, I still think there are areas of my finished code that are a little "wet," but I tried to give each new action a new method so I could avoid repeating myself as much as possible. &lt;/p&gt;

&lt;p&gt;PROUD MOMENT:&lt;br&gt;
This is a small thing, but as I was towards the end of my initial coding spree, I wanted to do the following&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;save all the House choices a user liked&lt;/li&gt;
&lt;li&gt;avoid adding repeat selections&lt;/li&gt;
&lt;li&gt;remove Houses previously selected&lt;/li&gt;
&lt;li&gt;print all chosen Houses upon exit&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;So what was I so proud of? I was able to write three simple methods in under an hour that accomplished all of these objectives. I feel accomplished that I was able to recall everything I learned about if/else statements, class variables, shoveling, and more. It was like I took Day 3 and proved it wrong. I could do this and I can belong. &lt;/p&gt;

&lt;p&gt;Like the TV Game of Thrones, I am going to start this blog strong and finish on a poorly-written conclusion: this was fun, House Stark is awesome, and Ruby is a great programming language. Go Flatiron!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--BhqO6AZ9--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/aijl9u2ncg2tiksbj9q5.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--BhqO6AZ9--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/aijl9u2ncg2tiksbj9q5.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>cli</category>
      <category>flatiron</category>
      <category>ruby</category>
      <category>project</category>
    </item>
    <item>
      <title>40 and Fresh</title>
      <dc:creator>Natalie Hummel</dc:creator>
      <pubDate>Wed, 21 Oct 2020 02:50:19 +0000</pubDate>
      <link>https://dev.to/nmhummel/40-and-fresh-39gm</link>
      <guid>https://dev.to/nmhummel/40-and-fresh-39gm</guid>
      <description>&lt;p&gt;As a young girl, we always had a computer in the house (once it became a household item). My father was always tinkering with them and allowing us to explore within them. He would often build complete systems from scratch for friends and relatives and I tried to pay attention as best I could. &lt;/p&gt;

&lt;p&gt;Once I got to college, I took courses in Computer Science at every opportunity. I became enthralled with HTML and loved designing websites. I would often find inspiration in a beautiful piece of art online and create a whole template around it. I had several accounts with the earlier, free web hosting sites (shout out to Angelfire and Geocities), and had several blogs to practice with.&lt;/p&gt;

&lt;p&gt;Despite my interests, a career in technology was not a vision I ever saw coming true. I would estimate only 3-5% of the Computer Science department at Birmingham-Southern College were females.  In addition, the courses took a challenging curve 2-3 classes in. We jumped from PASCAL to C++, which, to me, seemed like a pianist going from "Chopsticks" to "Flight of the Bumblebee" in five lessons. I did not feel confident at the time that I would be successful upon graduating with that as a major. On top of the pressure to graduate on time, I opted out of the program and kept my passion as a hobby. &lt;/p&gt;

&lt;p&gt;I do not fault the college for the challenging syllabus; as a liberal school, the fields of study were very generic. However, I often wondered what it would have been like to either go to a different school with more specific specialties, or to even be an undergrad in today’s world now that BSC has broadened their offerings to match the changing times. I do regret, at times, not sticking with the major, but that doesn’t mean I’m too late to address it.&lt;/p&gt;

&lt;p&gt;With the changes to society and technology, the opportunities and channels have grown immensely, thanks to organizations like the National Center for Women &amp;amp; Information Technology and accelerated programs like Flatiron School; it’s making me believe I could make Software Engineering my career. I want to be able to use my knowledge and find a job where I can help my colleagues create technological works of art. If I am able to contribute to a project or website  in any meaningful way, I believe I would feel a higher level of accomplishment that I have rarely felt at previous jobs. &lt;/p&gt;

&lt;p&gt;And so I begin-- a student again after 18 years. I'm not the first to do this, but I proudly join the ranks of those bold and awesome people. And, thanks to my BA in English, I can tell you all about it with proper punctuation and grammar. Excelsior!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--q4HU5UPV--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/9glpzwhag3bp3uqe4iah.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--q4HU5UPV--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/9glpzwhag3bp3uqe4iah.jpg" alt="Back to School"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>beginners</category>
      <category>womenintech</category>
    </item>
  </channel>
</rss>
