Web Security

I’m going to start blogging again.

When I started this blog back in 2013 I used the blog as a public way of holding myself accountable towards my goal of being a web developer. Ever since I met my goal my motivation to blog completely went out of the window. I like programming, and I like my job, but coming home and writing about what I did at work is not something that interests me.

So now I have a new goal, with a specific timeline, and a specific desired end result: I want to earn $1000 in bug bounties by January 16, 2017.

I don’t know much about web security, other than the basics that you need to know to avoid catastrophic incidents like SQL injection or XSS. I DO know how to program. I DO know how web applications work on the front and back ends. I DO know how to use the terminal to execute commands. I also know that programmers and business don’t take security seriously enough.

I chose web security because I’m trying to stay ahead of the curve in terms of my professional development. I find it hard to code web apps all day and THEN come home and code more; it makes me feel as if I never left work. I want to continue to grow as a programmer/developer, but also don’t want to feel as if my entire life has been devoted to web dev. I also want to earn some extra money. Doing side projects for money isn’t really appealing to me at this point, as it feels like a continuation of work.

I chose January 16, 2017 because I just decided yesterday that I was going to commit myself to this project, and that six months was a good target date. It took me 7 months to go from a know-nothing wannabe to a full-time professional programmer, so I figure the same timeline is appropriate for something I consider to be a hobby with the potential of earning some side money.

The goal is to get 322 hours of studying in before January 16. 322 is 2 hours per day multiplied by 161 days. I probably won’t be able to study EVERY day, so the number of hours is probably a better target.

How to access localhost from a Virtual Machine

At work I use a MacBook, but when testing customer-facing portions of our site I run Windows in a virtual machine instance that I downloaded from Microsoft so that I can test Internet Explorer compatibility.

The VM could access my network and the greater internet perfectly fine, but would not access “http://localhost:3000” from inside Internet Explorer. It took me awhile, but I found the solution using Stack Overflow (of course). Hopefully this saves someone some time. Also note, I’m running VirtualBox.

Link to StackOverflow solution:

1. Shut your virtual machine down.
2. Go to VirtualBox Preferences -> Network -> Host-only Networks -> click the “+” icon. Click OK.
3. Select your box and click the “Settings” icon -> Network -> Adapter 2 -> On the “Attached to:” dropdown, select “Host-only Adapter” and your network (vboxnet0) should show up below by default. Click OK.
4. Once you start your box up again, you should be able to access localhost at http://10.0.2.2/

Where I’ve been and what I’ve been up to.

Two updates in 8 months. I should be ashamed of myself. Tsk…tsk….

I don’t think I ever actually explained WHAT happened to me after I got that first developer job.

The first job I got was at a (very) small dev shop using Ruby and Rails. Without going into details, that job didn’t really work out. As far as positive takeaways I came away knowing that I had what it took to be a successful professional developer.

My next job was at a code bootcamp in the Los Angeles area. Not a fly-by-night, super shady type of bootcamp, but a legit and respected business. I started with the company as a Teaching Assistant for it’s 3-month all-day program. After a successful 3 months I got offered a position as Junior Instructor, which I accepted and remained in until I left in September 2015.

Without a doubt I would have to say my 10 months working at the bootcamp was the most educational and enjoyable job I’ve ever had. Not only was I able to improve my programming skills by teaching what I knew to others, but I felt a sense of accomplishment as a human being by playing a role in people changing their lives. I was able to learn from and be mentored by co-workers who were not only knowledgeable, but compassionate, determined, and enthusiastic about software development.

In September 2015 I accepted a position at a small startup in Los Angeles using MeteorJS. Meteor is a full-stack JavaScript framework, which means both the server-side and client-side code are written in JavaScript. The fact that I’m working on a full-stack JS framework and haven’t written much Ruby in 4 months is ironic considering I deliberately tried to avoid JavaScript when I first started learning to code because I thought Ruby’s syntax and standard library of functions were superior to JavaScript’s. Well actually, I still DO think Ruby’s syntax and standard library are superior, but at work we code in CoffeeScript, which IMO is what would happen if Ruby and JavaScript had a baby. I get the best of both worlds; I get to write code that’s relatively free of the oodles and oodles of parens () and curlies () and function this, function that, while still learning and being productive in the defacto programming language of the web.

I’ll be writing in this space more often because I have noticed that since Meteor’s adoption is not nearly that of Ruby-on-Rails that the amount of established conventions and standards is very very small. I have some ideas on how to write more straightforward and maintainable code using CoffeeScript and Meteor that I’d like to share here.

How to dynamically style HTML elements in Rails based on an object’s property

I was helping someone with a project and they wanted to change the CSS class of an image based on a property of an object that it was attached to. The person was used to using AngularJS’s ng-class and wanted similar functionality.

For demonstration purposes let’s assume we have an ActiveRecord model named User that has a property named “awesome” which can be true or false. Let’s also assume we have an image named “doggie.jpg” in our app/assets/images folder.

The CSS file.

.awesome-true{
  border: 3px solid green;
}

.awesome-false{
  border: 3px solid red;
}

In the view (@user is a single instance of the User model)

<%= image_tag "doggie.jpg", :class => "awesome-#{@user.awesome}" %>

The result when true.

<img class="awesome-true" src="/assets/doggie-6708b9ff28cb5d2d941ed3b01dfe977c611a0ea07dc04249dbdce4514245c303.jpg" alt="Doggie 6708b9ff28cb5d2d941ed3b01dfe977c611a0ea07dc04249dbdce4514245c303">

The result when false.

<img class="awesome-false" src="/assets/doggie-6708b9ff28cb5d2d941ed3b01dfe977c611a0ea07dc04249dbdce4514245c303.jpg" alt="Doggie 6708b9ff28cb5d2d941ed3b01dfe977c611a0ea07dc04249dbdce4514245c303">

Having someone to compare yourself to

Today is my birthday (yay!) and I feel like dispensing some life advice. Maybe it’s because I have kids or maybe it’s because my day job is being an instructor at a coding bootcamp; personally and professionally I’m constantly thinking about how to properly instruct the people I’ve been given responsibility for.

I got into coding in a really oddball way; I didn’t have any friends who were programmers, I didn’t come from a programming family. The short version of the story is that one day I decided that I wanted to be a programmer and set off on my journey. For about 5 months I studied night after night alone in a room; I didn’t even tell my family my plan.

Looking back on it now if I had to give new programmers some beginning advice I would say find people to compare yourself to. But realize when I say this there is a degree of subtlety that I want to convey.

I DO NOT advocate finding people to compare yourself to for the purpose of trying to compete with them.

I DO advocate finding people to compare yourself to for the purpose of gauging your own ability.

I had my own struggles with “Imposter Syndrome” and now I believe that part of what caused it was an inability to properly gauge my progress. I thought that everyone who I came across was better than me and that I was the worse programmer in the world, even though demonstrably I obviously was not.

Over the past 6 months while being exposed to complete newbs and experienced developers I’m in a better position to gauge my own skill, and that Imposter Syndrome I had has pretty much disappeared and been replaced with a confidence that I thought would take years to develop. I am confident in my problem-solving skills, but also cognizant of my own limitations.

To crystallize this message: Make friends with a few programmers and talk shop with them. Look at their code. Don’t be afraid to ask “stupid” questions, because if there’s anything programmers love it’s an opportunity to prove to someone how much more they know than someone about a subject 🙂 Soon you will have a better sense of your actual skill level, and from there you can create a targeted action plan to improve yourself.

The positive aspects of “Imposter Syndrome”

Impostor syndrome is a psychological phenomenon in which people are unable to internalize their accomplishments. Despite external evidence of their competence, those with the syndrome remain convinced that they are frauds and do not deserve the success they have achieved.

If you’re like me, someone who got into coding without a Computer Science background, you may have experienced Imposter Syndrome at some point.

In my opinion Imposter Syndrome arises not only because of your own insecurity due to lack of experience, but because the coding world is full of VERY smart people who try their hardest to show you just how smart they are.

Have you ever been to a meetup or networking event with other programmers and within 30 seconds of meeting each other there comes some variation of the “So…what do you do?” question.

  • Where do you work?
  • What kind of projects are you working on?
  • Where’d you go to school?
  • How long have you been coding?

Sometimes these questions are just small talk, but a lot of the time I don’t think they are. I liken the coding world to a big giant health club or gym, but for your mind. Instead of wearing a barely-there tank top and showing off your delts or your pecs programmers like to brag about their degrees, or their co-workers, or what prestigious company they work for. In a sea of very smart people the individual programmer wants to stand out, so they start name dropping and rattling off a bunch of useless techno-jargon to prove how smart they think they are. I’m really not a fan of that.

When I help people with their code I try to speak in PLAIN ENGLISH, because I feel that techno-jargon laden explanations do not help people understand the material. I also like to compare code to something that is real and relevant in their lives. I’ve compared JavaScript functions to a carpenter building a table. I’ve compared Asynchronous vs Synchronous code to waiting in line at Starbucks vs waiting in line at a grocery store.

Explaining concepts like this requires two things:

  1. The ability to make a personal connection with someone so that they feel comfortable sharing a different side of their personality, aka “People Skills”
  2. Imagination

Imagination isn’t the problem for most programmers.

The Positive Aspects of Imposter Syndrome

Butterflies in your stomach. That empty feeling deep in your solar plexus. Anxiety. A symptom of Imposter Syndrome.

Anxiety is a normal human emotion. At times I’ve tried to do things that would completely remove anxiety, but I haven’t had much success. Instead I’ve decided to accept that anxiety is a part of being a programmer, and instead of trying to eradicate it I’ve decided to use it to my advantage.

When I get anxious I start running through a script:

  • Why do I have anxiety? What specific situation is causing it?
  • Have I experienced anxiety in this situation before? How did I deal with it?
  • Since I’ve had this type of anxiety before and I’m still alive that means it’s not fatal and that I have to make a decision on how to deal with it.

When I get anxious I like to watch the video I’ve embedded below. To quote from the video:

Whether or not you win this thing, you’ve got to decide how
you’re gonna walk out of here when it’s all said and done.
Because the game is going to go on.

The project you’re working on is GOING to be built. The code WILL be written, whether you’re a part of it or not. So YOU need to make a choice. Are you going to give your best effort regardless of the outcome, or are you going to run and hide?

MEAN.JS Framework – Creating a Simple Blog App – Part 2, Generating an App and CRUD model

In part 1 we installed the basic dependencies needed to build a MEAN.JS app. In part 2 we’ll generate the basic app structure.


=> create a new directory for your project

$ mkdir meanjsblog && cd meanjsblog


=>generate the boilerplate code. 

$ yo meanjs


=>start the server

$ grunt

Verify that everything is working by navigating to localhost:3000; you should get a generic “Welcome to MEAN.JS” page.

After verifying there were no errors let’s generate a generic crud model named “Post”.


$ yo meanjs:crud-module Post

In part 3 we’ll explore the file structure and compare it to Rails’ file structure.

Parsing Reddit API – JavaScript & NPM package ‘Request’

Since I recently got extremely interested in Node stuff I wanted to play around with consuming JSON APIs using some NPM packages. I found two that did the job:

Here’s my example using ‘request’. I parsed the API for the Kendama subreddit and rendered each post’s title and body.


//consumeAPI.js

var request = require(‘request’);

request(‘http://www.reddit.com/r/kendama/.json?limit=5’, displayData);

function displayData(err, resp, body) {
if (err) {
console.log(err);
}
var jsonString = JSON.parse(body);
var arrayOfPosts = jsonString.data.children;

for (var i = 0; i < arrayOfPosts.length; i++) { console.log('--' + arrayOfPosts[i].data.title); console.log(' ' + arrayOfPosts[i].data.selftext + '\n'); } } [/javascript] And the result [text] $ node consumeAPI.js --Thoughts on transparents? Thinking about getting a transparent ozora from roots and was curious if the thin paint would be more prone to chipping or getting messed up. --TK16? Are the yellow Tk16s from amazon good? Heres the link:http://www.amazon.com/TK16-Master-Single-Color-Yellow/dp/B00EQJONNG/ref=sr_1_3?s=toys-and-games&ie=UTF8&qid=1424387722&sr=1-3&keywords=tk16+kendama#customerReviews --Sweets website down? I was looking to buy a HG but it looks like the websites down. Anyone know when ítll be back up? --Has anyone ordered from HiKendama? How is the paint, does it chip much? Sticky? Slick? How about the antique line? They look pretty rad, I kinda want one, but I am new to Kendama, so I am scared to spend the 30 dollars. --These look sick, anyone else gonna cop? [/text] Further Reading ---

MEAN.JS Framework – Creating a Simple Blog App – Part 1, The Setup

Tutorial time!

This tutorial assumes you already have some prior experience (not tons) with Mongo, Express, Angular and Node, and that you’re interested in knowing how to quickly bootstrap a CRUD app using the MEAN.JS framework.

Also it may help to know that I come from a Ruby on Rails background, so my approach to building this app was “I know how to do this in Rails, how do I do it in MEAN.JS?”

Let’s begin!!!

First you’ll need to install the prerequisites

=>install bower(frontend assets)
$ sudo npm install -g bower

=>grunt is used as the task runner
$ sudo npm install -g grunt-cli

=>install yeoman to generate scaffolding
$ sudo npm install -g yo

=>install the MEAN.JS generator
$ sudo npm install -g generator-meanjs

=>make the directory
$ mkdir blog && cd blog

In Part 2 we’ll generate a CRUD model.

Further reading
—–