teleren/devto huggingface dataset:
ReferenceError: primordials is not defined
Tags: webdev, npm, javascript
Published: 2019-08-16 03:17:36

---
title: ReferenceError: primordials is not defined
published: true
description: 
tags: webdev, npm, javascript
---

I've started to work on a project that I haven't really touched since 2017. As you can imagine, I'm getting tons of warnings due to all of my node packages being outdated. 

When trying to run `npm install` or `npm update` this is one of the errors I was getting. 


```
const { Math, Object } = primordials;
                         ^

ReferenceError: primordials is not defined
```
What does this even mean?? 

After some google searching, I saw that a lot of people were getting this error because they were running a version of Gulp that was incompatible with their current node version. 

"Okay... cool. But I don't have Gulp installed! :< " 
-me 

I spent about 45mins-1hr trying to get rid of this error, but the thing that did it was removing `sequelize-cli` from my list of dependencies. 

How did I realize that `sequelize-cli` was the source of the problem? 

I deleted my `node_modules` folder and ran `npm install` because I had no idea what to do next and was trying anything I could think of. 

```
Brittanys-MacBook-Pro-4:Gabble_Forum britthome$ npm install
npm WARN deprecated gulp-util@3.0.8: gulp-util is deprecated - replace it, following the guidelines at https://medium.com/gulpjs/gulp-util-ca3b1f9f9ac5
npm WARN deprecated minimatch@2.0.10: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated natives@1.1.6: This module relies on Node.js's internals and will break at some point. Do not use it, and update to graceful-fs@4.x.
npm WARN deprecated minimatch@0.2.14: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated graceful-fs@1.2.3: please upgrade to graceful-fs 4 for compatibility with current and future versions of Node.js
```

AND WHAM-O! Look at that. `gulp-util` you sneaky devil. I was really confused and searched my entire directory for that dependency but couldn't find it. That's when I got the idea that one of my listed dependencies must depend on Gulp. 

I went to the npm website and searched for all of my dependencies one by one. On each package's page, you can see what packages it depends on. `sequelize-cli` was of course, my last listed package, but when I finally got to it, I saw that it does depend on Gulp. 

So, what's next? 

Because I created this project so long ago, I don't remember the necessity of each dependency, so I'm in the process of learning about each one and deciding if I really need it or not. Because I'm using `sequelize`, I imagine that I'll need some sort of CLI, but maybe there is a native CLI with the package or another package I can use? Maybe I won't even use `sequelize`. SO MANY DECISIONS! 

Just wanted to share this little experience. Hopefully, it helps someone.
How to build an AI Platform
Tags: aiplatfom, machinelearning
Published: 2019-08-16 05:56:59

https://medium.com/@unbug/how-to-build-an-ai-platform-2493d57c9e8
[![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/9hauhj77r1min8912zlf.png)](https://medium.com/@unbug/how-to-build-an-ai-platform-2493d57c9e8)
Share your wins
Tags: discuss
Published: 2019-08-16 04:39:03

---
title: Share your wins
published: true
description: Motivating ourself by sharing our wins
tags: discuss
---

Let’s motivate ourselves by sharing some of our wins!

I’ll start first. In 2019 I:
- wrote around 50 blog posts (on my [blog](https://florin-pop.com)
- had over 300k views on my articles
- grew my [Patreon](https://patreon.com/florinpop17) to 10+ people - and still growing!
- went live on [Twitch](https://twitch.com/florinpop17) a couple of times
- had 1-on-1 Zoom meetings with 19 other devs (amazing people!)

You can find some more on my [timeline](https://florin-pop.com/timeline).

What are the things you did that you are proud of? 😃
Part-1: Spring & Gradle - Multi Module Project
Tags: java, spring
Published: 2019-08-16 00:23:13

Overview:

In this article, we’ll implement a spring boot multi module application. We’ll use gradle build system. The goal is here to create a microservices application which will be covered in the upcoming articles.

Layout:

Here we are going to use flat layout to keep the application directories as siblings of the root project directory (Pic-1). The advantage of flat layout is we can have the distinct git repository for every application. In your root project’s settings.gradle file, we need to use the includeFlat with the subproject.

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/0bw7f9rk9tox61s848cd.png)
Pic-1. Directory Structure

Project: root

This project having only the project configuration files such as build.gradle and settings.gradle.


settings.gradle:

    rootProject.name = 'root'

    includeFlat 'utilities', 'exception-handler’, 'discovery-server'
    includeFlat 'enquiry', 'api-gateway', 'registration'

build.gradle:

    buildscript {

     ext {
      springBootVersion = '2.1.6.RELEASE' 
     }

    repositories {
     mavenCentral()
    }

    dependencies {
     classpath("org.springframework.boot:spring-boot-gradle- plugin:${springBootVersion}")
     }
    }

    subprojects {

     apply plugin: 'java'
     apply plugin: 'org.springframework.boot'
     apply plugin: 'io.spring.dependency-management'

     group = 'com.apandiyan'
     version = '0.0.1'
     sourceCompatibility = '1.8'
     repositories {
      mavenCentral()
     }

     ext {
      set('springCloudVersion', "Greenwich.SR1")
     }

     dependencies {
      implementation 'org.springframework.boot:spring-boot-starter-web'
      testImplementation 'org.springframework.boot:spring-boot-starter-test'
     }

     dependencyManagement {
      imports {
       mavenBom "org.springframework.cloud:spring-cloud- dependencies:${springCloudVersion}"
      }
     }
    }



Source: https://github.com/pandiyan90/microservice-blog/tree/master/root
A handy selenium selector syntax in different languages 
Tags: testing, selenium
Published: 2019-08-16 00:18:52

**Java**:
driver.get('http://google.com')
*ID*      - driver.findElement(By.id("ui-div"));
*CSS*     - driver.findElement(By.cssSelector("text-t"));
*Xpath*   - driver.findElement(By.xpath("//div[@id='ui-div']"));
*Name*    - driver.findElement(By.name("element name"));
*Link*    - driver.findElement(By.link("link"))
*TagName* - driver.findElement(By.tagName("tag name"))

**Python**:
driver.get('http://google.com')
*ID*      - driver.find_element_by_id("idname")
*CSS*     - driver.find_element_by_css_selector('body > div > button')
*Xpath*   - driver.find_element_by_xpath('body/name')
*Name*    - driver.find_element_by_name('username')

**JavaScript**:
driver.get('http://google.com')
*ID*      - driver.findElement(webdriver.By.id("password"));
*CSS*     - driver.findElement(webdriver.By.css('body > div > div));
*Xpath*   - driver.findElement(webdriver.By.xpath('body/name'));
*Name*    - driver.findElement(webdriver.By.name('q'));

**c#**
driver.Navigate().GoToUrl("http://www.google.com");
*ID*      - driver.FindElementById("droppable");
*CSS*     - driver.FindElementByXPath("//[@id=\"droppable\"]/p")
*Xpath*   - driver.FindElementByCssSelector("div.form-actions > button")
*Name*    - driver.FindElementByName("password")
Debugging the Karmabug
Tags: debugging
Published: 2019-08-16 00:12:47

*Debugging like you just tumbled down Fate's Wheel of Fortune (Image by [Cayambe - Own work, CC BY-SA 3.0](https://commons.wikimedia.org/w/index.php?curid=8860206))*

For reasons I will not go through right now, I needed a new library for making synchronous HTTP requests in Node.js. I know what you are saying, "But that's one of the seven deadly sins of JavaScript!" ^1 Well, just know I had my reasons, and I wanted to replace `sync-request`.

Since I was already using the Fetch API with `node-fetch` in the async part of my library, I thought: why not build a `sync-fetch`, using `node-fetch` under the hood like `sync-request` uses `(then-)request`. Two days later, it was actually working, as far as I could tell. However, if I wanted to publish this horror I need some actual testing.

Luckily `node-fetch` has a nice test suite, I only needed to convert **194** test cases to use the synchronous API. Not fun work, but worth its while, maybe. Anyway, the first test cases worked, but then it got stuck on the first actual request.

This is were I have to introduce you to the Karmabug. You see, after some testing I figured out that *only* the combination of *my* `sync-fetch` and the test server just... stopped. The arguments were correct, my `fetch` works with `https://example.org` and the test server works with `node-fetch`, but this combination simply did not. Investigating either pointed to the other, and I had no idea what to do next.

That would make a good tweet, I thought. ["Karma for making sync HTTP requests I guess."](https://twitter.com/larswillighagen/status/1162143220039671809) Literally two minutes later it hit me: that was *exactly* what was going on. The test server could not respond to the requests because the request *itself* was blocking the event loop.

^1 Incidentally, the seven deadly sins of JavaScript all happen to be Sloth.
:hover Vs :focus
Tags: css, pseudoselector
Published: 2019-08-20 14:24:36

---
title: :hover Vs :focus
published: true
tags: css, pseudoselector,
canonical_url: https://stephencharlesweiss.com//2019-08-16/hover-vs-focus-pseudoselectors/
---

Most of the time, these two pseudo-selectors act in concert. In fact, they’re so frequently triggered together that my naive testing approach couldn’t differentiate them this morning.

So what’s the difference? From the W3 spec:

> - The **:hover** pseudo-class applies while the user designates an element with a pointing device, but does not necessarily activate it. For example, a visual user agent could apply this pseudo-class when the cursor (mouse pointer) hovers over a box generated by the element. User agents that do not support [interactive media](https://www.w3.org/TR/CSS21/media.html#interactive-media-group) do not have to support this pseudo-class. Some conforming user agents that support [interactive media](https://www.w3.org/TR/CSS21/media.html#interactive-media-group) may not be able to support this pseudo-class (e.g., a pen device that does not detect hovering).  
> - The **:active** pseudo-class applies while an element is being activated by the user. For example, between the times the user presses the mouse button and releases it. On systems with more than one mouse button, [:active](https://www.w3.org/TR/selectors-3/#sel-active) applies only to the primary or primary activation button (typically the “left” mouse button), and any aliases thereof.  
> - The **:focus** pseudo-class applies while an element has the focus (accepts keyboard or mouse events, or other forms of input).

Hover requires a pointer device _without_ activating while focus can be achieved with keyboard events.

A few examples helped clarify situations where these two states can diverge:

1. A form element which a user selects, and then moves the mouse elsewhere. In that case, focus is true while hover is false.
2. A keyboard user tabbing through a page can make elements active without hovering.

An interesting aside from the spec:

> **Note:** If the ‘ [:hover](https://www.w3.org/TR/selectors-3/#sel-hover) ’ state applies to an element because its child is designated by a pointing device, then it’s possible for ‘ [:hover](https://www.w3.org/TR/selectors-3/#sel-hover) ’ to apply to an element that is not underneath the pointing device.

# <svg aria-hidden="true" focusable="false" height="16" version="1.1" viewbox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg>Footnotes

- <sup>1</sup> [Selectors Level 3 | W3](https://www.w3.org/TR/selectors-3/#useraction-pseudos)
Setting up the Azure Credentials File
Tags: azure, devops
Published: 2019-08-16 00:00:00

---
title: Setting up the Azure Credentials File
date: "2019-08-16"
description: Configure an Azure Credentials File with service principal settings.
published: true
tags: 
- azure
- devops
---

I realized as I was reviewing a post I wrote about setting up [Test Kitchen](https://dev.to/azure/building-infrastructure-with-test-kitchen-and-chef-5g99) that there were some gotchas between the parameters that are returned between the service principal creation output and the credentials file. In this post, I provide the mapping between those parameters.

When setting up a [service principal](https://dev.to/azure/you-gotta-keep-privileges-separated-509) to use with scripts or tools to automate your Azure infrastructure, you may set up a credentials file. The Azure credentials file _~/.azure/credentials_ contain a few parameters. You obtain these parameters when you create the service principal. 

The [output of _create-for-rbac_](https://dev.to/azure/you-gotta-keep-privileges-separated-509) looks like:

```
{
  "appId": "00000000-1111-0000-0000-000000000000",
  "displayName": "SigjeServiceDemoPrincipal",
  "name": "http://SigjeServiceDemoPrincipal",
  "password": "df111111-0000-0000-0000-100000000000",
  "tenant": "11111111-0000-0000-0000-000000000000"
}
```

The configuration for the Azure credential file looks like this:

```
[00000000-0000-0000-0000-100000000000]
client_id=00000000-1111-0000-0000-000000000000
secret=df111111-0000-0000-0000-100000000000
tenant=11111111-0000-0000-0000-000000000000
```

The mapping from the output received from the creation of the service principal to the creation of the credentials file:

* *appId* maps to *client_id* and is the specific identifier of the service principal.

* *password* maps to *secret* and is the credential for the service principal.


* *tenant* is the same in both and is the specific identifier of the Active Directory instance in which you created this service principal. 

* The final required configuration parameter is the *subscription ID*. The subscription ID is the identifier that uniquely identifies the subscription to create and manage any resources and services with this credential. That's what is enclosed in the brackets within the configuration.

Now you should be able to set up your Azure credential file. If you didn't keep track of the password when you created the service principal, [reset the credentials for the service principal](https://docs.microsoft.com/en-us/cli/azure/create-an-azure-service-principal-azure-cli?WT.mc_id=devto-blog-jedavis&view=azure-cli-latest#reset-credentials).

For more quick real-world scenarios on Azure, check out the [Azure Tips and Tricks site](https://microsoft.github.io/AzureTipsAndTricks/).
Took me 2.5 hours how to speed up this page
Tags: html, css, seo
Published: 2019-08-15 23:48:22

---
title: Took me 2.5 hours how to speed up this page
published: true
description: Here's a quick way to improve your PageSpeed score
tags: html, css, seo
---

Whelp. I spent 2.5 hours trying to optimize images and improve my PageSpeed Insights score...

Only to find that it was a live chat widget was bringing us down to a 76. 🤦‍♂️

Once I removed it, our PageSpeed score shot up to a 98. 🙄

## Video
{% youtube RcYyA9jiJIU %}

Google says page speed is important for search rankings. We'll see if this works!
[Video] Enabling Web Developers to Build the Future of the Web
Tags: video, standards, opensource, cascadiajs2018
Published: 2019-08-15 23:46:46

---
title: [Video] Enabling Web Developers to Build the Future of the Web
published: true
description:
tags: video, standards, opensource, cascadiajs2018
---
*As we lead up to [CascadiaJS 2019](https://2019.cascadiajs.com), I'm going to share the 24 amazing talks from 2018 here on dev.to. Sit back and enjoy the show!*

# Yehuda Katz
![Yehuda Katz](https://2018.cascadiajs.com/speakers/yehuda.jpg)

[Watch the talk on YouTube (30:15)](https://www.youtube.com/watch?v=3bStv_QbFlo)
How to interview a dev candidate?
Tags: help, career, webdev, discuss
Published: 2019-08-15 23:39:19

Soon I will have to fill a couple full stack developer positions. I’ve done a couple interviews before, but I figured I would reach out to the Dev community to see if there are any suggestions for finding the best candidate.

So what are your best tips for interviewing dev candidates?

The candidates I’ll be interviewing probably won’t have much experience. I want someone who’s good at learning and solving unique problems, because every day is different here.  When I say “Full Stack” I mean they’ll be working on everything from web dev to CLI tools to complex data processing. We don’t need someone who has x years of experience with some particular framework or language, just someone who’s bright and passionate.

> Edit: 2019-08-17 added some details about what we’re looking for.
Gitlab 'hacks'
Tags: git, productivity, jokes
Published: 2019-08-15 23:36:53

Ever wanted to look 'productive' on Gitlab? Paste this into your console. What are your favourite git related hacks? 😜

```javascript
colors = [`rgb(172, 213, 242)`,
`rgb(127, 168, 201)`,
`rgb(82, 123, 160)`,
`rgb(37, 78, 119)`]

$(".user-contrib-cell").each(function(){ $(this).attr("fill", colors[Math.floor(Math.random()*colors.length)])})

```
See image below for results!


![Graph of pixels representing coding activity on Gitlab homepage, with varying shades of blue. The darker, the more productive.](https://thepracticaldev.s3.amazonaws.com/i/5fd4es13h7obh7om95qz.png)

Why choose a platform when you can have both? 💩

![Github productivity chart, however with Gitlab and Github mishmash of blue and green tiles](https://thepracticaldev.s3.amazonaws.com/i/6202gcvbx1ok769wa6vr.png)

Thanks to [lukeshiru](https://dev.to/lukeshiru) for their vanilla javascript solutions + GitHub script!

{%  devcomment e7dd %}
How to move items in terraform state without force replacement
Tags: terraform, aws, devops
Published: 2019-08-15 23:33:39

I have started working on terraform very recently, One of the biggest annoying factors was when you have to change the terraform state without a forced replacement of the resource.

Terraform remembers a state which is nothing but how the infrastructure looks in the remote real world and in the local configuration. 
So when you change a few attributes in the resource like name of the resource, instances, modules which are already created, in the plan it specifies that as not an in-place change

Thankfully there is a command that my colleague has mentioned is "mv"

This command is nothing but like a Linux mv command.

You need to specify source and destination:

**terraform state mv  aws_subnet.main aws_subnet-us-west-2c**

This will move the existing terraform state to an updated terraform state and when you run a terraform plan, you should not see any infrastructure changes if done correctly.

For more information, you can refer: https://www.terraform.io/docs/commands/state/mv.html
Docker 101 @ Women Who Code Buenos Aires [VIDEO]
Tags: docker, espanol, workshop, womanwhocode
Published: 2019-08-15 22:51:28

## Docker 101 

El sábado 20 de julio realizamos nuestro primer workshop técnico en las oficinas de [Tiendanube](https://www.tiendanube.com/).

La temática fue Docker 101 y el contenido estuvo a cargo de [Juani Gallo](https://www.linkedin.com/in/juangallo/) y [Damian Catanzaro](https://www.linkedin.com/in/damiancatanzaro/) co-fundadores de [CourseIT](https://courseit.com.ar).
  
A continuación les dejamos una grabación de la parte teórica para quienes no pudieron asistir o se quedaron con ganas de repasar conceptos.

{% youtube U1I9mi6kLxA %}

Sumamos también las slides que se usaron para la presentación

{% slideshare I0mqpb6qtlZ5P1 %}
Reckoner
Tags: python, kubernetes, helm, pyinstaller
Published: 2019-08-15 22:47:45

Recently I've been working on shoring up some of the user-experience and functionality of [Reckoner](https://github.com/FairwindsOps/reckoner/releases), an open source tool that works in conjunction with [helm](https://helm.sh) to enable repeatable, declarative of helm charts onto kubernetes clusters. It also supports pointing to git repositories as a chart source, something which helm alone currently doesn't support.

A common use case is when you want to install `nginx-ingress` on a cluster and you want to be able to check all your chart values into source control. Below is an example of a `course.yml`, the definition file that reckoner uses to install charts.

```yaml
# course.yml
charts:
  nginx-ingress:
    namespace: ingress-controllers
    version: 1.15.1
    values:
      controller.ingressClass: "my-ingress-class-name"
```

Running reckoner with a `reckoner plot course.yml` will make sure helm installs `nginx-ingress` in your clusters with the settings you've provided.

At [Fairwinds](https://www.fairwinds.com/) we use reckoner to install core infrastructure to all our clusters and manage chart values for things related to that core infrastructure.

Since reckoner was started in python, we decided it would be too much work to port it to another language just for easier binary distribution. Luckily, [PyInstaller](https://www.pyinstaller.org/) allowed us to "compile" a self-contained binary that could be run on Linux or OS X systems. This made our lives so much easier for the installation story and has also helped with our end to end testing, which we now do in [CircleCI](circleci.com) with [kind](https://github.com/kubernetes-sigs/kind).

If you do try out reckoner and something is lacking, always feel free to reach out via dev.to or start a discussion in github issues! We've made changes to help people run reckoner in CI/CD and are always interested in how it can make people's lives just a tad easier. Thanks!
What questions would you ask, if you’re doing the interviewing?
Tags: discuss
Published: 2019-08-15 22:18:19

---
title: What questions would you ask, if you’re doing the interviewing?
published: true
description: 
tags: discuss
---

I’ve seen a lot of articles around how to prepare as the candidate, but what about if you had the chance to be on the other side? What would you ask?
American Kingpin: A Software Crime Thriller
Tags: books, security, darkweb
Published: 2019-08-15 21:49:04

I just got done reading [American Kingpin: The Epic Hunt for the Criminal Mastermind Behind the Silk Road](https://www.amazon.com/American-Kingpin-Criminal-Mastermind-Behind/dp/1591848148) and I can't recommend it enough as a purely entertaining book that is very much on-topic for a dev site.

It's a book about the rise and fall of the Silk Road and its founder Ross Ulbricht.

From the PHP technical debt that first forced Ulbricht seek outside help, to the computer forensics, to the Stack Overflow question that traced back to Ulbricht as evidence—the book was a code thriller.

This was the Stack Overflow question mentioned in the book, if you're curious:

{% stackoverflow 15445285 %}

_It was surprisingly pivotal in the investigation._

American Kingpin read as a narrative arc worthy of the true crime drama it was, and it was a page turner the whole time.

Between this book and [Bad Blood: Secrets and Lies in a Silicon Valley Startup](https://www.amazon.com/Bad-Blood-Secrets-Silicon-Startup/dp/152473165X), I've very much enjoyed reading about these tech startup criminals.
The growth stages of a programmer
Tags: programmer, developer, engineer
Published: 2019-08-15 21:22:04

---
title: The growth stages of a programmer
published: true
description: 
tags: programmer, developer, engineer
cover_image: https://i.imgur.com/rdnta3S.png
---



▫️ I don't know what I'm doing...
▫️ Let me copy this code block from the Internet
▫️ Hey, if it works, it works!
▫️ It's working, but it needs to follow the best practices and design patterns.
▫️ Let's refactor it!
▫️ I don't know what I'm doing...
▫️ Aha!