teleren/devto huggingface dataset:
100th Anniversary of the Theremin
Tags: watercooler
Published: 2020-10-22 20:48:38

I'm a pretty big fan of [theremins](https://en.wikipedia.org/wiki/Theremin), so when my newsfeed fed me the news that it's the theremin's 100th anniversary I had to share it with you all.

Here's [the post](http://www.thereminworld.com/Article/17268/moog-music-introduces-claravox-centennial-theremin) that caught my eye. I'm pretty head-over-heels for Moog, who developed a new theremin in celebration of the 100th anniversary, which definitely played a hand in why I'm seeing this news. Speaking of "playing hands", the theremin is the only instrument to be played without touching it. 🙌

So what are your thoughts on theremins? Any favorite theremin tunes? What about a favorite theremin player (thereminist)?
How to use ProxyJump with SSH
Tags: productivity, linux, tutorial
Published: 2020-10-22 20:41:58

Originally posted on [blog.ruanbekker.com](https://blog.ruanbekker.com/?source=dev.to) 

I have a dedicated server with LXD installed where I have a bunch of system containers running to host a lot of my playground services, and to access the operating system of those lxc containers, I need to SSH to the LXD host, then exec or ssh into that LXC container.

This became tedious and wanted a way to directly ssh to them, as they don't have public ip addresses, it's not possible but found its possible to access them using proxyjump.

```
[you] -> [hypervisor] -> [vm on hypervisor]
```

First step is to create our ssh key:

```
$ ssh-keygen -t rsa
```

Add the created public key (`~/.ssh/id_rsa.pub`) on the hypervisor and the target vm's `~/.ssh/authorized_key` files.

Then create the SSH Config on your local workstation (`~/.ssh/config`):

```
Host *
  StrictHostKeyChecking no
  UserKnownHostsFile=/dev/null

Host hypervisor
  Hostname hv.domain.com
  User myuser
  IdentityFile ~/.ssh/id_rsa

Host ctr1
  Hostname 10.37.117.132
  User root
  IdentityFile ~/.ssh/id_rsa
  ProxyJump hypervisor
```

Now accessing our lxc container ctr1, is possible by doing:

```
$ ssh ctr1
Warning: Permanently added 'x,x' (ECDSA) to the list of known hosts.
Warning: Permanently added '10.37.117.132' (ECDSA) to the list of known hosts.
root@ctr1~ $
```

Thank you for reading
Cursos Grátis da Microsoft para Iniciantes de JavaScript & Node.Js!
Tags: javascript, node, beginners, webdev
Published: 2020-10-22 20:32:27

---
title: Cursos Grátis da Microsoft para Iniciantes de JavaScript & Node.Js!
published: true
description: nesse artigo estarei falando sobre dois cursos grátis que a Microsoft recentemente lançou para o público iniciante em JavaScript e Node.js
tags: javascript, node, beginners, webdev
//cover_image: https://direct_url_to_image.jpg
---

Fala Coders! Tudo certo? Hoje eu quero falar com vocês sobre 2 cursos para iniciantes de JavaScript e Node.js que foram lançados esse mês de Outubro pelo meu lindo time de JavaScript/Node.js.

As séries: Beginners Series foi criada com a intenção de ajudar a todas as pessoas que estão querendo ingressar no mundo do JavaScript e Node.js e desejam aprender conceitos básicos para que depois, possam aprender conceitos mais medianos e avançados!

A série de vídeos do Beginner's Series to: JavaScript abordam temas desde, como instalar Node.js na sua máquina, comentários em Js, arrays, functions e muito mais. E o melhor de tudo: com vídeos bem curtinhos e direto ao ponto!

Já a série de vídeos do Beginner's Series to: NodeJs abordam temas relacionados ao curso já criado na plataforma do Microsoft Learn de Node.js com intuito de explicar cada conceito dado no Learn Path!

Até o momento ambos os vídeos dessas séries estão em inglês. Mas, já vou adiantar a vocês que teremos versões em Português e Espanhol dessas séries!

Querem começar a estudar Js e NodeJS com essas séries? Se a sua resposta for um grande sim, então vou deixar aqui para vocês essas recomendações:

📺 **Link dos vídeos: [Beginner's Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript?WT.mc_id=javascript-10270-gllemos)**

[![Captura-de-Tela-2020-10-22-a-s-17-10-25.png](https://i.postimg.cc/2S891rjr/Captura-de-Tela-2020-10-22-a-s-17-10-25.png)](https://postimg.cc/GHVxN0s5)

📺 **Link dos vídeos: [Beginner's Series to: Node.Js](https://channel9.msdn.com/Series/Beginners-Series-to-NodeJS?WT.mc_id=javascript-10270-gllemos)**

[![Captura-de-Tela-2020-10-22-a-s-17-23-02.png](https://i.postimg.cc/5jc1xjW4/Captura-de-Tela-2020-10-22-a-s-17-23-02.png)](https://postimg.cc/Cn497hKX)

📕 **Link - Curso Grátis Node.js: [Criando aplicativos JavaScript com Node.js](https://docs.microsoft.com/learn/paths/build-javascript-applications-nodejs/?WT.mc_id=javascript-10270-gllemos)**

[![Captura-de-Tela-2020-10-22-a-s-17-26-53.png](https://i.postimg.cc/BvtqcrpG/Captura-de-Tela-2020-10-22-a-s-17-26-53.png)](https://postimg.cc/yJ447r2f)

## Palavras Finais

Lembrando que, as séries de vídeos terão a sua versão em Português muito em breve! 

Mas, fiquem à vontade em maratonar esses 3 excelentes cursos que estão excelentes e que podem auxiliar a todas as pessoas que desejam entender conceitos básicos sobre JavaScript e Node.js!

E para ficarem por dentro de várias outras novidades, não deixem de me seguir lá no twitter!

[![Twitter](https://code4coders.files.wordpress.com/2019/05/image-12.png)](https://twitter.com/glaucia_lemos86)

Nos vemos! Até a próxima pessoal! 😍
President Trump’s Twitter accessed by security expert who guessed password "maga2020!"
Tags: news, security
Published: 2020-10-22 20:25:53

This is fairly mind blowing.

### Source: https://techcrunch.com/2020/10/22/dutch-hacker-trump-twitter-account-password/

> The account was not protected by two-factor authentication, granting Gevers access to the president’s account.

It's also pretty remarkable that the account hadn't already been discovered (that we know of).

Wouldn't this be an account subject to constant attack like this? Lots to unpack here.
Hello all! Let me introduce myself..
Tags: womenintech, intro, watercooler
Published: 2020-10-22 20:18:42

I just joined here, and I could tell a few things about myself. So we can get to know each other. If you only read this first chapter, here's a TL;DR: I'm a developer / graphic designer who enjoys constantly learning new stuff. I've been coding mobile, desktop, and web applications during my career. As a graphic designer, I'm specialized in brand identities and logos. You can find my exact skills and frameworks from my profile later because I haven't filled them out yet when writing this. To name a few favorite ones, for desktop and mobile development, I prefer Qt. For web development, ReactJS and NodeJS are my favorites.

#More...
If you read this far, you are likely to get to know what else I do besides programming and graphic design. I spend a lot of time on my computer, but less than I used to, so I think I have got some more healthy habits. What I do besides coding in my free time is 3D graphics with Blender, play Civilization 6 with my friends, or Photoshop things like grungy photo composition art (this might need explaining a bit, but that's for another post). I also love to make demos for the demoscene. Usually, I've done them with Three.js, but the next one is probably going to use Vulkan.

#Basic stuff beyond the monitor
When I'm not sitting beside the computer, I'm probably doing one of these things:
Sleeping (one of my favorites), cooking (that's also a thing I like a lot, not a master chef but slowly learning), or trying to do some exercise. In the last one, I'm not very good, and laziness is my middle name. If there happens to be some extra time in the day besides the things already mentioned, there are a whole plethora of things you can catch me doing.

#Advanced stuff beyond the monitor
First, and the most important thing to mention is Legos. I love Legos. I have half of a room filled with them. I build and collect whole sets and also build imaginary stuff or something from a real-life model or photo. If I still have some free time after building with Legos, I love to play board games or assemble medium size puzzles (something between 1000 and 5000 pieces). Also, I enjoy doing some different kinds of handicrafts (sewing, jewelry making, knitting), play an electric piano, or plan some new interior decoration. There's probably more stuff, but I tend to do hobbies periodically, and sometimes I forget something for a whole year or more and might restart later.
That was basically me in a nutshell. I hope I get to know you folks, too!
Hello DEV Community 👋
Tags: personal, sayhi, hello
Published: 2020-10-22 20:14:35

My name is Kaila and I am a frontend developer. I like to build things that are useful for other people. I hope that by joining DEV Community I can be more productive than before.

Get in touch with me on Twitter, I'm available as [@kailathedev](https://twitter.com/kailathedev)

Thank You 🤗
Successfully completed the 4 PR's
Tags: hacktoberfest, computerscience, android, linux
Published: 2020-10-22 19:49:27

So this was my first time contributing to the open-source community and I completed the 4 PR's. 2 of them have successfully completed the review period also..only 2 more to go. I am feeling very excited. Contributing to open-source was a very great experience. Learned about Git hub also.
How to make a straming application with our media player using nodejs and react js
Published: 2020-10-22 19:46:24



I've been searching for hours everywhere on internet but in vain. I would like to make a streaming application using my react media player and nodejs for streaming audio. I implemented the server side and I can stream audio using pipe, in the client side I recieve the data bytes but I don't know how to link it with my media player. I've searched about Audio in javascript but it seems it's only takes an url.

Can someone clear me.
Scan Images in my GitOps Repo
Tags: showdev, devops, kubernetes, docker
Published: 2020-10-22 20:32:31

---
title: Scan Images in my GitOps Repo
published: true
date: 2020-10-22 19:41:31 UTC
tags: ["showdev", "devops", "kubernetes", "docker"]
canonical_url: https://www.joshkasuboski.com/posts/trivy-gitops-repo-scan/
---

Scanning the container images deployed to my cluster used to be manual. Now it happens automatically every night. 🐱‍🏍

## How to Scan

I use Trivy to scan container images. I wrote about scanning my GitOps repo for images earlier [here](https://www.joshkasuboski.com/posts/scan-images-in-files/). Basically, there's a fancy grep that matches `image: (<name>)` and that name is sent to Trivy.

My GitOps repo is on GitHub at [kasuboski/k8s-gitops](https://github.com/kasuboski/k8s-gitops). It seemed natural to run the scan periodically using GitHub Actions. The scan will happen on every push and every night.

I needed a way to exclude an image that wasn't able to scan on an x86 host. The one liner from my previous post needed a `grep -v` to exclude certain patterns.

## Making the GitHub Actions Workflow

I had a lot of trouble getting `ack` configured in a runner. I ended up making a docker image that downloads trivy, finds the images, and scans them.

This image has its own repo [kasuboski/trivy-scan-dir](https://github.com/kasuboski/trivy-scan-dir). If you just want to scan a repo you can run `docker run -it --rm -v /path/to/yaml:/gitops -e EXCLUDED='no/scan also/noscan' kasuboski/trivy-scan-dir`.

To run this in a workflow, add the below step.

```
- name: Scan Images
uses: docker://kasuboski/trivy-scan-dir:latest
env:
EXCLUDED: 'no/scan also/noscan'

```

My full workflow can be found in [kasuboski/k8s-gitops](https://github.com/kasuboski/k8s-gitops/blob/master/.github/workflows/scan-images.yaml). It triggers on `workflow_dispatch`, `cron`, and `push` to yaml files.

Workflow Dispatch lets you run the workflow manually from the GitHub Actions UI. This was really convenient for testing. The cron schedule runs every morning at 4:03am.

[![manual trigger](https://www.joshkasuboski.com/posts/trivy-gitops-repo-scan/manual-workflow-run.png)](manual-workflow-run.png)

## Results

This workflow has alerted me to multiple vulnerabilities. If the workflow fails, I get an email and then can look into updating the image.

The results even look pretty decent in the GitHub app so I can tell which images I need to be worried about. An example failing run is shown below.

[![failed run](https://www.joshkasuboski.com/posts/trivy-gitops-repo-scan/failed-image-scan.png)](failed-image-scan.png)

I still want to add something in cluster to enforce only the images I want are running. Finding the images to scan also needs to be more robust. For instance, some images only show up once manifests are rendered.
npx make-fullstack-app - Scaffolding your back and frontend
Published: 2020-10-22 19:39:58

## Why?

With my tool, merced-spinup you can scaffold a frontend OR backend project with ease from a wide selection of templates across all the main NodeJS frontend and backend frameworks. Although you still have to run the command twice, and I'm thinking... how can I make this easier.

## enter make-fullstack-app

make-fullstack-app expects you want to build an API on the backend and consume it with a frontend so it generate the backend and frontend template of your choice in appropriately named folders (backend and frontend.)

It is pretty simple to use...

### Express App

#### React Frontend

```js
npx make-fullstack-app express react
```

#### Vue Frkoa
```js
npx make-fullstack-app express vue
```

#### Angular Frontend

```js
npx make-fullstack-app express angular
```

#### Svelte Frontend

```js
npx make-fullstack-app express svelte
```

### Koa App

#### React Frontend

```js
npx make-fullstack-app koa react
```

#### Vue Frontend

```js
npx make-fullstack-app koa vue
```

#### Angular Frontend

```js
npx make-fullstack-app koa angular
```

#### Svelte Frontend

```js
npx make-fullstack-app koa svelte
```

### Fastify App

#### React Frontend

```js
npx make-fullstack-app fastify react
```

#### Vue Frontend

```js
npx make-fullstack-app fastify vue
```

#### Angular Frontend

```js
npx make-fullstack-app fastify angular
```

#### Svelte Frontend

```js
npx make-fullstack-app fastify svelte
```

### Polka App

#### React Frontend

```js
npx make-fullstack-app polka react
```

#### Vue Frontend

```js
npx make-fullstack-app polka vue
```

#### Angular Frontend

```js
npx make-fullstack-app polka angular
```

#### Svelte Frontend

```js
npx make-fullstack-app polka svelte
```

### Merver App

#### React Frontend

```js
npx make-fullstack-app merver react
```

#### Vue Frontend

```js
npx make-fullstack-app merver vue
```

#### Angular Frontend

```js
npx make-fullstack-app merver angular
```

#### Svelte Frontend

```js
npx make-fullstack-app merver svelte
```

## Bottom Line

There are many more combination, just read the docs! Head over to AlexMercedCoder.com to see my gallery of NodeJS Libraries to find the documentation.
Why GoLang wasn't accepted by communities ? 
Tags: go, discuss, webdev, python
Published: 2020-10-22 19:33:31


Benchmark: Go is 40 times faster than Python!

Go has amazing inbuilt support for high throughput as well as greatest level of memory management and inbuilt concurrency model. 

It could've been a greater replacement for python but the fact is, it's not! 


Note: it just a comparison and I extremely dont mean to say python is not good or go is cool!

Let's face the reality. Debate on! 
(Edited: 24th October 2020)

Thanks!
ABAP code on Git and openSource
Tags: hacktoberfest
Published: 2020-10-22 19:29:04

## What I Learned From Hacktoberfest

I have been contributing to Hacktoberfest since 2017 and now I was able to sync a pull a request containing ABAP codes integrated to ABAP system due to the fact that <a href="https://docs.abapgit.org/">abapGit</a> is running very well.

If you have interested in SAP coding info, examples and so on check out this <a href="https://github.com/diogoccosta/sap_abap">ABAP Repository</a>.

{% github diogoccosta/sap_abap %}

Thank you Hacktoberfest team!
Day 98: Slow down for Vue
Tags: 100daysofcode, todayilearned
Published: 2020-10-22 19:28:53

I learnt a valuable lesson today. Stop trying to run before you can walk. That's what I've been trying to do with Vue and I keep getting stuck. I will resort to a smaller project so I can familiarize myself with component communication.Before I think of progressing with the website.

I've spent the better part of the day being frustrated on why a concept that seems so easy in a tutorial is this frustrating. But it's part of the learning process though.🤗

_Day 98_
Latex Curriculum Vitae 0.9.0-beta1 released!
Published: 2020-10-22 19:18:54

After 4 weeks of hard work i'm pleased to announce the first public beta of Latex Curriculum Vitae. This time in .net core, wpf and entity framework core.

What is Latex Curriculum Vitae? It is a little helper for writing job applications. I'm deliver a set of LaTEX documents where you can modify, or just use your already created one.

Inside Latex Curriculum Vitae you just have to type the job application dependend information. Latex Curriculum Vitae builds the LaTEX code, creates PDFs and sends out to the company.

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

Automatically it creates a CSV file, what you can use for printing all of your application details. Also it has a database, where you can manage the current status of your applications.

More information on: [https://saigkill.github.io/latex_curriculum_vitae-dotnet/].

If you are an coder so please read: [https://github.com/saigkill/latex_curriculum_vitae-dotnet/blob/master/CONTRIBUTING.md]. I need currently some help in some cases.

The last Exe can downloaded on [https://github.com/saigkill/latex_curriculum_vitae-dotnet/releases].
Control HTML Video Playback Speed with the Console
Tags: javascript, html, tricks
Published: 2020-10-22 17:45:21

---
title: Control HTML Video Playback Speed with the Console
published: true
description: University video element doesn't have playback speed controls?  No problem!  Pop open a console and do your wizard stuff.
tags:
- javascript
- html
- tricks
---

Quick tip!

My university online class videos don't have a playback speed option.  This is doubly a bummer because the professor talks slowly, and I usually listen to podcasts at 2x speed.  Between that and I don't have time to watch 4 hours of lecture a week at regular 1x speed, I needed a way to speed up the video.  With no playback speed controls built into the UI, I thought I was sunk.

But then I realized: wait a minute!  I know things about computers!  And JavaScript!

I popped open an Inspect window, did some digging into the HTML to make sure I could do what I wanted to do, and then switched over to the Console.  It only took two lines:

```javascript
video = document.querySelector("video")
video.playbackRate = 2
```

And like that, my professor sounded like a chipmunk, and I had 2 extra hours of time to look forward to.  I'm considering putting together a browser plugin to make some of my own video control buttons for the site!
Top 5 DEV Comments from the Past Week
Tags: bestofdev
Published: 2020-10-22 19:12:34

---
title: Top 5 DEV Comments from the Past Week
published: true
description: Highlighting some of the best DEV comments from the past week.
tags: bestofdev
cover_image: https://res.cloudinary.com/practicaldev/image/fetch/s--7VrAA2ln--/c_imagga_scale,f_auto,fl_progressive,h_420,q_auto,w_1000/https://thepracticaldev.s3.amazonaws.com/i/qmb5wkoeywj06pd7p8ku.png
---

This is a weekly roundup of awesome DEV comments that you may have missed.  You are welcome and encouraged to boost posts and comments yourself using the **[#bestofdev](/t/bestofdev)** tag.

---

@nataliedeweerd provided some valuable food for thought in **[How to ask senior devs for help?](https://dev.to/sloan/how-to-ask-senior-devs-for-help-17ji)**:
{% devcomment 1742o %}

@documentednerd helped us determine _why_ **[this salary conundrum](https://dev.to/hrishikesh1990/pay-cut-to-work-remotely-fair-deal-40fo)** is unfair, in their opinion:
{% devcomment 173kb %}

Congrats to @adrianbdesigns for an **[awesome win](https://dev.to/devteam/what-was-your-win-this-week-550b)** this past week:
{% devcomment 16pi7 %}

@cchana shared why mentoring is so crucial in **[What is a Senior Developer *Really*?](https://dev.to/themarcba/what-is-a-senior-developer-really-59dg)**:
{% devcomment 16p74 %}

Ok, I can't resist a weekly win. Congrats on completing your **first ever [#Hacktoberfest](dev.to/t/hacktoberfest), @saoskia!**
{% devcomment 1702b %}

See you next week for more great comments ✌
How the React updates DOM?
Tags: react, javascript, webdev
Published: 2020-10-22 19:09:10

So, how does the react update real DOM i.e. in the browser?

The `render()` method which is being called(in class-based components) doesn't update the content to real DOM and neither the JSX in the return statement of functional components. The name here can be misleading `render` doesn't mean that it should render, but think of it as a suggestion for how the final result will look like. Let's look at two important cases

- There are no changes in some parts of the final web page but the `render` method is being called, which is unnecessary in this case.
- Some props may change but we don't want to show it on our webpage. so `render` will be unnecessary again.

In such cases, we might use `shouldComponentUpdate()` in class-based components or `React.memo` in the function-based component, but what happens when we do not use these, will it rerender every time if there are changes in props which are not used for UI or if the parent component renders it? **NO** It will not.

### And here comes VIRTUAL DOM into the picture

So, when the render is called/suggested it compares virtual DOM's. It will have Old Virtual DOM and re-rendered Virtual DOM. React takes this approach because it's faster. Here re-rendered virtual DOM will be created when the render method is called. 

Once the comparison is made and if any differences are found then React will update the real DOM and note that it doesn't rerender the entire DOM. Suppose, the text on the button is changed then it won't rerender the whole button instead only text is changed. And it doesn't touch is real DOM if there aren't any differences.

![icons which represent virtual DOM's and real DOM with the connection between them](https://dev-to-uploads.s3.amazonaws.com/i/mesyo8sa16btpwvkl0nt.png)

This technique is awesome, isn't it? As you know accessing the real DOM is expensive ([Why is it?](https://stackoverflow.com/questions/6817093/but-whys-the-browser-dom-still-so-slow-after-10-years-of-effort)) and this is something you wanna do as little as possible. As react has this virtual DOM idea the real DOM is touched only if it's necessary.

Hope you enjoyed this post,
Happy learning.

--

### Further reads

{% link https://dev.to/kedark/three-dots-in-js-spread-and-rest-explained-40e %}

{% link https://dev.to/kedark/free-illustrations-resources-for-the-web-make-your-next-project-cooler-525c %}

{% link https://dev.to/kedark/things-to-consider-for-good-typography-on-the-web-22nm %}