teleren/devto huggingface dataset:
Dev.to CLI Gem
Tags: ruby, cli
Published: 2020-01-20 02:01:18

I just completed my first project for my Flatiron software engineering program, and it feels so good! I had never even thought about coding outside of the lens of "Oh, really smart people do that!" until this past August, and although this is just the beginning of my journey, it's incredible how much I've grown since then.

I have never been so thoroughly challenged and excited by anything as I have these past few months learning to code. Every day marks a new concept or a new perspective on how to implement something. 

Although I experienced the feelings of Impostor Syndrome that are not unfamiliar to developers throughout the process, creating this gem was a fantastic way for me to prove to myself just how much I have learned.

The gem is designed to interact with the Dev.to API and retrieve the most popular posts. I totally geeked out while working on it when I realized that I was actually able to see the top post change when printed to the terminal. Seeing that real, changing data come through my design for the first time is a feeling that I'll never forget! 

My major sources of gripe were dealing with environment issues that sounded vaguely life-threatening and a problem with Bundler that has plagued more than a few of us.

I decided to center this project on this community's work, because I recently discovered it through Twitter, and I think that it is a valuable alternative resource for #CodeNewbies and vets alike. Thank you all for the great work you all do!
Array manipulation tricks in Ruby
Tags: ruby, tips
Published: 2020-01-20 01:33:35

Let's say we have an array and we do not want the first element of the array. Ruby provides a method **Array#drop** which removes the elements from the array and returns the result.

```rb
>> args = [1,2,3,4]
=> [1, 2, 3, 4]
>> args.drop(1)
=> [2, 3, 4]
```

Good thing about this method is that it does not manipulate the original array.

```rb
>> args = [1,2,3,4]
=> [1, 2, 3, 4]
>> args.drop(1)
=> [2, 3, 4]
>> args
=> [1, 2, 3, 4]
```

If we don't want first two elements of the array, we can pass two as the argument to **drop**.

```rb
>> args = [1,2,3,4]
=> [1, 2, 3, 4]
>> args.drop(2)
=> [3, 4]
```


Ruby also has a method **Array#drop_while** which drops elements *up to, but not including* the first element for which the predicate returns `false` or `nil`.

```rb
>> args
=> [1, 2, 3, 4]
>> args.drop_while { |a| a < 3 }
=> [3, 4]
>>
```

This method is useful when you know for certain that you don't want certain elements from the start of the array.

Ruby also has **Array#take** and **Array#take_while** which return the elements from the start based on the argument.

```rb
>> args
=> [1, 2, 3, 4]
>> args.take_while { |a| a < 3 }
=> [1, 2]
>> args.take(2)
=> [1, 2]
```

-----

[Follow me on Twitter](https://twitter.com/_cha1tanya) to know more tips and tricks about Ruby 😄
Maslow's Hierarchy of Needs In An Application
Tags: discuss, healthydebate, architecture
Published: 2020-01-20 00:50:00

## Introduction
 
First, thanks for reading! This is my first post here on Dev.

If you aren’t familiar with [Malsow’s Hierarch of Needs](https://en.wikipedia.org/wiki/Maslow%27s_hierarchy_of_needs) here's a brief explanation of the theory. There's a hierarchy of what a person needs, and they need to have all the things on one of the tiers before they can start fulfilling the needs on the next tier. Without having your basic physical needs satisfied, you can't have your higher-order needs fulfilled.

## What do you need in application?

Let’s take that and apply it to applications. Let’s assume that you can only have one of the following before you can add another:

- Performance
- Documentation
- Tests
- Readability
- Maintainability
- Functionality 
- Security
- Accessibility

I think that I would probably go in the following order:

1. Functionality--the app should work, right?
2. Readability--hopefully a person can read the code.
3. Maintainability--the code should be easy to maintain. This falls in line with readability, but has more to do with organization. 
4. Security--the application should be secure and follow basic security principles.
5. Accessibility--the application should be accessible to *ALL* users. 
6. Documentation--the code, as well as any user documentation, exists and is valid. 
7. Tests--the application has automated testing. This is my passion and it makes me so sad that this falls so low.
8. Performance--the application is performant. 

## Your Turn

How would you rank them?

What would you add?

What is missing?

How did you decide your order?
Dogmatic DRY and the SRP
Tags: dry, dependencies, reuse, srp
Published: 2020-01-20 00:26:30

---
title: Dogmatic DRY and the SRP
published: true
description: DRY code is not a gold standard
tags: dry, dependencies, reuse, srp
---

In the course of development you will certainly come across code where you notice an abstraction can be made.  Two code paths look so similar, there is a generalization to be made, the code can be more dry.  So you make the abstraction because it feels good!

The problem often is you may not have considered the impact and coincidence of time.  You may have based the decision to dry up the code solely on the fact that you can right now.  

The real picture is that the components or units of code that are "wet" have been separate up to this one point in time, and perhaps only now, in this one moment, do they look similar enough that a clean abstraction can be made.  However, the influences that have driven their "reasons to change" (S in SOLID) up to this point remain and will remain separate.

Had you not made this abstraction today, maybe two days from now, the units of code would appear so different you would never have considered abstracting them in the first place.  

If you did go ahead with the abstraction, you are now forcing separate units of code to "reuse" some common "abstraction" even though they are begging to be separated again.  Maybe they never had that much in common to begin with.  This is because the "commoness" of code is not driven by syntax or a temporary coincidence of common requirements.  Common code is determined by code which has the exact same reasons to change.

Now the question becomes, what is a "reason to change".  I believe there is a common misconception about the "responsibility" of units of code.  The common belief seems to be a unit of code should be responsible for one thing, it should do one thing well.  While that is true, consider this, computers do what humans tell them and programs are created by humans (directly or indirectly).  The only "reason" a program would change is because a person has new requirements for that unit of code.  A unit of code's "reason to change" is not the details of its implementation, but rather the person, or group of people, that influence its scope of requirements.  A unit of code should only be responsible "to" a single entity.

So, DRY up your code when you have multiple code paths doing similar things and they have the same reasons to change.  If the units of code have the exact same reasons to change, it is much less likely they will want to diverge in their implementation in the next five minutes (or year).  When you notice a common unit of code which used to have the same reason to change, now has multiple reasons to change, break it up until each piece has a single reason to change once again.  Reasons to change come from people, not implementation details.  So another way to look at this is, abstract common code when the requirements for those units of code are defined by one person (or group).  Break code apart if you notice multiple people (or groups of people) have competing requirements for a shared unit of code.
Git board - A dashboard build using React in two days from scratch. 
Tags: javascript, development, beginners, react
Published: 2020-01-20 00:22:53

---
title: Git board - A dashboard build using React in two days from scratch. 
published: true
description: It is a dashboard for the top 100 repositories based on GitHub Stars
tags: #javascript, development, #beginners, #react
---

## Introduction
I always want to build an application that has a dashboard. I decided to start building the dashboard using the GitHub API. I started the project called **git-board** which is is a dashboard for the top 100 repositories based on GitHub Stars.

## Final Design
* Home page
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/o0buudn3om7yxcsn117o.PNG)

* Dashboard
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/qy2rw112vae2elfyify8.png)

## Technical approach
1) Create the base app using create-react-app
2) create two pages `home page` and `dashboard page`. The home page is the landing page that lists down the top 100 repositories. The dashboard page is the main page that shows the detailed view of the selected repository.
3) First created a `Header` component that is different based on the route as shown below 
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/jn8op6nlqvrkrjtjanxf.PNG)

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/oigeq68lzhrpktujcsgn.PNG)

3) Use the fetch API to fetch the data from the Github API 
4) In home page list down the top 100 repositories in card format with their logo, name, and description as shown below

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/oyllxmsuqyyc9jfpa68e.PNG)

5) Build a search box for filtering out the repository as shown below

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/7i889anqwnajxxfrfvyu.PNG)

6) on click of the card, we are navigating to the dashboard page and passing down the selected repo owner name and name.

7) In the dashboard page, we have created the grid using the flexbox based on our design

8) I have used the *canvasjs* charting library for visualization. Based on the types of a chart I have to build a component like BarChart, `columnChart` etc.

9)In the dashboard page, I have used the multiple GitHub API using the `promise.all`. Based on the data render the respective chart.

10 The final output of the dashboard is similar to as shown below.
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/qy2rw112vae2elfyify8.png)

## Demo Video
{% youtube FX7QsYFV5oY %}
 
## Resource
If you like my work please give a star as an appreciation on my GitHub repository.

Github - https://github.com/karkranikhil/git-board
App URL - https://git-board.karkranikhil.now.sh/
I Use For Loops Almost Always In Javascript
Tags: javascript
Published: 2020-01-19 23:24:27

Recently, Kent C. Dodds posted about an instance where using a for loop dramatically resulted in better performance.

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/xxf24iunzx9lbeui9htj.PNG)

When you delve into how `filter`, `map` and `reduce` methods work (based on callbacks), really it is of no surprise to anyone who sees the results for themselves that these methods are a lot slower.

Replying to Kent's Tweet, I mentioned how I always use for loops and how their performance is unrivalled:

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/a4fryq47b4b7qr4e8d6q.PNG)

Really, it did not take long for the defensive Tweets from other devs on Twitter.

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/ouavvr0yqvxjjuev2eip.PNG)

## For loops are not just about optimisation

Yes, for loops are faster and yes, if you're not careful they can have unintended side effects as a result of not using better-suited methods like `filter` or `reduce`, but I don't use for loops with the sole purpose of optimising my code.

In most cases, you won't notice any difference in performance for small data sets. When you're dealing with tens of thousands of items like Kent was, then you definitely will.

If you are working with promises and want to use `async/await` then you need to use a for loop to do that as those beloved one-liner methods do not support them very well.

If you want to be able to control the flow of the loop (break out of it), then you will want to use a for loop.

While for loops will add to the size of your code and not be as "clean", we need to stop focusing on clean code and focusing on clear code. To me, nothing is more immediately clear than a for loop.

I am also not advocating against using those specific methods. I still use `filter`, `map` and `reduce` where applicable. In most instances, I find for loop is easier to write, even if it usually results in more code.

As front-end and Javascript developers, we need to stop pretending there is one right and true way of doing something in Javascript. Because there is not. Everyone has opinions and preferences, we need to accept that we are all different.
The power of 'focus music' for programmers
Tags: productivity
Published: 2020-01-19 23:22:06

:wave:

If you've developed a seriously high tolerance for caffeine like me, you may want to read on :thinking:. 

Quickly after working full-time as a developer, I began to realize that my morning cup of Joe wasn't working for me anymore. Soon, two, three and then four cups of Joe :coffee: :coffee: :coffee: :coffee: simply wasn't cutting it for me!

The coffee jitters had me all like:

<img src="https://media.giphy.com/media/3orieXICLyh0qpuIyQ/giphy.gif" width="450" height="450" alt='too-much-coffee' />

I explored other ways to boost my morning productivity. l-Theanine combined with the coffee does help, but the rest that I tried were overpriced and way overhyped IMO (bulletproof coffee :lying_face:).

I recently discovered, what I can only describe as, 'focus music'. That is music which has been specifically created to improve focus and concentration. Heck, even [Kipochge listens to Kelly Clarkson](https://www.runnersworld.com/news/g23901366/eliud-kipchoge-playlist-kelly-clarkson-songs/). I have always avoided music while working as it invariably becomes even more distracting than the original noise I'm trying to drown out. So, when I signed up for a trial with Brain.fm, I wasn't expecting too much (although, I did expect it to be at least better than Kelly Clarkson). However, I was pleasantly surprised by how effective their music was! I was able to quickly and consistently develop a [flow state](https://hackernoon.com/flow-state-hacking-your-productivity-95b28668e280). There is a bunch of [research](https://www.brain.fm/science) about _why_ their music is so effective (something to do with pitch and lack of instrumental complexity of the music). All I know is that I have replaced my jitter-inducing coffees with a cup of green tea :tea: and focus music :musical_note:. 

He's deep in that flow:

<img src="https://media.giphy.com/media/13HgwGsXF0aiGY/giphy.gif" width="450" height="450" />

I have since found the Brain.fm desktop app a little buggy and prefer to work my phone switched off. Therefore, I have replaced it with simply using YouTube which is awash with free focus music soundtracks.

Have you tried 'focus music', and what are your productivity boosters?
Jupyter Notebook Cheat Sheet
Tags: jupyter, todayisearched, python
Published: 2020-01-19 23:15:11

# Jupyter Notebook Cheat Sheet

Hello guys, happy to be back to another post!

Today i will talk about something useful and not at all complex. It's more about helpful tips. 

I was learning python and was using Jupyter Notebook, so i needed to learn the shortcuts to use it, so... 

Here are some of the most used shortcuts for the jupyter notebook.

![](https://media.giphy.com/media/DddiSElbjDAzu/giphy.gif)

Shift-Enter: Run the cell selected and select below the cell you are currently in.

Ctrl-Enter: Run the cell selected, but don't jump to the next cell.

Alt-Enter: Run the cell selected and insert below.

Y: Code

M: Markdown.

R: Raw.

1 to 6: Headings.

A/B: Insert cell Above/Below.

X: Cut selected cell.

C: Copy selected cell.

Shift + V: Paste cell above.

V: Paste cell below.

Z: Undo last cell deletion.

D,D: Delete selected cell.

O: Toggle output.

Shift+O: Toggle output scrolling.

Ctrl + ]: Indent.

Ctrl + [: Dedent.


I think this are the most common and most used, hope it was useful!
Choosing a Branch Strategy
Tags: git, branching
Published: 2020-01-19 23:11:59

In the previous article I clarified using branches for communication and Continuous Integration. Here I want to emphasize it does not matter. 

Conceptually a branch is a movable pointer to a commit. In reality that is exactly what it is. This is important because when cloning a repository you are creating a branch.

Since git maintains a list of commits, starting a new branch at any point in history is as easy as providing a name. It can point at the same location as another branch and as such is the same as the other branch.

# Define When to Branch

You will need to specify what is the appropriate branching time.

First off, your local branches are yours and you can do with them what you want.

Long standing branches are a liability. Branches should get created when you need to support/maintain codebase separate from another maintained/supported codebase.

# Marking Commits of Interest

Sometimes when you support a codebase you don't expect to need to modify it, maybe you need to go back to code which isn't supported except today it was decided to do so. 

Tags, the are pointers to commits which cannot be changed. This is a good way to mark commits which are of interest for future support if needed. I recommend having some form of tagging on any release which makes its way to production.

# Selecting a Branch Strategy Which Matches Your Support

When you read through all the approaches for Git branching, evaluate if the long standing branches are codebases your team wants to and is equipped to support, which means applying patches to without all the other work happening.


# Promotion

Concider following me if you liked the article. Check out my profile to see if you enjoy my other writings. I cover git, testing, D, and more.
🚀 Get better at web development: CodeSnacks 🍫🍪🍩 Tutorial Tuesday Newsletter + one sweet JS hack!
Tags: javascript, webdev, beginners, svelte
Published: 2020-01-19 23:02:52

tldr: **[🚀🚀🚀subscribe](https://codesnacks.net/subscribe/)** to my web development newsletter and let's grow our skills as developers together!

13 is my lucky number. And this is my 13th article in my codesnacks series. So I hope I'm lucky and you forgive me for some self-promotion.

I write a couple of tutorials each week - mostly about JavaScript but also about web development in general.

Currently, it's mostly **vanilla JS** content but it will also be about **React**, **Vue**, **Node.js**, **Svelte**, or other topics. Primarily I write **snackable content**. 

I try to communicate one specific idea or one trick I learned in less than 5 minutes, hence the name codesnacks.

If you'd like to receive a small newsletter every week with my tutorials and other stuff I liked, then please **[subscribe](https://codesnacks.net/subscribe/)** to my Tutorial Tuesday newsletter.

---

It will contain stuff like this:

[💡 Dealing with command line arguments in Node.js](https://dev.to/benjaminmock/dealing-with-command-line-arguments-in-node-js-4c1e)
Learn how to read command-line arguments in Node.js.

[Coercion in JavaScript - 🤔 do you know what it is?](https://dev.to/benjaminmock/coercion-in-javascript-do-you-know-what-it-is-1hh4)
Learn about coercion - implicit and explicit. Which methods use coercion and what the implications are.

[const 📦, seal 🤐, freeze ❄️ & immutability 🤓 in JS](https://dev.to/benjaminmock/const-seal-freeze-immutability-in-js-2m77)
Learn about the Object.seal and Object.freeze method, their limitations and what distinguishes them from immutability


As a small thank-you I'd like to share one little hack with you to *access the last element of an array*:

So instead of doing it like this

```js
const arr = [1, 2, 3]
const lastElement = arr[arr.length - 1]
```

You can also use `slice` and `pop`.

```js
const arr = [1, 2, 3]
const lastElement = arr.slice(-1).pop()
```

You might ask why you want to use this syntax. Well, you don't need to save your array to a variable this way. 

Let's say we want to get the last link of a webpage. You could do it like this, without saving the list of links into an additional array:

```js
Array.from(document.querySelectorAll("a")).slice(-1).pop()
```

---

Want to get better at Web Development?
[🚀🚀🚀subscribe to the Tutorial Tuesday ✉️newsletter](https://codesnacks.net/subscribe/)
💡 Dealing with command line arguments in Node.js
Tags: javascript, beginners, webdev, tutorial
Published: 2020-01-19 22:36:42

So you want to use and read command-line arguments in your Node.js application?

So instead of using this to start your application

```js
node app.js
```

We'll learn how to pass some arguments like this:

```js
node app.js waffles 8
```

You can access these arguments via the `process` object, that's built into Node.js. It has an `argv` property, that contains an array of command-line invocation arguments. Let's see what it contains. We use the above invocation and the following `app.js`:

```js
process.argv.forEach((value, index) => {
  console.log(`${index}: ${value}`)
})
```

For my machine, this is what is logged:

```js
0: /usr/local/bin/node
1: /Users/bm/development/codesnacks/app.js
2: waffles
3: 8
```

So the first argument is always the full path of the node command itself. The second argument is the full path of the executed js file. But that's not what we're interested in. We're interested in `waffles` and the amount of them. This is what follows as the third and fourth arguments.

So let's improve our code a bit and get just the relevant arguments by slicing our array accordingly.

```js
const args = process.argv.slice(2)
process.argv.forEach((value, index) => {
  console.log(`${index}: ${value}`)
})
```

```js
0: waffles
1: 8
```

Okay, cool. Now we can use the command-line arguments in our application:

```js
const [pastry, amount] = process.argv.slice(2)
switch (pastry) {
case 'waffles':
    console.log(`Charly Waffles eats ${amount} waffles`)
    break
case 'donuts':
    console.log(`The dog ate ${amount} donuts`)
    break
default:
    console.log('The pastries argument is missing')
}
```

And most probably you can write an application that makes more sense than this one 😁

---

Want to get better at Web Development?
[🚀🚀🚀subscribe to the Tutorial Tuesday ✉️newsletter](https://codesnacks.net/subscribe/)
How do you (gue)estimate the size of the room you live in?
Tags: watercooler
Published: 2020-01-19 22:29:33

---
title: How do you (gue)estimate the size of the room you live in?
published: true
description: Discussion on how you determine the size of the room/apartment/house you are in without using your measuring tape.
tags: watercooler
---

Quite often, when I speak with people outside of the UK, one of the off-the-cuff questions we'd get into when we discuss the cost of living between different places is:

> How many square metres [or insert equivalent imperial measurements] are the room/house/apartment you live in?

In all honesty... I never know the answer to this! The housing market in the UK tends to describe rooms with vague terms like "a large double room available", which is highly subjective.

So out of interest, what's your trick for figuring out roughly how big a room is without getting out the measuring tape? 🤔
Project Euler: Problem 2 Walkthrough
Tags: projecteuler
Published: 2020-01-20 02:27:59

---
title: Project Euler: Problem 2 Walkthrough
published: true
date: 2020-01-19 21:56:00 UTC
tags: Project Euler,project euler
canonical_url: 
---

This article is a full walkthrough to the solution for Project Euler problem 2. Stick around to see how I solved this problem. This article...

The post [Project Euler: Problem 2 Walkthrough](https://jaeheonshim.com/project-euler-problem-2-walkthrough/) appeared first on [Coding with Jaeheon Shim](https://jaeheonshim.com).