Featured

Introducing Dev4Good

Hi, I’m Nik. Welcome to DevforGood 🙂

As the name of this blog implies, I write about technology and how it can be used for public and social good, from the point of view of someone who comes from a non-technical background and education.

Why start Dev4Good?

Well, I would like to suggest going here, but TLDR there are 2 reasons this blog exists:

  • First, I wanted to document and share my self-paced learning journey into computer science and programming (and in doing so, connect with other students and professional developers to augment the learning experience).
  • Second, I’m deeply interested in how technology can be used for good especially within the public sector. Ideally this little corner of the World Wide Web can serve as a resource bank for people who want to become more active and informed citizens and/or looking for ways to serve their community and/or “volunteer from home” for causes they care about using their technical skills. In other words, Dev4Good is about deeply immersing into the philanthropic aspect of technology and how together we can apply it for public and social good.

What can you expect?

Honestly, this is a learning blog first and foremost! But I’ll try my best to organize everything into something sensible:

  • Blog
    • Learning Journey: where I’ll fully reveal myself as a nerd with coding exercises and walkthroughs like this, interesting coursework, and practicing explaining my rationale for how I would go about solving a problem.
    • Dev Curriculum: a personal self-paced curriculum as someone who wants to build both capabilities across programming, full stack solutions engineering, cloud computing, databases and information systems, and digital transformation in general. I may write about current or future courses I intend to take as well to help inspire others to embark on their own self-learning journey!
    • Portfolio: basically a work in progress, but this will be where I link to interesting projects I’m working on or want to work on. Think open source contributions and snapshots from Github that would make up my own development ‘roadmap’ if you will.
  • Resource Bank
    • Tech For Good: research, in-depth information, and spotlights on people, public and private organizations, social businesses, and government entities where technologies are either currently or can eventually be leveraged for public and social good.
    • Volunteering – hand picked skills-based volunteering opportunities
    • Orgs Database: a regularly updated database of nonprofits, social justice groups, philanthropic arms, social businesses and opportunities for skills-based volunteering and other contributions
    • Reading List: some of my favorite / recommended books across technology, coding better, social businesses, progressive capitalism, economics, social justice, and anything that happens to be inspiring. This may includes random bits from personal development, motivation, and self-help too (because boy do we all need it!)

Want to connect?

Please email dev4goodorg @ gmail or visit the Contact page to get in touch!

Advertisement

Eloquent Javascript | Chapter 2 | Coding Exercises

I’m currently going through the highly recommended “Eloquent Javascript” textbook (which is also available for free as a pdf here) and wanted to document all of the problem sets and projects to:

  1. log my current skill level at solving coding challenges and assess my knowledge
  2. compare with the text-book provided solutions to see how my code can be refactored, and
  3. track progress on how my overall coding and problem-solving hopefully improves over time

The purpose is to get a deeper understanding of the Javascript language by methodically going through each problem set, and then ‘translating’ the code into human language to drive home what it is I am actually trying to solve. The reason I’m taking this low and slow approach is because ever since I was younger, I always had to work five times harder to understand math and science subjects. And I think over time as an adult, I had convinced myself that I wasn’t good at either of those subjects. However, at the end of the day I find solving problems to be extremely fulfilling so I’m hoping this method of self-learning and keeping myself accountable by logging everything will help me master my own insecurities and become a more confident and competent programmer, i.e. a person who solves problems eloquently with code and technology.

The goal of this chapter is to understand Javascript is structured as an actual program


Problem 2.1 – Looping a triangle – My Solution

let result = "";
for (let counter = 0; counter <= 7; counter ++) {
console.log (result += "#"); }

// -> 
#
##
###
####
#####
######
#######

My Solution Translated

// this practice helps keep me accountable in logging the theory that I learned but more importantly, to assess how I’m actually applying what I’ve learned into solving each coding challenge.

First, I initialized the result to be an empty string. Then I created a for loop (which is a more streamlined version of the while loop) where I initialize a counter to 0; then the expression “counter is less than 7” to check if the loop should continue; and then the final part, incrementing counter by 1 to update the loop.

While the counter is less than 7; the program is to execute the statement in the body (code between the {}) which is to log the result and add the “#” each time. This is why I had to initialize result as an empty string so that the result doesn’t start with “##”, and instead starts with “#” as the challenge dictated.


Marijn Solution

for (let line = "#"; line.length < 8; line += "#") {
console.log (line);}

While, I was able to solve the problem on my own and the result was the same, this is a much more eloquent solution.

The concept I didn’t leverage was the length property of a string, since “#” is a string.

str.length // syntax, this property returns the number of code units in the string
str.length(""); // empty string will return 0

Problem 2.2 FizzBuzz – My Solution

//Part 1 - prints a program that console logs 1 through 100, but for every number //divisible by 3, print "Fizz", and for every number divisible by 5, print "Buzz"

for (let counter = 1; counter <= 100; counter++) {
 if (counter % 3 == 0) {console.log ("Fizz");}
 else if (counter % 5 == 0) {console.log ("Buzz");}
 else {console.log (counter);}}

//Part 2 - in addition to above, for every number that is divisible by both 3 and 5, print "FizzBuzz"

// See Iteration 1. *did not solve*

My Solution Translated

First, I initialize the counter as 1 and write the rest of the conditions for the for loop. Here, I have to apply what I know about conditional statements so that I can get any number divisible by 3 to be replaced by “Fizz”, and the same for 5 but with “Buzz”. I actually found this initial part fairly easy as it built upon the loop exercise from 2.1.

That said, the second part of the challenge which is to add another condition, so that if a number is divisible by BOTH 3 and 5, then replace that number with “FizzBuzz”.

I looked at the hint provided since my code solution wasn’t working:

// Iteration 1

for (let counter = 1; counter <=100; counter ++) {
 if (counter % 3 == 0) {console.log ("Fizz");}
 else if (counter % 5 == 0 ) {console.log ("Buzz");}
 else if (counter % 3 == 0 && counter % 5 == 0) {console.log ("FizzBuzz");}
 else {console.log (counter);}
}

This 1st iteration printed out the same thing as only part 1 of the solution, and didn’t print out “FizzBuzz” for the number 15, as an example.

The Hint:

The first simple solution for the “FizzBuzz” is to just add this additional conditional branch to the first part, which is what I attempted above. However this didn’t work.

The reason is because my conditions were in the wrong order – my code would never reach the block inside the && operator because either the first condition (counter % 3 == 0) or the 2nd condition (counter % 5 == 0) would be true first. (Thank you Stackoverflow)

// Iteration 2 with the conditions in correct order

for (let counter = 1; counter <=100; counter ++) {
 if (counter % 3 == 0 && counter % 5 == 0) {console.log ("FizzBuzz");}
 else if (counter % 3 == 0 ) {console.log ("Fizz");}
 else if (counter % 5 == 0 ) {console.log ("Buzz");}
 else {console.log (counter);}
}

The alternative, supposedly more ‘clever’ solution is to build up a string containing the words to output and print either this word or the number if there is no word, by potentially leveraging the || (or) operator.

Marijn Solution

for (let n = 1; n <= 100; n++) {
 let output = "";
 if (n % 3 == 0) output += "Fizz";
 if (n % 5 == 0) output += "Buzz";
 console.log (output || n);
}

This is really eloquent, and to be honest I would’ve never come up with this solution even after reading the hint (which I struggled with). That said, let’s dissect this.

The for loop is the same – there is no question there. The body statement is what I had to read a couple of times over to see how the “FizzBuzz” actually came into play.

If I translate the first condition: if the number if divisible by 3, then print output = “” + “Fizz”, or just “Fizz”.

Then, instead of an ‘else’ statement, it’s just a secondary ‘if’ statement separate from the first condition: if the number is diviislbe by 5, then print “Buzz”.

Finally, the last || operator is what makes this so succinct – print either the string output or the number depending on which conditions are met

So for example, when the counter reaches 15, it satisfies both the first condition, so will print “Fizz”, but then also satisfies the 2nd condition which would output “Buzz”, so that end result would be “FizzBuzz”.

Essentially, having 2 separate if statements like above acted as the && condition in this case. Lesson learned – I definitely have a long way to go.


Problem 2.3 Chessboard

My Solution (or lack thereof)

// Iteration 1 which was admittedly half baked. Maybe I was tired, but I am sorry to admit that I had given up after this first iteration. My mind went blank.

let hash = "#";
let space = "_";
let size = 8;

for (let counter = 1; counter <= size; counter ++) {
  	if (counter % 2 == 0) {console.log (space);}
	else {console.log(hash)};
}

/* printed out below result which was incorrect. I just set it to "_" to help visualize the solution, but otherwise it should've been an empty space.

#
_
#
_
#
_
#
_
*/

Admittedly, I was partially on the right path by leveraging the modulo %2 to denote even or odd, which would help determine if a # or “” should be placed at a given position. Now below is the actual solution:

Marijn Solution

let size = 8;
let board = "";

for (let y = 0; y <size; y++) {
 for (let x = 0; x < size; x++) {
  if ((x+y) % 2 == 0) {
  board +="";}
 
 else {board += "#";}
}
board += "/n";
}
console.log(board);
//result
 # # # #
# # # #
 # # # #
# # # #
 # # # #
# # # #
 # # # #
# # # #

Marijn Solution Translated:

First, initialize the binding size of the board which is 8. Size refers to the size of the grid (so 8 units wide, 8 units long).

Then, initialize a second binding, board, which is set to an empty string.

The double for loop: the order of the loops must follow the order in which the lines are built up, so line by line left to right, then top to bottom

Outer loop – handles the lines (i.e. board ‘height’ or ‘y’)

Standard for loop. No question there. Right before the outer loop closes, we include the code to add the “/n” new line character.

Inner loop – handles the characters within the line (i.e. board ‘width’ or ‘x’)

To determine whether to put the # or the ” ” for the given width, which shouldn’t exceed the size value, an if statement is used:

While y is less than 8, and x is less than 8:

If x + y is even, then print board (which was initialized to an empty string)+ ” “, otherwise if the sum of x + y is odd, then print board +”#”.


Today’s score: 50% (out of the 4 coding challenges, I got 2.1 and first half of 2.2 correct)

Today’s Lesson / Feedback to Self: Build up more stamina and focus to push through challenges I don’t get, instead of overly relying on hints and/or giving up.

Building a foundation in logic and problem solving with UPenn’s Computational Thinking MOOC

What is “Computational Thinking for Problem Solving”?

It’s a relatively short course introducing students from all backgrounds on how to systematically solve a problem and then expressing that solution in a way a computer can understand it. This program primarily focuses on problem solving approaches based on the four pillars of computational thinking: decomposition, pattern recognition, data abstraction, and algorithms. The course then concludes with applying these pillars for solving problems using basic Python.

Why enroll in this course?

This course is created by the University of Pennsylvania and distributed through the Coursera platform. I took (and completed!) this course to first and foremost test myself on a) if I’m disciplined enough to take and complete an online course and b) to see if I’ll enjoy problem solving and coding. I happened to really enjoy this course and it has what prompted me to apply for the MCIT Online Program at UPenn, which is a Masters in Computer Science meant for students with non-Computer Science backgrounds.

How can you benefit from this course?

I think there are 2 main benefits for taking this course:

  • Whether you are interested in computer science or not, the problem-solving methods you learn about in this course are essential since it can be applied to any aspect in work and life, so in terms of practicality and relevancy this is way up there! In fact, I used these approaches to solve a take-home assignment for an interview (one of those questions where there isn’t a right answer, but rather it assesses how you think and reason through a problem) and I think the hiring manager was impressed because I eventually got the job! (more on that later)
  • It is a great “litmus test” to see if you would be interested in pursuing more technical studies and get into computer science. In fact, it may inspire you to enroll in a degree program like me!

What are next steps after completion?

The last module of this course concludes with several basic Python exercises, so I highly recommend continuing your study of Python via online courses on Udemy, Coursera, or Udacity or interactive e-learning sites like freeCodeCamp or Codecademy. I am by no means an expert yet, but I find the language human-friendly and great for beginners like me to dip their toes in the water with programming.


Course Details:

Course link: Coursera

Curriculum Outline: Topics by Week

More on Computational Thinking, specifically

Link to Viewpoint here

Favorite parts of the curriculum:

  • Flexibility to do the program on your time – for me personally, I wanted to complete this course before I apply for UPenn’s MCIT Online program as a way to test myself and get a feel for the class format overall.
  • Approachable instructors and fun case studies that provided real-life context to the problems
  • Peer-graded assignments made finishing this course on time much easier. Also the TAs were super helpful and responsive whenever I came across issues with the programming assignments. Plenty of activity in the course discussion forums as well so good student community overall.
Next Steps

For me, this course really opened my eyes to how fun Python can be. To date, I’ve mostly been self-taught in the basics of HTML, CSS, and Javascript from learning on-the-job but I’ll be looking forward to reading and studying “Problem Solving with Algorithms and Data Structures using Python (2nd Edition)” by Bradley N Miller and David Ranum as well to continue my studies in Python (this book was a wonderfully strange and random Christmas present I got last year!)

In short, as a result of taking this course I have been:

  • inspired to take problem solving approaches further
  • motivated to continue practicing the logical and systematic breakdown of problems into solutions
  • looking forward to preparing for next course of study in computer science

Exciting times ahead.