Making Custom User Names in Socket.io

A few months back I did a pairing session Chris Hunt and together we built a Node Chat app using the very convenient Getting Started Guide on Socket.io's doc page. We successfully completed the guide and deployed the app with minor hiccups.

Once a month here at work, we take part in a "hack day" where we can work on any project that is vaguely relevant to the business we are in or the company we work for. I took on the challenge to creating a new chat app and possibly implementing as a special feature at work.

One thing I noticed right after completing the app was the lack of user names displayed inline. While chatting with Chris on our app, it was easy to know which messages were not mine, but it would have been nice to know in case I needed to review the history.

Knowing the little node I knew I starting looking into the redis and socket.io-redis npm's and figure thats what I needed to save the username when prompted, but after a bit of time scaling the api and documentation it turned out it was only needed to save the printed chat messages for the session.

I was dissappointed when I did not find a blog post on the subject, but eventually found an old youtube video explaining exactly what I needed to know.

Each user can login with a session or socket and within each socket I needed to save their username. I was actually saving the username to late in the game and every message had the same user's name. I had to access the socket and save the username the same time as the message. Here is an example of the code:

*notice how I am prepending the chat name in the chat message while emitting the socket.

Here is the jQuery providing the chat in my view:

  












I create a new socket call to save my username that was collect from a javascript prompt and voila, the user's username got displayed each time they printed a message. I am pretty proud that I was able to complete and publish the chat app to heroku in time to present in our hack day presentation meeting.

*I made the dangerous decision of publicly displaying a chat to a projector screen.

As far as redis, I only need that to save the previous chat messages, which for the purpose of my feature, it is not needed. There is still work to be done on the front end and how it will be render to make it a new feature, but I am pretty proud of this little guy - My Chat App.

Marked HAML

I spent quite some time in my developing learning avoiding HAML, SLIM, and all other template alternatives, but recently I took on the task of working on a project that was exclusively written in HAML.

HAML is a template language that is meant to make writing html less of a drag. It was very common for myself to forget closing brackets and div tags which always annoyed me greatly, but I avoided the simplicity of HAML because I wanted to force myself out of that bad habit. HAML does not require any brackets and works with spacing and indentation to convert the valid html.

I initially reaction when started the project was to convert the existing HAML into/erb right away, but I then read an article from Hashrocket and found they used HAML exclusively and it got me thinking, maybe it's time for start learning this.

Here is an example of html converted to haml:

What annoyed me the most was the errors received due to the sensitivity of spacing. If your indentation is off HAML will tell you. If you write invalid code, HAML will tell you and there is less flexibility with how much Ruby logic you can place in your template.

Learning Ruby/Rails first introduced me to erb and I love it and understand it, which is another reason why I avoided HAML.

I have since stopped work on this project but did walk away with some more experience in this templating language. I can't say I would go for HAML at the start of a project but I don't think I need to avoid it anymore. I will definitely give it another shot on one for my smaller projects, especially since I am pretty sure this is not the last I will see of it.

If you come across HAML somewhere I recommend learning it and use tools like hamle2erb or htmltohaml

Learn Javascript quickly with WatchMeCode Screencast

A few months back I sent out a tweet to Advi Grimm, trying to find a screencast service similar to Ruby Tapas, but for Javascript (If you write Ruby and do not have a Ruby Tapas subscription, you need to sign up today).

I actually did not get a response but actually got an email from Advi a few weeks later announcing special pricing for Ruby Tapas subscribers to the WatchMeCode screencast from Derek Bailey. I believe I signed up the next day and binged watched almost all the episodes during my 2 weeks off of work.

The videos were slightly longer than a Tapas but filled with a large amount of content on Javascript. I attempted to learn Javascript properly a few times in the last year and failed to grasp the concepts of Prototypes, Closures, etc. Things finally started clicking thanks to this unique form of sharing code through screencast. I would consider myself now moving away from the entry-level to junior programmer and this is thanks to screencast like these who have given the ability to implement new tricks into my development.

I have a couple node projects complete which knocks off one item from my 2015 goals. I now have my eyes on GO and Rust, as well as putting together my first Ruby Gem very soon. Stay Tuned

Custom Google Calendar links.

A few post back I wrote about how to create urls with Javascript and thanks to that post I was able to make a quick change to Steamrolers page.

This Thursday kicks off our first AMA with Maurice  Cherry at 6pm. Our designer added a cool trick to the page which creates a Google Cal event for you from the provided link.  I wasn't aware you could do that until now, but it makes sense and seems to be powered by Javascript in the background.

All that is needed is a generated link, which can do easily with some provided sights or you can just create a event on your account and copy the link to the url in your browser and use that link in the href or erb link.








I discovered all this when I went to test the functionality and saw that the generated date was off. Turns out the date code in the url just needed to be updated to what I believe to a UTC translation and voila it all works  just dandy.

So if you have any scheduling needs or events to share, now you know how.

Saying goodbye to my biggest cheerleader

10 days ago I received an unexpected phone call from my brother letting me know my mother had past away. My entire world completely stopped while I took time to grieve.

My mother was the hardest working woman I ever knew and I am very grateful for what she has done for me and my brothers. Despite being a single mother, I was able to not only grow up in a decent neighborhood and attend great schools; I have also been given a chance to follow my dreams.

When I began my programming journey, my mother was one of the few I told of my decision to go down this path and encouraged me everyday. She read my blog post and even retweeted my tweets even thought none of it made sense to her. 

In support of mothers who are also going down the same journey as myself, into programming, I have given a donation to MotherCoders in her honor. 

I will miss you mom, thanks for all you have done. 

An opportunity for friends to help friends

About a month ago I was approach by someone to gauge my interest in a staring a community. This community was to be one that represent the underrepresented individuals in the Tech Sector.

When I first began learning to program I dove head first into tutorials and code samples, I did not really take anytime to look around and didn't realize the proportions of Women and Minorities in tech were extremely. I didn't know as I trail blazed into a career, that I would be on of the few minorities working in my new position. 

It is very easy for companies, like Y Combinator to look back and say the reason for this is because women and minorities are not interested in Web Development or Design, and based on the talent pool applying for these jobs is proportionate to the culture make up of who is currently working in the field. Based on their article their outreach efforts will be strengthen, but I am not sure that is enough. What if there more communities like BlackGirlsCode and RailsBridge to source this talent from?

The term friends want to hire their friends comes up a lot and I find no problem with that statement or practice, because I think that this community has the potential the individuals who are hiring and recommending tech jobs to their friends to now make even more friends. 

I am proud to announced that I have joined a community of SteamRolers prepared to changed the talent and support each other in their desire to shake up the cultural make up. 

If you are at all interested in this, please check out our new site where the conversation has already started. Steamrolers.com

Chron job in node

After my recent node battle, I knew the war was not over. I still needed to set up my node script to run in the background. I know with Javascript be an event based I should be able to create a chron job for checking when ever a new signup on the form happens, I should be able to send an invite.

I first started with the forever npm package but similarly with my original requirements for running the unstable version of node, I was unable to use that package, as it is not updated for that.

I then found a StackOverflow question on running the code in an interval. As I thought, this was pretty easy. I am impressed or frustrated with node at the same time, mainly because its not Ruby. In the same vain is not too bad and I can see myself using more in the future for small scripts as the community includes some of the smartest programmers out there and can only increase my experience knowing yet another server side language.

My Code:

node Battle: The integration of slack and typeform

This weekend was planned for the exploration of new territory. I have had a new idea for my first Ember app for quite some time and was ready begin from `ember new`.

I also recently joined up with a group to startup a new idea (more details in a future post) for a community. My first task for the group was to integrate slack into the app, sounds easy enough since there is a popular blog post on how someone did it in php. I am not exaggerating when I say I have had no php experience, but expected to learn it quickly enough to follow a blog post, well the blog post was not as clear as I would of thought it to be. I expected more steps and ideas on how to run a php script and the s/o questions and google searches made too many assumptions on my skill level in php.

After spending about an hour in php, I decided to search for a different solution and possible come back to php if needed.

Here comes the node

Now what I was doing is farely new and the blog post was only written 2 months ago, either there is not a need for this sort of slack integration or I am on the cutting edge. Regardless, when I tried searching only 3 implementations came up, and one was just a bot reposting the first php article.

Luckily the other choice was node, a version of Javascript I had some experience learning in. I stumble on the cleverly named slack-typeform-inviter, great for seo, and quickly enough of the code to realize it made sense. I forked the project and began inserting the needed API keys for Slack and Typeform.

I then Ran the code and boomed error, `SyntaxError: Unexpected token *`.  Hmmm, why would someone post code with syntax errors?

Actually it is not a syntax error, but actually a new syntax for the release candidate .11. Yep the code was written on an unstable version of node and I was an unstable developer at that point.

Now I wrote my solution in what took about 5 seconds for you to read, but it took about 3 hours of banging my head on the keyboard trying to figure out how to debug this code. I removed the "*'s"  from the deferred calls, which I found out to be to sort of like yields for arguments, but once those were removed I was getting errors on the yields.

I finally removed the yields and got the code fail everywhere there was a "request" or "response" call. This was weird, so I ended up emailing the contributor. In hindsight I recommend opening up an issue on github instead, I got a super quick response letting me know it was the newest unstable node code and a picture of the developer at a KPOP concert in Thailand. I felt bad to bother him but relieved that I could get the code to work.

But only if it was that easy, I did spend about 4 hours figuring out how to install an unstable version of node and debug why it was not working on my computer. Those fours plus probably more as I moved into the next day were spend installing dev tools on my wife's mac to test that the code worked. Luckily all I had to do was copy and paste my .vimrc, which is testament to VIM and why you should use it.

I ended up discovering nvm (similar to rvm) to install the "unstable" version of node and  switch back and forth when needed.

There was an incredible amount of troubleshooting this weekend, but it taught a deep understanding of how npm and node_module management works. It also gave a chance to write some production ready node code. Also the code works which is a relief.

Thanks to Chad Scira for being so responsive in email and originally writing the slack-typeform-inviter

*I have submitted a pull request to help anyone else who might want to use the node pack in the future. Which has already been merged!

Now I hope next weekend I can get past ember new.

VIM indent all the way to Oz

I am have been using VIM since Thanksgiving and definitely not looking back to Sublime. I really do believe that the myth that VIM is this big mystery/archaic of programming is not real. It's similar to the Wizard of Oz, where everyone thinks Oz is this great and powerful being and when it is all said and done, its turns Oz is a short white dude behind a curtain, but that short white dude is you just installing plugins into your dotfiles.

One thing I did miss with common IDE's like Sublime, is the ability to hit `command + [`for quick line indentation. Well it turn out getting that back was easy, all I had to do was add the following to the bottom of my .vimrc, voila.

Remember, If you can dream it, you can do it in VIM.

nmap <D-[> <<
nmap <D-]> >>
vmap <D-[> <gv
vmap <D-]> >gv

Take the plunge and try vim today but typing "vimtutor" in your unix terminal.

.gitignore cached files

I spent some time trying to figure out why my git would not stop add files I added to my .gitignore. I finally figured out there were files being cached, why? I have no idea, but I am glad I know how to removed them now. 

git rm . -r --cached
git add .
git commit -m "fixed untracked files"

Breaking down URLs with Javascript

I didn't think this would be a big deal but I had the worst time trying to get a date picker and a custom filter to work in my search form.

More Details:

I took on the task at work to create a dashboard of activities for users, Ideally you would be able to login and access list just as you would see anywhere else, equipped with dates, dollar amounts, and etc. This public activity list was easily created, needed the ability to be filtered down by some given params which are to be a date range and filter type.

Knowing how to build a form I created just that, that included an already built Javascript date picker, specifically Pickaday. One of the nice things about working on an app is all the decision of what plugins and gems have already been made, and for the most part they some of the best decisions to solve the problems at hand; All I have to do is engineer it all to work together.

"This all sounds pretty legit until I actually try it"

I did not take into account that my Javascript skills are still very amateur. I also didn't realize that I knew nothing about url's and query params. I actually only just learned today, after it was explained to me coworkers. Imagine spending your whole life and just now figuring out how to tell time, that's how I felt when I learned about query params.

So are you ready to learn about them?

http://theblackc000000de.blogspot.com/search?q=bloc

The url I provided above includes a query string, do you see it?
It begins with the "?" and includes everything after it. If I wanted more params in the url, I could add an ampersand(&) and include more, like so:

http://theblackc000000de.blogspot.com/search?q=bloc&from=Dec%207,%202014&to=Jan%208,%202015

Not actually valid for this page but hope you get the idea, I passed in to and from dates to limit the blog post that were returned. So now I have 3 params: to, from, and q

The JS file that includes the date picker already had working code, which actually works for to and from but no longer q, which a select box with multiple options.

I was creating a url with no issue but the forgot to pass in a param key in the url build; Once I added that everything worked as expected.

My Solution:

*The url is being created in the last line

*variable names were change to protect the innocent

Another plus with working with Rails, I am able to call debugger/raise in the controller to manipulate the provided data received from this param, i.e. where all the filtering happens. Another plus is Ember has a lot of this handle, which is explained in their documentation - but I am not quite there yet.

This was all new to me and quite an eye opener, I hope this post will anyone else in working with url queries.

More info on url queries.

Remembering my time at Bloc and how I got here.

Was Bloc the stepping stone that prepared me to be become developer I am today?

This is a question at least once a week and I usually answer via email in great depth, but thanks to the recent Code Newbie podcast and Scott Hanselman I am going to share my response with everyone.

I graduated out of the Bloc Apprenticeship officially March 17th 2014, and for those wondering my mentor was Adam Louis, for more details about my Bloc can be found on their site, I have my own experience page.

But lets get back to the originally question; for a quick answer, yes is the answer. I work developer in Rails the same technology I learned while learning with my mentor. I not only followed the unique Bloc curriculum, but I also tried things outside of the curriculum. Bloc gave me the ability to try new and different things to set apart from others. I got into testing very early, which is something I think too many Code Newbies avoid.

One of the first things discuss my thrice-weekly Bloc session was, I was going to "learn how to learn." All these bootcamps out there now are not really teaching you how to write code, but they are really teaching you how to learn how to write code and how to look things up for yourself.

I have only ever gone through Bloc and can't really speak to the experiences in live in person bootcamps, but what I can say Bloc is a one-on-one intensive mentorship, where you can learn as much or as little as you want. You are able to ask your craziest questions and really go on tangental learning experiences.

How about another question:

Did Bloc give you the ability to write functional applications?

That answer is another yes, I spent a lot of time... specifically 30-40 hours a week building sudo-client ready applications, based on feature wish-list provided.

All the apps I created were in the Minimal Viable Product state, but they perform the minimum functions required and with a little more help on the design  side they could be pretty presentable apps.

I completed the Rails/Fullstack curriculum, but there are also Design and Front-End curriculums, as well as Android and iOS.

Now with Javascript Frameworks becoming bigger and would I opt to go through the Front-End course instead of the Fullstack/Rails course?

It's crazy to think that when I started all of this Angular/Ember/Meteor...etc were barely on the radar. I haven't even heard of Node and when I did, it was about people complaining about how it wasn't Ruby.

Even though I am now excited about Node/Ember/Express. I would still go through the FullStack curriculum. I fell in love with Ruby and got really excited about Rails before I knew that Bloc was a thing. The community surrounded by Rails is still great and very instrumental in me continually advancing in my knowledge.

Ruby is hands down a great language to learn for new programmers.

For someone who has zero programming  and design experience, I still recommend the Ruby/Rails path. I also do not think Rails is going away anytime soon and even this newly indoctrinated "Javascript all the things" world there will still be a place for Rails.

*Seriously if I hear another person tell me how the MEAN stack is the Messiah to web development and Javascript should be written everywhere and on all things - those people are crazy.

Does Bloc help with finding you a job?

Bloc announce to a new Job Prep portion back in November, which I have not gone through, for obvious reason ( I already have a job) and did not offer anything like this during my time with them, but from what I hear its pretty .

Bloc does connect you with alum and lets you in their alumni network you can network for next job, but at the end of the day, getting job is the continuation of your hard while in the apprenticeship.

I personally hit the street and networked at local meetups and conferences to get where I am today.

*If anyone who has tried the Bloc Job Prep section wants to chime, please let us know your experiences.

-------
I think that about covers the most common questions I get, but feel free to send email and I can answers anything that wasn't covered in the blog post.

Ghost Express/Ember app set up

I have turn my Javascript learning into some kind of renaissanceas of recent. I originally began learning Ember and quickly realized I did not know enough Javascript. I then proceeded to learn Ember and realized I didn't know enough about Node. I then learned Node and Express and glad I did.

Later I took on the challenge of forking the discourse project, which is a large Rails/Ember app and failed getting the pg database started. I gave that up after attempting to get it working after a long week.

I recently attempting the same task with Ghost, a blogging platform, and happy to report I got it up and running. I originally started using the Ghost hosted portion their blog platform 9 months ago, before it was cool. I had hopes of doing what I did today, host a blog on my own, but never got around to that till recently.

Ghost is built with node.js with Ember driving the

Javascript frameworks are new to me and very exciting, and my hope is to move closer towards the "full stack" web developer level.

The task of actually forking the project and following the instructions were very easy especially thanks to this blog post.

Some of the issues I came across was installing postgres in an express.js app, which actually wasn't that bad. All I had to do for that was `npm install pg --save` in the terminal., for some reason I thought had to update the package.json file directly which was not the case. Heroku has a great documentation on pushing a node app, which also helped.

Rails traditional does all that work for you, or at least I think it does.

Finally I push this blog to a public repo and was worried about putting my db info out there for everyone to see, so I searched and found the dotenv node package, which works exactly like the ruby gem.

I am enamored with npm, node, and express and really liking the possibility. As a Rails developer some might think I am jumping ship, but that is very far from the case. There are so many possibilities in app creation and I plan on going into more detail them in a blog post soon.

Check out my work on github

Ember tutorials all completed (mostly)

I started learning Ember back in July, which seems like forever ago. I really wished I stuck with it then, as I would already have production ready apps built by now, but at that time I had just begun work at IZEA and felt as if my focus should be on Rails learning.

I am now approaching my 7th month working in a professional Rails environment; I am definitely at great place to learn new technologies, like Javascript frameworks and iOS programming in Swift.

My vacation ends after tomorrow and I had high hopes to learn and build new technologies, but that plan did not come to fruition. I like to aim high and fail with success and though I did not get to build that Ember app I planned on building, I did complete a number of tutorials and reading.

I mentioned the ember-cli book briefly on this blog and planned on writing summary/review but have been delayed numerous time due to errors/long debugging sessions while trying to complete. I am still very new in web development and compare my struggles in learning Ember very similar to learning Rails, with most of them being spelling errors. I have done a good on debugging issues thus far but have run into some issues managing packages, I believe I missed a step, other than that I highly recommend the book on getting a great intro to Ember.

I have completed the actual app portion of the book but have yet to complete the ladder part, which includes testing and the rest of the dependency management. I did however learn that in the 3 tutorials I completed this week, Treehouse Ember Course, Code School Express.js Soup to Bits, and Ember Guides.  

After all that I am in a great position to start an actual Ember project. My biggest recommendation for anyone learning Ember or any other framework is read he guides/docs, even if you skim them. I did this for Rails and now Ember and have to say Ember has one of the easiest documentation to read. I have a better understandings of the overall opinions in the framework and workflow.

I am looking forward to a future blog post where I can write about the completion of this Ember app I am planning.

Vacation time made me ready for the new year.

I am truly blessed to be employed at a company that gives 2 weeks paid time off for Christmas and New Years. Other than the birth of my son, I have never taken that amount of time off since I began working after college.

My plans including some extreme learning in programming, but reality hit in a big way. I discovered I much rather spend the free time with my family during the holidays and have not posted a blog post or sat down to write any serious code in 2 weeks. I have some extreme goals for this year and a strong desire to learn but it is also nice to sit back enjoy a break from code.

I feel refreshed and code looks even more exciting to me. I am looking forward to sitting down this weekend and create things.

Thanks to all the my readers for a great 2014 and looking forward to 2015!

My goals for 2015

I now have big plans for 2015 and hope this year is as exciting as the last. In 2014 I not only learned Rails and earned a new job in that technology but I also expanded out into other things, like Ember and iOS. 

Throughout my entire journey into programming I have always had goals and even laid out my goals for 2014. In summary I completely missed the StackOverflow benchmarks I had for myself. I did however jump into iOS as planned and completed a Tetris tutorial app last month, just in time. 

My immediate goals for this year includes the following:

1. Write my first Ruby Gem

2. Complete a non-tutorial based JS app

3. Finally release Chuych to the actual users

4. Start the creation of a tutorial to share with others.

5. Begin learning Scala, Elixir, and/or Go

I am not going to break out my goals by quarter and I am avoiding StackOverflow, which is the only goals I will not be following through. I feel as if I need to complete more projects rather than spend my time diving deeper S/O. 

One mistake I feel I made a lot towards the ladder part of 2014 is spending way too much time in books and videos and not actually writing code. I hope to change that with these goals I have laid out. I am also aiming to be realistic with these goals, which means I expand on to #5 as I plan on completing all of these goals this year. This is definitely going to be a good year for me and I am excited to move into another level of programming.

What are your goals for 2015?