Learn To Code With Freecodecamp

I wanted to give a shoutout as a life long learner to freeCodeCamp.org. Before I start I want to make sure that any reader knows I have a Bachelors’s degree in CS, have been working as a front-end developer (engineer) whatever for over 6 years, and have also taken a lot of online courses. No matter what having a resource like freeCodeCamp.org allows me to review and learn the material at any time.

Things Are Not Free Donate

Every time you logon it gives you the opportunity to either donate monthly or a one time, or free. The thing is I have been compelled to donate just in an effort to not only continue helping me grow but other future devs too. The community of freeCodeCamp.org helps it grow to new heights every day, and you can literally go from zero to hero in basically any direction of development.

What Can You Learn…Everything

How To Approach The Platform

If you are a new developer I would recommend just starting from the beginning and doing about 30 minutes to an hour a day if you have time. The courses are laid out great from Javascript fundamentals, Bootstrap, even SASS to build up your CSS. Another great aspect is you can turn on the music and just go because there are no videos.

For the more experienced developers out there that think this is just for a newbie, you are wrong. I wanted to get up to date with my ES6 and BOOM! I went through that section in about a week just a little at a time letting it settle in, and then I ran into a project that was going to be REGEX heavy and once again Freecodecamp.org to the rescue.

You can never learn enough and if you do know how to empty your cup of knowledge you may have the opportunity to find new ways of doing things.

“Empty Your Cup So That It May Be Filled…”

Bruce Lee but from a Zen Proverb

Benefits of Learning To Code With Freecodecamp

  • Learn at your own pace
  • Experience does not matter all material is relevant
  • Forces you to look things up for answers
  • Certificates for personal gratification
  • Motivation for projects
  • AMAZING COMMUNITY OF PEOPLE

I love to write about my trials in learning to code and be the best programmer I can be. From posts like personal growth through online learning or fundamental design tips, I am just reflecting and hoping that it also helps someone else grow.

All Things Open 2019 Raleigh

Exciting Times and People To See

I posted a blog last year of my experience at the All Things Open event in Raleigh NC and it was amazing. You can read about that here (shameless blog post plug). Last year I was one of the first people in the door and to no shame to make sure I grabbed all the tech merch I could and STICKERS! It seems that this year is going to be even more amazing too.

Plan for 2019 All Things Open

So this year I have a goal which is to come with a plan. Last year was more of a fanboy moment where I just wanted to hop around to hear some very talented people speak. Well, honestly this year will maybe be the same in a good way.

  • Database Learning
  • Front-End Engineering
  • Gamifying
  • 101 / Introductory

You can find the schedule here

The list above is not set in stone for me but last year I literally learned so much and really felt the sense of community in tech for the Raleigh NC area. Last year the Vue.js talk from Jen Looper, David Neal on Node and other awesomeness, and watching the Start-Up Pitch that Triggermesh did was beyond worth the entire conference. I am looking for some gems like this again and know they will be there.

As a front-end developer, I am looking especially forward to Chris Coyier from CodePen.io along with so many other talented people that will be there this year. I did realize that it is not about coming out of the three days with a new way of doing something but instead insight on how to complete certain things easier or explore new areas of tech that have been on my todo list.

On that note, if someone reads this and is wondering if they should attend the answer is YES! and if you see a dude name Timm it’s going to be me don’t be shy and say hello.

Truncate a Little Javascript

This is a snippet for me but fond that it may also be helpful to many so I wanted to take some time to place on the site. Too many times we are tasked with creating a blog and then it is needed to only show so much.

The Power Of Substring

The substring is about the easiest way of going about this as depicted here on the trusty W3C . But ironically upon my research of something I do know I found this little snippet of code as well.

Now the reason this stood out to me is just the simple fact that you can determine the amount you may want to show. So instead of only showing say 100 characters lets say you want just a little more to show to captivate the click per se.

(text_truncate(‘Super Duper Ice Cream Scooper’,19))

What the result of this would be is Super Duper Ice Cre….

Not that big of a deal as to do this with substring is just as easy too;

post.content.substring(0,90) + “…”

in this example, we are taking a variable and then just saying Yo substring from 0-90 you are good then put 3 dots on it! In this journey, I keep finding that there are literally 100 ways to get to the same result, and sometimes well most of the times taking the fastest approach is the best. I just enjoy finding ways of playing with code and this one stood out.

Best Node.js Explanation For a Newbie

Why is this the best node.js explanation for a newbie

It is plain and right to the point, if you are a seasoned programmer this may seem silly but honestly, everything out there was too in-depth for me to understand. Knowing about Node.js is important for a full stack developer, but being confused and not wanting to learn it is another challenge. Above I spoke of how node.js uses your code and how you can expect it to work once you start learning more about it. There is nothing like documentation so I recommend rolling over to NODE.JS after this and checking out the documentation.

What is node.js:

It is an environment that allows you to run javascript also known as a runtime environment. At first, JS was solely used in the browser, but the creators realized that there was so much more power available such as running a stand-alone application. Now with Node.js, the language has similar capabilities of popular scripting languages such as python.

Both Javascript and Node.js use the V8 JavaScript runtime engine. This takes your code and turns it into code that your computer can read without having to interpret it first. In short, it speeds up the process of a computer reading your code allowing for magical things to happen. Node.js is event-driven and does not block the input or output. That alone can tell you the beauty of this as it keeps it simple and executes what’s needed based on the event instead of worrying about the bits and pieces.

How you normally execute javascript

In the past, you would create a local HTML file on your computer then add a call to a relative JS file. From there you can open it up in a browser and play with it in the console. But that was the environment and in my mind made it to where being limited to just that made me feel that other than some functionality on a website that was all to be had. Then Node.js comes along and as mentioned before that RunTime Environment takes what I described out of the equation and opens to the doors for so many possibilities.

Node.js example

  1. First you need to have node installed on your computer
  2. Open your terminal / command line and type node -v
  3. Now you will see the version you have on  your computer
  4. Create a folder and put a normal js file in there stuff.js
  5. Navigate to that folder in the terminal and type node stuff.js

BOOM you will see your code executed without having to be on a browser.

Conclusion

Once again this was not for someone who is looking for that technical aspect of node and what it does but instead just the best node.js explanation for a newbie. Nothing was talked about NPM which is really neat and stands for Node Package Manager. What was talked about is this awesome way that you can execute JavaScript without the limits of a browser and hopefully you will continue to explore more of this amazing portion of web development. I write about things I am doing or dealing with just like my SEMRush tool breakdown or SEO for images, if you really like my style then sign up for the email below.

Higher Order Functions in JS

Now this is nothing new and fresh but for me it really was an ah ha moment when you are building out an application there are times when having a pre set function that is going to do some work later on. Now I am familiar with objects, methods, ect but sometimes a function within a function just feels right.


Lets Make Sandwiches With JavaScript

In this example let’s say we are making 3 different types of sandwiches, but depending on the type of sandwich there is going to be a different cost associated.

Sandwich types:

Dutch Munch, Tater Island, and Sweet Georgia

Each of these are going to have an automatic calculation associate with them due to the ingredients.

Dutch munch = toppings + 2

Tater Island = toppings * 3

Sweet Georgia = topping – 1

Bread cost = 1$ per slice

How Can A Function Help

Knowing that the cost of toppings plus the type of sandwich up charge how can we do this?

Let’s say that we need to have each topping cost $1 and each piece of bread used is also $1, but then each type of sandwich due to the cost of meat, special ect has certain costs associated. So first we know we are going to have a sandwich function which will always have the toppings and sandwich types, and each type of sandwich is going to have its own function.

Const toppingTotal = 1;

Cost bread =1;


Function dutchMunch(toppingTotal, bread){
Return (toppingTotal + bread) + 2

}

Function taterIsland(toppingTotal, bread){
Return (toppingTotal + bread) * 3

}

Function sweetGeorgia(toppingTotal, bread){
Return (toppingTotal + bread) -1

}

Function sandwich(toppingTotal,bread,sandType){
Return sandType(toppingtoal, bread);

}

Higher Order Function What!

So what is a Higher Order Function… basically, just a function that can take other functions as inputs. This helps in this situation as when we are creating the orders the input can be as follows.


sandwich(3,3,sweetGeorgia);

Behind the scenes this is automatically providing the (toppingTotal + bread) -1 that is allocated when someone buys a Sweet Georgia sandwich as it is the sandwich of the day. So save a buck and write a higher order function.

👏

What we did here is the beauty of JS and that is using a higher order function that is taking inputs from other functions to get the job done!

All Things Open Raleigh NC 2018

This was my first conference and it was amazing in so many ways. I am going to give a quick breakdown of some of the highlights for me and what my takeaways were in term of learning and experience. I cannot recommend a conference enough after I have gone, but with that said 3 a year every year is not needed. The biggest take away is although people are speaking and giving presentations on the technology you are interested in we are all human and can achieve what we want.


Before the Event Pre Game

I received my email saying what to bring and the schedule the day before, and as I was out of town there was no early registration for picking up my badge and swag…..oh that swag how I love it so much. So I knew that to be prepared I needed to be there early (7AM) and with a no brain fog. I went ahead and looked at the scheduled talks and mapped out my day, then crashed out for the night. I felt this was a good plan of action and also having it mapped out ahead of time gave me an insight on what to expect.

Day 1 of ATO

Showing up at the crack of dawn to go to an all day conference may of not been the best idea but in the end it was. All the booths were just getting set up and no one was there which means all the swag I want was at my fingertips, but also information on all the vendors. It is really neat to see the technology being showcased and seeing how it works, but when the event is in full swing that can be hard to do. After a bunch of cool shirts, socks, stickers, and free magazines I had the schedule of the day and started highlighting my plan.

First talk went amazing learning about functional programming in JavaScript and then I sat in for a start-up contest on new technologies which was super cool including BruVue, TriggerMesh and more. Those two stuck out the most check them out. In the afternoon I went to a Node.js crash course, CSS Bloat and How to Fix it, and wrapping up the day with Jen Looper titled human vs. ai: build a mobile app with vue.js, ml kit, and nativescript. By this time my brain was fried and it was time to go home.

Day 2 of ATO

Showed up early but not as early as the day before, as most of the swag was already spoken for and I had some solid goals for learning. The tracks for day 2 were cross-platform desktop apps with electron JS, framework free – building a single page application without a js framework (not needed but neat to see why frameworks are nice),  and rapid prototyping with vue.js . I have to say that fully impressed with all the learning opportunities and it truly did give me a revamp of wanting to code more.


Conclusion

This was truly an awesome experience and one that I hope to attend next year. My takeaways as I said is that we are all human and with consistent learning and positive attitude a good programmer can become better. I have to thank all those people for putting on this event and also the people who took the time to actually speak and put presentations together. There was one presenter that really took the cake and that was David Neil at https://reverentgeek.com/ really did great talks but also had some solid humor to go with it as well.

Learning JavaScript is Cool But Accessing Your Values is Better

Seems like always going back to the basics is key to growing in your journey as a developer. I find that if I am not consistently doing projects using all the tools then I forget. In my current situation there is not many peers to jump ideas off ect, so sometimes going to a beginner course for Javascript as the one offered in FreeCodeCamp helps tremendously. My “ah ha” moment came when I was almost done with basics of JS section and started with objects and how to access them. Writing code is great but it really comes down to (write code, compute, access values, and display).


Creating the Object in Javascript

There was a magical thing that happened with OOP was thought of and till this day I think it is a powerful concept. Create objects let them have duties, hold data ect, and then pull from them for your desired outcome.

An object could look like this:


How to access the object

You have a couple choices in this case I am going to go with dot notation “.” and also bracket []. I personally have no preference but the neat part is some of the differences.

Dot

  1. Property identifies can only be alphanumeric (and _ and $)
  2. Identifier cannot start with a number
  3. Identifier cannot be a variable

Bracket

  1. Identifier has to be a string or variable representing a string
  2. You can use variables, strings, spaces, and numbers for your identifier

Fun fact with both of these if you flatten your object and it is returned in dot notation you can then call on multiple objects using the bracket notation.


Conclusion

I literally wanted to jot this down as when you are making amazing code which is great the bigger it grows naturally you have to place objects together that hold data and so much more, so knowing some options from a beginner level on how to access them is key. As always I write this for myself but if anyone ever gets a little help from it then that is even better.

Learning is like a Treasure So Be a Pirate and Make a Map

As a developer the constant learning is real so why go about it blind. I recently have set a goal for myself to become more savvy with Node.JS and also hone in my skill with Vue.js just to make a more valuable programmer. You will see this adventure on the blog as I will post my findings and learning process, but first I knew for this to be successful I would need a plan or outline. Randomly one of my favorite quotes is from Martha Stewart “Life is too complicated not to be orderly”. Now I am not 100% positive that is from her but on my daily quote challenge I came across this and it stuck.


The Plan

Now I have been self learning basically all the various JS technologies out there for the last year but because I have spread myself to thin I knew that a focus was needed. The plan is to have a daily to do for both Node.js and Vue.js as to me it seems having an in depth knowledge of node assists with deployment of the Vue.js applications and many other applications. First I am going to start with my fundamental resources which is Freecodecamp.com and Pluralsight. The reason for this is well my year of Pluralsight which I have not used that much has some good Vue.js courses and challenging projects. The Freecodecamp does not have Vue but does have some good fundamental Node.js information to go over.



The Path To Gold


Instead of just going through the learning I am going to document daily for myself on whatever I learn and then re-explain it for retention in word form. If possible I am also going to attempt to sketch out any notes of what I have learned. Now I have been focusing on fundamental JS for years so this is going to be more high level in hopes for it to stick. Then come the tutorials like this one from Scotch.io which is an amazing source for articles and tutorials. The goal is to find reasons to combine both JS technologies to have a foundation.



Reality Check at the End

This is a personal 30-60 challenge to be able to say yes I know both Node and Vue well enough for say a freelance project, interview, ect. I am not expecting to be a pro but I am tired of being a jack of all trades in a way but not a master nadda. I am also not expecting one or 2 tutorials and a notebook to make feel confident enough to say I am done and know the learning will continue. But and a big but is I will then feel good enough to challenge myself for a hackathon or go to a Vue meet up with confidence to understand some material, or go to an event like all things open and not be like well I do not know any of this.



After a Pirate gets the Treasure

Self growth is so important as a developer and by challenging  yourself is the only way I think. I have been building wordpress sites for a few years now and also troubleshooting random software that people want to use, but my passion is to create beautiful code that runs on a server that I can say hey “I did that”. To any that read this or to my future self that is like WTF is this I wrote about pirates, its all about the challenges that make us grow, so if you are not setting daily, monthly or yearly goals what are you doing.