I Was Running on Heroku with my Woes

\"Heroku.jpg\"

So I Googled all the errors I was getting with Heroku and npm. I remember having an issue with npm (Node package manager), that every package I tried to install, it would error out. I found that running:

sudo npm install espress

for example, eliminated most of the errors, which means one of the folders Node accesses in my home folder has a permissions conflict. I know I could run a command with chown to open things up, but I found a solution a while back. I\’ll have to look for the same thing again to fix the need to run npm as a superuser.

So once I installed dependencies, I still had errors, the app kept crashing on the server. I Googled some more but didn\’t quite understand what I needed to get done.

So, what do sane people do when they need an instruction on something but no kind of text is helping?

YouTube.

I did all of the steps in this video. I added the text to my server.js file. But when I went to my app\’s url, I got the text on the server.js file. I couldn\’t understand why. I didn\’t understand that, when I went to the Heroku remote branch of my app in git in iTerm, the only real code there was the npm-logs and server.js, and things on the root of the folder, nothing of the real app. I thought, \”Heroku doesn\’t see what is in subdirectories of the root repository folder\”. So more Googling.

I found this Gist on Github (which I forked) about Yeoman scaffolding and deploying that scaffold on GitHub. Woo! I am still working on it but will set this thing up soon. I had to erase both remote repositories and push them up again. It\’s a real mess but I am learning.

In a Rut…

I was sort of in a rut. I am learning the fundamentals of JavaScript. I understand that. Gotta crawl before you walk.

Once I got up to Objects and Arrays and saw that we were going to make an address book? EXCITED. I got all kinds of ideas of how I could build on the fundamentals I was learning.

Unfortunately there was a glitch in my browser that prevented me from seeing the lesson before Objects and Arrays. I finished the first lesson and now I am building my own adventure…I think we are learning more about form and scope. Anyway, I couldn\’t stop thinking about objects and arrays no matter how hard I tried, and about the address book I wanted to make. It would be simple.

I decided I would use Yeoman scaffolding, for the simple type of app, host it on Heroku, all the while editing the JavaScript file to suit my needs.

I spent the better part of yesterday fiddling with the html file, adding reference links, removing text, adding my own. The meat of all this work came from Git, CodePen and Heroku and building out the grunt sever. I spent more time on presentation than I did editing files. I also spent 5 hours trying to install heroku-toolbelt from the pkg file on my Mac when all I really had to do was

brew install heroku-toolbelt

and

brew install foreman

instead of fooling with installing wine and XQuartz and finding out I didn\’t have zlib– god what a mess.

But is on my Heroku server though the deployment is wonky– says it\’s a node app and it is– the Yeoman scaffold is written in node with some html and bootstrap mixed in. I have run logs to see what was happening and a lot of npm errors and elements causing the app to crash. My first bit of real dev workdebugging. I am not fond of this. But practice makes perfect. A lot of the errors I need to google.

I also spent considerable time trying to get a better looking terminal. Understanding my .bash_profile etc. So far, I have installed an espresso theme (I use iTerm as a terminal replacement):

\"\"

I also decided since I am doing all these projects I needed to name my terminal tabs. Shot out to Saron of Code Newbie for showing us her awesome terminal during js-tuesday hangout.

So I have everything at GitHub and CodePen. Here is the Pen:

[codepen_embed height=\”268\” theme_id=\”0\” slug_hash=\”KpRBzd\” default_tab=\”result\” user=\”twhite96\”]See the Pen <a href=\’http://codepen.io/twhite96/pen/KpRBzd/\’>Address Book</a> by Tiffany White (<a href=\’http://codepen.io/twhite96\’>@twhite96</a>) on <a href=\’http://codepen.io\’>CodePen</a>.[/codepen_embed]

Yeoman and JavaScript, etc

\"Yeoman.jpg\"

 

 

Yeoman

(Currently laying in bed, terrible sinus headache today, writing this on my iPad in Editorial. If it\’s ridden with typos I\’ll fix them once I get up and head to my Mac).

So, my Code Newbie pal and former guest on the podcast Mark Pearyer (pronounced Pierre) and I, as well as a few other Code Newbies are working on a hangman app. Mark presented this nice looking boilerplate for the app. He said that he made the boilerplate with Yeoman generator. If you don\’t know what a boilerplate is check out this article.

I sat down and watched the Yeoman intro Yeoman intro video and immediately became excited about the possibilities for my own apps and websites.

Downloaded yo, bower, set up a test app, and run the grunt server. I\’m hooked. I plan on using Yeoman to build two apps I have an idea for.

Fun with For Loops and Arrays

I love loops. I can see how effective they would be when repeating tasks and functions. The most logical part of JavaScript for me is looping. Not sure why. In Free Code Camp\’s Codecademy track they\’ve grouped arrays and for loops together. It\’s strange when I think about JSON and JavaScript arrays and how they differ, where in JSON you can\’t mix data types (for example, integers and strings aren\’t allowed in the same array in JSON but can be in the same array in JavaScript). Anyway we built simple for loops with arrays like this:

var names = [&quot;Tiffany&quot;, &quot;John&quot;, &quot;Joe&quot;, &quot;Rick&quot;, &quot;Jerri&quot;];
for (var i = 0; i &lt; names.length; i++) {
console.log(&quot;I know someone called &quot; + names[i]);
}

The variable i refers back to the names in this case. Since we have an array and counting in the array begins at 0, the second part of the for loop is going to calculate the number of names in the names variable, or the length of the array. Then in the last part of the for loop, the loop is coming back around and counting up to the next name. It will do this because the ++ means to increase by 1. It will do this for the length of the array, and for as long as i is less than the length of the array. The console.log prints out the string and concatenates the string plus the names in the array.

Cool.

So I\’m sharing, again, what I\’m listening to on Spotify. On the Code Newbie Discourse we talked about music to code by and I found some awesome wub wub dubstep to kill code by. I\’ll share my favorite here (NSFW):