teleren/devto huggingface dataset:
Jest Run It - Run and debug individual Jest tests from VS Code
Tags: vscode, productivity, jest, javascript
Published: 2020-02-12 00:48:19

---
title: Jest Run It - Run and debug individual Jest tests from VS Code
published: true
description: A VS Code plugin for the Jest test framework to run or debug individual tests from VS Code. 
tags: #vscode #productivity #jest #javascript
---

While writing tests in Jest have you ever wanted to run a single test that you changed, but have to fiddle with Jest CLI arguments so that Jest can run only that test. I know, I have been there and it is painful.

Wouldn't it be nice if you could choose what test(s) to run right from your editor/IDE. And apparently IntelliJ family of IDEs had this feature for ages. I get so jealous when I pair with my co-worker who uses IntelliJ and they run/debug a test with the click of a button. My favorite IDE of the world, VS Code, couldn't do it. So I decided to find a solution and it resulted in me writing this VS Code plugin. 

#### Introducing: **Jest Run It 🏃‍♀️🏃‍♂️**
![Jest Run It](https://dev-to-uploads.s3.amazonaws.com/i/2z0bq8x9geeph34is3ao.gif)

#### How to get it?
Search for "Jest run it" in your VS Code extensions panel [(Learn how?)](https://code.visualstudio.com/docs/editor/extension-gallery). You should be able to find it and click on install.

You can find more details about the configuration options details here: https://marketplace.visualstudio.com/items?itemName=vespa-dev-works.jestRunIt

Github link: https://github.com/nithinpeter/jest-run-it

#### Other notable features
Apart from able to run/debug individual tests it has few other tricks under the sleeve as well:

1. Test explorer view
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/kepnu2bxhtiom5ppzafn.png)
2. Editor title actions to run/debug tests
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/gfhftdkwh5zqxnakhx74.png)
Um teste
Published: 2020-02-12 00:39:22

Um testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm testeUm teste
How to determine whether a given string can be rearranged into a palindrome?
Tags: computerscience, algorithms, ruby, rails
Published: 2020-02-12 00:07:19

In this post, we'll create a simple method that checks whether a given string can be rearranged into a palindrome.
but first, let's make sure we know what a palindrome is

according to Wikipedia, A palindrome is a word, number, phrase, or another sequence of characters that reads the same backward as forward.

example: madam, racecar...

a simple method to check if a string is a palindrome using ruby would be

```ruby
 def palindrome_check(str)
 return true if str==str.reverse
 end
```

## constraints

with the previous definition in mind, we can lets create the constraints for our method,
A sting can be rearranged in a palindrome if:

__It contains one or zero single character__: the reason is that if we have one single character it can be in the middle of our string and it won't affect the result

example:

rac__e__car the **e** is in the middle and thus it won't affect our result

__It contains one or zero characters with an odd number of occurrence in the string__: the reason is that the permuting our characters we need to have the same number of characters of both sides left and right and having more than one character with an odd number of occurrences would affect our solution while splitting the string

examples:
A string like **aaabbbb** would be easily permuted to bb__aaa__bb which returns true

but with string like **aaabbbbccc** it would return false because we could not have the occurrence characters on both sides

with our contains being set let's write a simple ruby method that returns "YES" if a given string can be rearranged in a palindrome and  "NO" if it's not the case

```ruby

def palidrome_rearrange_check(str)
    arr=str.split("").uniq
    single=0
    odd=0
    arr.each do |x|
        single +=1 if str.count(x)==1
        odd +=1 if (str.count(x)).odd?
        return "NO" if single > 1
        return "NO" if odd > 1
    end
    return "YES"
end
```

that will be all for our method :-) if you have any question let me know 

in the comments
Show hidden files with a macOS keyboard shortcut
Tags: macos, keyboard, shortcuts
Published: 2020-02-12 09:52:59

---
title: Show hidden files with a macOS keyboard shortcut
published: true
date: 2020-02-12 00:00:00 UTC
tags: macOS, keyboard, shortcuts
canonical_url: 
---

A very very quick one today.

Sometimes when developing on macOS I want to view hidden files in Finder but most of the time it is just extra noise so I like them hidden.

There is a keyboard shortcut to toggle the visibility of these files.

<kbd>cmd</kbd> + <kbd>Shift</kbd> + <kbd>.</kbd>

![cmd+shift+.](https://i.imgur.com/PUXmIjP.jpg)

<small>(thanks to <a href="http://osxdaily.com/2018/02/12/show-hidden-files-mac-keyboard-shortcut/">osx daily</a> for the tip and image.)</small>

This keyboard shortcut will show hidden files or hide them if shown…

Success 🎉
Google authentication with Node.js and Passport.js
Tags: node, sociallogin, oauth
Published: 2020-09-16 05:48:34

---
title: Google authentication with Node.js and Passport.js
published: true
date: 2020-02-12 00:00:00 UTC
tags: NodeJS,SocialLogin,OAuth
canonical_url: https://www.loginradius.com/engineering/blog/google-authentication-with-nodejs-and-passportjs/
---

In this blog, we’ll be implementing authentication via Google in a Node.js web application. For this, we’ll be using Passport.js, an authentication package for Node.js. Before You Get Started This tutorial assumes you have: Basic knowledge of HTML/CSS A good understanding of…

   
[Read On](https://www.loginradius.com/engineering/blog/google-authentication-with-nodejs-and-passportjs/)
Gather, study & learn digitally with Readwise
Tags: learning, productivity
Published: 2020-02-11 23:42:53

Back when books were [exclusively] made of paper, I would consume technical and business books by the backpack load, marking them up with yellow, green and other color highlights. If I really wanted to learn the book, I'd do a second pass, only reading the highlights and highlighting over the first color with another color.

For years I've searched for a simple way to gather my Kindle bookmarks and actually get some value out of them. I missed being able to do something with my highlights. Today, thanks to a chance online encounter with [Ian Jones](https://dev.to/theianjones/roam-research-to-explore-ideas-5cge/comments) over on Dev.to, I learned about an awesome SaaS tool: [Readwise](https://readwise.io/i/bob67).

Readwise makes it easy to gather your Kindle bookmarks. And your bookmarks from Instapaper, iBooks, Pocket and the web. And through a simple hack, you can start actually getting the use out of all those expensive technical PDFs you've bought from developers and designers, like the excellent [Refactoring UI](https://refactoringui.com/book/).

So Readwise gathers all your highlights. Then what?

  * browse the highlights by book or article,
  * see a selection of highlights in a daily email,
  * tag highlights so you can pull together material across source,
  * share with friends/coworkers,
  * browse, review and learn highlights with spaced repetition built-in.

This last feature is a **gamechanger**. Let's say you're trying to absorb how serverless functions work. You have bookmarks scattered all over the place: web pages and [highlights(https://help.getpocket.com/article/1144-highlighting-in-pocket)] in Pocket in Firefox or Chrome, Kindle books like [this one](https://smile.amazon.com/AWS-Lambda-Quick-Start-Guide-ebook/dp/B07F713C6G), pdfs that came in epub format as well or that you [converted over](https://www.zamzar.com/).

With Readwise, you can turn all those highlights into flashcards, and drill on them until you know the material. (*short rant: if you're not spending 25% or more of your worktime learning new things, you'll find yourself out of work in a year or two - been there, done that, it sucked.*)

There are other features in Readwise I'll let you discover/explore [during your free 30-day trial](https://readwise.io/i/bob67), but really, Readwise had me sold the moment I saw my highlights from both Kindle and PDFs available together. A max of $8.99/month.
Why I prefer rem over em
Tags: css, html
Published: 2020-02-11 22:53:12

---
title: Why I prefer rem over em
published: true
description: Quick comparison of CSS length units.
tags: css, html
---

I always prefer to use rem units over em units in CSS.

## Definitions

Rem represents the root element's font-size. The root element for a HTML document is almost always the `html` element.

Em represents the current element's font-size. This value can and does change while CSS rules are being applied.

## Why I prefer rem

There are two main reasons why I prefer rems:

### Rem's value does not change in a CSS rule

Take for example this rule with inherited font-size 18px:

```css
html {
  font-size: 18px;
}
.page {
  font-size: 2em;
  margin: 1em;
}
```

- How many pixels wide is the font-size?
- How many pixels wide is the margin?


They are both 36px wide even those the number of ems are different!

This is because the font-size for the element changed and all properties calculated after that will use this new font-size.

In comparison, the same rule with rems instead:

```css
html {
  font-size: 18px;
}
.page {
  font-size: 2rem;
  margin: 1rem;
}
```

- How many pixels is the font-size?
- How many pixels wide is the margin?

The font-size is 36px and margins are width 18px.

### Rems scale the whole page

If a user sets their browser or personal css file to use a larger base font, it is inherited everywhere!

The browser/personal css is the last file in the cascade (minus anything styled directly on an element).

Don't fight users. They know what font-size works best for their eyes.

## Not breaking the flow

Having a website that can work with this kind of resizing requires using other [CSS length units](https://developer.mozilla.org/en-US/docs/Web/CSS/length) like percentages and viewport height/width (vh & vw). Using these other units will help to keep the rhythm and flow of the page similar at vastly different base font-sizes.

It is important to remember not everyone uses super high resolution monitors or the same resolution as you.
HTTP-based games for Programmers
Tags: challenge, sideprojects
Published: 2020-02-11 22:21:56

_So I've created "organization" for my side-project here at DEV. And it is time for introduction post. I don't like "blank" intro posts, so I'll tell about one of the features at once._

Most of the problems at CodeAbbey are typical - you have input data (e.g. for "Fahrenheit-to-Celsius" calculation), you need to produce and submit some answer. Web-site checks it and if it's ok, you get higher in the ranking table.

But it may become boring sooner or later :)

At some point I've invented "interactive" problems. They are more like 2-player game - **your code** is one player and **web-server** is another. They communicate with simple HTTP requests.

For now there are just 4 problems of such kind ([here is the link](https://www.codeabbey.com/index/task_list/interactive)):

1. **Say 100** - quite trivial, server gives you number, just answer with number adding total to 100. Simply to help figure out the exchange process.

2. **Nim Game** - this game is famous in all math or logic related books. You'll need to find strategy for it.

3. **Maze of the Wumpus** - based on classic (ancient!) console game. You are to find Wumpus in the maze and kill it before it gets on you. Not sure about strategy :)

4. **Connect Four** - well-known game, I believe, this requires you to implement typical Minimax algorithm.

_Well, hopefully it's enough for introduction. And hopefully I'll invent more problems of such kind if you, friends, find them funny. Suggestions are welcome!_
Reliability: ETCD Cluster
Tags: reliability, etcd
Published: 2020-02-11 22:18:38

---
title: Reliability: ETCD Cluster
published: true
description: 
tags: reliability, etcd
---
# ETCD

+ Always benchmark your external etcd cluster using this [tool](https://github.com/etcd-io/etcd/tree/master/tools/benchmark)
+ Give etcd a higher disk [priority](https://github.com/etcd-io/etcd/blob/master/Documentation/tuning.md#disk) if running along other processes.

## Do

+ Take advantage of learners for re-assignement and during upgrade. Checkout upcoming features in [3.5](https://github.com/etcd-io/etcd/blob/master/Documentation/learning/design-learner.md#features-in-v35)
+ Election timeout should be 10x heart beat interval to makeup for network latency issues.
+ You can only do minor upgrade for now.
+ Use SSD for disk as this is the most critical resource in etcd cluster.
+ You can change the default storage limit from 2GB to max of 8GB if using large cluster. [checkout](https://github.com/etcd-io/etcd/blob/master/Documentation/dev-guide/limit.md)

## Dont Do

+ Be careful when adding new node to etcd cluster that cannot tolerate any node failure. This is because if the new node fails, quorum is not achieved and etcd goes into read-mode. You can remove failing node before adding the new one.
+ Do not route request to [learner](https://github.com/etcd-io/etcd/blob/master/Documentation/learning/design-learner.md) especially when using load balancer.
+ You risk cluster stability if you set different heartbeat and election timeout for the members.



## Backup and Recovery

#### Backup

```bash
etcdctl snapshot save backup.db --cacert="/var/lib/minikube/certs/etcd/ca.crt" --cert="/var/lib/minikube/certs/etcd/server.crt" --key="/var/lib/minikube/certs/etcd/server.key" 
{"level":"warn","ts":"2020-02-10T19:00:17.325Z","caller":"clientv3/retry_interceptor.go:116","msg":"retry stream intercept"}
Snapshot saved at backup.db
```

Make sure you do this periodically probably using an automated method thats saves the backup in remote storage like s3.

#### Restore

Remember that a snapshot restore creates a new logical member, making the node forgets its former identity. Hence you need to restore on other nodes and [restart the cluster](https://github.com/etcd-io/etcd/blob/master/Documentation/op-guide/recovery.md#restoring-a-cluster)



## Upgrade and Downgrade

Before you do upgrade or downgrade, master the act of etcd backup and automated recovery unless though wishes to see what Dante was talking about.

#### Upgrade

Replace the cluster members one by one to avoid potential issues with upgrade. If you have any member that is unhealthy, you can remove(provided you are not violating quorum) and add the member back to the cluster.

#### Downgrade

You should probably read this [post](https://gravitational.com/blog/kubernetes-and-offline-etcd-upgrades/) and [this](https://medium.com/@mrawesomenix/tale-of-etcd-upgrade-48c580e26d60) before doing a downgrade.



## Monitoring

Etcd exports metrics at */metrics* endpoint, so you can configure prometheus to ingest data from that endpoint for display in grafana.

## GitOps
How string.includes() works in JavaScript
Tags: javascripttips, node, javascript, frontenddev
Published: 2020-03-13 16:30:19

---
title: How string.includes() works in JavaScript
published: true
date: 2020-02-11 22:01:01 UTC
tags: javascript-tips,nodejs,javascript,front-end-developmen
canonical_url: 
---

[![](https://cdn-images-1.medium.com/max/1920/1*wLWQvfcbfA6UrtH_6Zyp1Q.jpeg)](https://medium.com/@deeksha.sharma25/how-string-includes-works-in-javascript-a258eeb27e24?source=rss-4dc7d01b74e------2)

In this video, we will learn when and how to use includes() method on Strings. This method determines whether or not a string includes…

[Continue reading on Medium »](https://medium.com/@deeksha.sharma25/how-string-includes-works-in-javascript-a258eeb27e24?source=rss-4dc7d01b74e------2)
Social Network Infrastructure - On Premise vs AWS
Tags: aws, devops
Published: 2020-02-11 21:53:01

I put this image together from two screenshots from the video [Introduction to AWS Services](https://youtu.be/Z3SYDTMP3ME) (Jun 9, 2019). May be helpful to those learning the basics of AWS. In the video, the instructor assembles the infrastructure piece-by-piece explaining each role.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/ukg7u9g0j95twhmy6a3f.png)

The table below summarizes each service shown above:
(Ps: AWS has many other services)

| AWS Service                           | Service role                     |
|---------------------------------------|----------------------------------|
| **Route53**                           | DNS Service                      |
| **VPC** (Virtual Private Cloud)       | “Private Network”                |
| **EC2** (Elastic Compute Cloud)       | Virtual Machines                 |
| **EBS** (Elastic Block Storage)       | Disk (attached to the VMs)       |
| **RDS** (Relational Database Service) | Relational Database              |
| **DynamoDB**                          | NoSQL Database                   |
| **ElastiCache**                       | Database Cache Engine            |
| **ELB** (Elastic Load Balancer)       | Load Balancer                    |
| **S3** (Simple Storage Service)       | External Storage                 |
| **Rekognition**                       | Content Filter                   |
| **Lambda**                            | Serverless computation           |
| **Kinesis**                           | Clickstream Analysis Engine      |
| **EMR** (Elastic MapReduce)           | Data Processing Platform         |
| **Glue**                              | Managed ETL Service              |
| **Redshift**                          | Data Warehouse Service           |
| **Athena**                            | SQL Query Interface              |
| **Quicksight**                        | Business Intelligence Tool       |
| **CloudFront** (& Edge Locations)     | Content Delivery Network         |
| **SNS** (Simple Notification Service) | Notification Service (Push, SMS) |
| **SES** (Simple Email Service)        | Email Service                    |
| **SQS** (Simple Queue Service)        | Message Queue Service            |
| **CloudWatch**                        | Monitoring Dashboard             |

Turns out it's not that scary, huh? 😅
Monitor Rails performance in real-time and for free
Tags: rails, ruby, performance
Published: 2020-02-11 21:44:29

---
title: Monitor Rails performance in real-time and for free
published: true
description: 
tags: rails, ruby, performance
---

https://github.com/igorkasyanchuk/rails_performance 

I've created a new gem to monitor the performance of RoR apps.
It's using Redis to store data. All are stored locally and not sent to 3rd party services.

Look forward to hearing your feedback.
Vue/Nuxt Component Card
Tags: help, vue, nuxt
Published: 2020-02-11 21:23:16

Hi,

I've been trying to learn Vue + Nuxt for static site generation. Whilst I can write the following in a way that will render out the correct HTML. I want to get my head around some of the more advanced features.

**Aim:**
Write a repeating card component that allows me to easily change elements within the component.

Here is where I am at…

**Component:**

```
<template>
  <div class="column is-4 has-text-centered">
    <div class="icon_block">
      <img src=":image.src" alt=":image.alt" width=":image.width" height=":image.height" />
    </div>
    <h4>{{ title }}</h4>
    <a href=":link.url" title=":link.title">{{ link.anchor }}</a>
  </div>
</template>

<script>
export default {
  name: "ContactCard",
  data: {
    contacts: [
        {
          id: '',
          image: {
            src: '',
            alt: '',
            width: ,
            height: ,
          },
          title: '',
          link: {
            url: '',
            title: '',
            anchor: ''
          }
    ]
  }
};
</script>
```
**Template:**

```
<template>
  <div class="footer_top">
    <div class="container">
      <div class="columns">
        <ContactCard
          v-for="contact in contacts" :key="id"
          :src="image.src"
          :alt="image.alt"
          :width="image.width"
          :height="image.height"
          :title="title"
          :url="link.url"
          :linkTitle="link.title"
          :anchor="link.anchor"
        >
        </ContactCard>
      </div>
    </div>
  </div>
</template>

<script>
import ContactCard from "~/components/ContactCard.vue";

export default {
  components: {
    ContactCard
  },
  data() function {
    return {
      contacts: [
        {
          id: '1',
          image: {
            src: '~assets/svg/address.svg',
            alt: 'Image Alt',
            width: 17,
            height: 30,
          },
          title: 'Address',
          link: {
            url: 'https://pagetolinkto',
            title: 'Title of link',
            anchor: 'Anchor Text'
          }
        },
      ]
    },
};
</script>
```
Needless to say, this isn't working and hence I was hoping someone might be able point me in the right direction.
Exported names in Go
Tags: go, beginners
Published: 2020-02-11 21:22:52

Many packages have variables (constants). In the <a href="https://golangr.com/">Go</a> programming language, exported <a href="https://golangr.com/variables/">variable</a> names are a bit different.

Before playing around with Go packages and constants, you should be able to <a href="https://golangr.com/hello-world/">run go programs</a>

## Example

For example, if you import the math module you can access some of its variables:

```go
fmt.Println(math.Pi)
fmt.Println(math.E)
```

These variables reside in the math module. When importing a package, you can refer only to its exported names.

Lets try that in a program

```go
package main

import (
	"fmt"
	"math"
)

func main() {
	fmt.Println(math.Pi)
	fmt.Println(math.E)
	fmt.Println(math.Phi)
	fmt.Println(math.SqrtE)
}
```

*If a variable does not start with a capital letter, it is not exported.*

So if you'd try

```go
fmt.Println(math.e)
```

That wouldn't work, because only variables with a capital letter are exported.

## Constants

So how do you know which variables exist in a module?

One way to find out is in the <a href="https://golang.org/pkg/math/">golang package docs</a>. Open the name of the package and search for constants.

You can browse some of the main packages <a href="https://golang.org/pkg/">here</a>