Note: This post is part of my JavaScript learning progress series. Link to my first quarter (2018) learning progress: My Three Months of JavaScript Learning.
As indicated in my first quarter overview post, I have been learning JavaScript a few hours (2-3 hrs) a day beginning new year 2018. I also discussed in the post about my learning schedule, learning road map, and reviewed learning progress. I continued my JavaScript (JS) learning schedule in the second quarter too. This post is overview of my learning/coding progress for the second quarter (April-June) of 2018.
Second Quarter Goals
While reviewing my first quarter progress, I had set the following goals for the second quarter:
- Focus on understanding the basic JS language and handling DOM.
- Better understand & practice JS language, its terminology (eg.
scope,hoisting&scopeetc) from The Modern JavaScript Tutorial. - Time permitting, start some practical small projects to practice my learning.
- Write detail learning-note posts on all topics covered.
Topics Covered
This quarter my focus was deeply learning fundamentals of basic JS language, and covered following areas:
- JS Functions : I started learning functions – basics, difference between declaration and expression, brief introduction to callbacks & arrow functions. Learning Arrow Functions deeply is planned for the next quarter.
- JS Variables : I started learning about variables scope & hoisting, differences between var, let and const variable declaration, understanding let & temporal zone.
- JS Objects : Object basics including Prototypes & Inheritance.
- JS Classes : Learning JS classes – the basics, difference between classes & functions, methods & definitions, sub-classing. More detailed understanding of class & prototypes is planned for the next quarter.
- JS Arrays and Array Methods : JS arrays and array methods is a long topic and spend sometime learning documenting.
- JS Keyed Collections : The keyed collections – Maps & Sets was advanced topic to learn and understand.
- Jekyll-based Websites: Learned the basics of creating Jekyll-based static websites. To learn to customize with Jekyll-based themes required further learning.
- Progressive WordPress Themes with WP Rig: Took a break to watch & get squinted with The Progressive WordPress Theme Rig – a starter theme with build process, bundled into a single boilerplate theme development package.
Other Related Topics
This quarter, I spend entire time on JS language except the following small breaks, which too are related to JavaScript:
- Learning to Create Static Sites with Jekyll – Single page static sites are gaining popularity among savvy techs. I spend some time to familiarize myself with Jekyll, one of the most popular among the static-site generators in 2017. Prepared two posts: Learning to Create Static Sites with Jekyll & my take on Jekyll-based sites.
- Progressive WordPress Themes with WP Rig: The LinkedIn Learning staff author Morten Rand-Hendriksen released Building Progressive Themes with WP Rig in Lynda library and I quickly jumped into it to learn more about it. It is a starter theme with build process, bundled into a single boilerplate theme development package. I would like to use this package to modify one of my themes in future.
- Previewing Learning React JS Tutorial: I took a break to review Learning React Js by Eve Porcello in Lynda library to get a general idea that which JS syntax are more commonly used in React JS. It appears that some ES6 features including: function (especially arrow function), Objects, Classes, Maps, Sets and other ES6 features need deep dive learning before I jump into learning React JS library.
Learning-note Posts
This quarter I started documenting all my JS learning by writing learning-note posts. Although most learning-posts are still in drafts stage, preparation of these posts helped me to clarify my thoughts, understand concepts & identify my skill gaps. This process also forced me to search for additional resources to fill my learning gaps and motivated me to learn more deeply.
If you can’t explain something simply, you don’t understand it well enough. Albert Einstein
What I Learned
- Deep Dive Learning. While learning and documenting my learning-note posts, I was able to identify my knowledge gap, that I thought I knew previously.
- Learning-note Posts: Note-posts preparation was time consuming and to quote Bryan Gaensler: “Research is spending 6 hours reading 35 papers, so you can write one sentence containing 2 references“. Nevertheless, I was able to write more than 18 detailed learning-notes.
- I can Learn JS. After learning for six-months I am motivated now that I can learn JavaScript. It is a very good feeling because when I started learning I was not so sure about this.
- Learning Without a Break : Since I started learning JS, I have been learning every single day without any break. Even when I get frustrated or feel burn-out, or simply stocked because I can’t figure out certain topic, I change subject (eg. CSS Grid, Gutenberg) but keep maintain my daily learning routine.
Lessons Learned
- Learning from First Quarter Experiences : In the previous quarter, I had learned that I should focus on a few quality tutorials and not on the teaser-tutorials on Medium and HackerNoon.
- Learning Deeply : Learning deeply, although time consuming, helped me to better understand and appreciate JS language.
- The MDN JS Guide: This quarter, I relied heavily on the MDN JS Guide and MDN JS Reference as my primary learning resource, which was very helpful.
- Learning JS Arrow Functions : In modern JS codes, Arrow functions is widely used and its deep understanding is critical for JS learning.
- Learning JS Classes : A deep understanding of JS Classes, which are similar to JS functions, is essential to understand and write better codes as it widely used in most modern JS libraries including React JS.
Goals for Next 3-months
My goal for the next 3-months (and beyond) is to continue deep learning JavaScript with a goal to master basic JS language with an emphasis on ES6 features including the following topics:
- Arrow functions : are represented with fat arrow
=>and make functions code shorter. They are frequently encountered everywhere in ES6. - Loops and iteration : Loops offer a quick and easy way to do something repeatedly through different iteration statements.
- Iterators and generators : Iterators and Generators bring the concept of iteration directly into the core language and provide a mechanism for customizing the behavior of
for...ofloops. - Object – getters and setters methods : A getter is a method that gets the value of a specific property. A setter is a method that sets the value of a specific property.
- Data types & Structures (literals, numbers & dates, and text formatting).
Time permitting, I will start learning about DOM & deep diving into DOM (document object model).
My additional to-learn list include learning the following ES6 features (definition from MDN Reference) including AsyncFunction, Promises, Default Parameter, Destructuring, Rest parameter, Spread and ES6 – Cheatsheet | GitHub.
Inspirational posts
The following posts were inspirational and motivated me to continue to learning even my most frustrating times:
- Tyler Elliot Bettilyon’s inspirational article A Lifetime of Learning to Code in medium was uplifting. I came across this article when I was getting little frustrated from my learning progress. This Tyler’s article reminded me that learning & mastering a programming language takes about 10-years. Getting frustrated after three-months of learning is not realistic.
- JS developer at Microsoft and award-wining speaker Sara Drasner‘s CSS-Trick post Balancing Time is very inspiring. Like Sara, I also start couple of learning topics at time and switch topic to topic while I am learning and preparing my learning-note posts.
- Alberta Williams, who writes for the X-Team and Envato Tuts+, article on How to Level up Your Development Career was very inspirational.
- Posts by Zell Liew inspires me all the time. Indeed, my JS learning road map is adopted from him.
Developers and Blog Sites
The following tutorials & blog sites I consulted and found resourceful in my learning adventure.
Naveen Karippai | GitHub | Medium
A JavaScript & Python Developer. I came across his Medium posts while doing my research on JS classes. His this article on JS Class was very helpful.
Peleke Sengstacke | Twitter | GitHub
I came across while doing research JS classes. I found his Deep Dive into Classes is very informative.
Alberta Williams | GitHub | Web Site
I came across through her Tuts+ tutorials on JS Sets and found very interesting. Followed her other posts on X-Team as well. Her Tuts+ posts on JS will be useful in my ES6 features learning.
| GitHub | Website | Personal Blog | Twitter
Very useful learning resource on ES6 features. His posts are very detailed and well described.
Wrapping Up
Late last year when I was making my JS learning plan, I would have never imagined that I would get into this JS thing in such a way. The past six-months of my JS learning has been a quite a fun journey. In this quarter, I practiced my learning by documentation. Everything I learned has been documented as detailed learning-note posts. Although, this form of learning was a very time consuming, I thought it’s worth of my time and I plan to continue doing so in the future too. Since I am still learning basic JS language and have not yet done practice projects, most JS code still appear foreign to me. However I definitely feel that I have overcome my fear of confronting it head on and now strongly believe that I definitely can learn JS. As also stated in my previous progress overview, the next three-months to end of the year is crucial before making an reasonable judgement on my learning progress. Until then I plan to continue to stay focused. Happy Coding!