teleren/devto huggingface dataset:
Raw stereo audio to mono channel
Tags: javascript, node
Published: 2020-12-27 14:07:19

Lately I've stumbled upon an interesting engineering problem that may be useful to some of you.

I the creator and owner of two Discord bots that utilize speech recognition technology to perform certain actions. There are especially useful for hearing impaired and deaf people, to still communicate with their friends using Discord.

The first bot is just a  framework that transcribes speech to text  and posts it in the channel: https://github.com/healzer/DiscordEarsBot
The second bot is a music player that listens to voice commands to play songs, playlists, pause, skip, shuffle, etc.: https://github.com/healzer/DiscordSpeechBot

The problem I recently faced was due to audio conversion. Each user that speaks in Discord is treated as a separate stream. And this audio stream is raw binary data (signed 16 bit, 48khz, stereo/two-channel) also known as PCM data. But the free Speech-to-Text service that we use only accepts mono (single) channel audio data.

Initially I used the `sox` dependency to convert and manipulate the audio data. But this was a pain in the butt, because many of our users couldn't get sox correctly installed on their machine. Unfortunately I haven't found any other npm or javascript package, so it was time to do it myself.

A quick Google search was needed to understand the raw audio format. In my case we are dealing with signed 16 bit data and two channels. This means that each audio sample consists of 16 bits (= 2 bytes), but also that the first 2 bytes are left audio data, and the following 2 bytes are right audio data.

To convert two channels into a single channel we have to decide how we are going to approach this, because left and right may differ. However a regular microphone input does not distinguish left from right, meaning that left data should be the same as the right data. When you analyze the audio wave form, you will see that left waves are the same as the right waves. This simplifies our life, we can drop either left or right to get a mono audio file.

```JS
// stereo to mono channel
function convert_audio(infile, outfile) {
    try {
        // read stereo audio file into signed 16 array
        const data = new Int16Array(fs.readFileSync(infile))

        // create new array for the mono audio data
        const ndata = new Int16Array(data.length/2)

        // copy left audio data (skip the right part)
        for (let i = 0, j = 0; i < data.length; i+=4) {
            ndata[j++] = data[i]
            ndata[j++] = data[i+1]
        }

        // save the mono audio file
        fs.writeFileSync(outfile, Buffer.from(ndata), 'binary')
    } catch (e) {
        console.log(e)
    }
}
```
Help
Tags: help, watercooler, emergency
Published: 2020-12-27 13:37:21

A website (that's not well documented) has taken my details (a password, and my email).

I've literally looked ALL OVER settings, and there is no delete account option. And, only after I signed up had I realized that is was a tad bit suspicious.

Its main language seems to be Russian, but is poorly translated to English (which may be excusable).
But I don't want them to have my account. I tried asking support, and tried asking the "community chat", which seems more like a bunch of bots (they just ignore me, and talk about random off topic shit).
And I don't want them to have my info, or the validation of my account anymore. Whenever I tried to address the issue with some alt accounts I made with a throwaway email address, I got banned multiple times, just recently, when (what/whom)ever was banning me realized it was no use, I was just ignored.


Any advice.

<div alt="Thanks! Cheers!">
##<b><center><b>Thanks!<br/>Cheers!</b></center></b>
</div>
Daily Developer Jokes - Sunday, Dec 27, 2020
Tags: jokes, dailydeveloperjokes
Published: 2020-12-27 13:00:24

---
title: "Daily Developer Jokes - Sunday, Dec 27, 2020"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
cover_image: "https://private.xtrp.io/projects/DailyDeveloperJokes/thumbnail_generator/?date=Sunday%2C%20Dec%2027%2C%202020"
published: true
tags: #jokes, #dailydeveloperjokes
---

Generated by Daily Developer Jokes, a project by [Fred Adams](https://xtrp.io/) ([@xtrp](https://dev.to/xtrp) on DEV)

___Read about Daily Developer Jokes on [this blog post](https://xtrp.io/blog/2020/01/12/daily-jokes-bot-release/), and check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/).___
### Today's Joke is...
![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e12589f412c5.png)

---
*Have a joke idea for a future post? Email ___[xtrp@xtrp.io](mailto:xtrp@xtrp.io)___ with your suggestions!*

*This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit.*

<!-- 
Joke text:
___Q:___ Why did the angry function exceed the callstack size?

___A:___ It got into an Argument with itself
 -->
Do you create content as a Developer? 👨‍💻
Tags: discuss
Published: 2020-12-27 12:58:31

Hi everyone!

This year I first started to create some content as a Developer. Started a YouTube channel and an Instagram page. It was fun but because I didn't organize things very well I reached burnout in a few months and didn't have the time and power to combine it with work.

I wanted to know if you ever tried to create content, what blockers/problems did you encounter, what tips&tricks do you have...

Personally, for me, I think the biggest problem was that I didn't organize it very well, tried to post more than I had the time, and didn't choose a specific enough niche.

Happy Holidays 🎄
Fun Facts When Learning React...
Tags: webdev, react, beginners, javascript
Published: 2020-12-27 12:44:00

When I first started learning JavaScript I thought Vanilla JS was the coolest thing I ever tried out. I was able to create simple applications that performed more tasks than simply displaying a set of static HTML elements. I found it intriguing to add programming logic to my applications. 

I have been learning React for the past two weeks. At first I thought it would be pretty tough considering that I previously tried getting my way around angular JavaScript. But from the overview I leant that react was not really a framework. React is a library that was created by cool engineers from Facebook. You don't have to learn everything to start working on an application. Each component can be composed of a specific function making it easy to segment the code. 
React components are reusable in different applications. React applications are also optimized in their performance. When making changes to an app in production, you do not have to take down the application to deploy the changes. React uses JSX syntax which is a combination of JavaScript and HTML syntax. It is easy to understand as long as one has a little experience working with HTML. JSX code is easy to debug. 

React is practically rocking the Web Development thanks to the wonderful Facebook Engineers who created this awesome UI library.
Progress: Improved dashboard (with real data) and "no data" placeholders
Tags: dohackathon
Published: 2020-12-27 12:32:49

## Dashboard

The dashboard now pulls data from the database based on the selected time period (week/month/year). I'm using Chartjs for the charts.

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

## "No data" placeholders 

Instead of showing a blank screen on login if there's no data.

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

## Next steps

- Enable search for vehicles, contacts and staff
Merry Christmas QUIZ 2 yall!
Tags: html, css, challenge, algorithms
Published: 2020-12-27 12:20:35

∀ of U widespread-known 9 of 10 ("Ten Little Negroes" by Agatha Christie) sorting algorithms: { Insertion: { linear, binary, shell }, Exchange: { bubble, shake, quick },  Selection: { straight, tree, heap } }. But I want to find the tenth one. Which (kind|type)s of other sorting algorithms do U know? And, BTW, when time`ve come - let IT be the tree @ sorting heap. https://codepen.io/coded_fae/pen/MWjOKya
Construindo um blog usando Nextjs e a API do DEV.to
Tags: nextjs, react, javascript
Published: 2020-12-27 12:14:12

https://youtube.com/playlist?list=PLXtrXUpbDsnExyxnF3J8iLBY8HsZXvv7w

E aí galera beleza? Então, resolvi criar esses vídeos para mostrar um pouco mais do Next.js, como consumir uma api (dev.to) usando SSR e por final fazer o deploy no Vercel.

source: https://github.com/estevanjantsk/next...
vercel: https://nextjsdevto-rhcc1sib4.vercel....

Nesse vídeo mostro um pouco mais do que iremos fazer na série.

📸 https://www.instagram.com/estevanj/

📝 https://twitter.com/estevanjantsk

Espero que gostem da playlist =DD.
Power of the GitHub CLI
Tags: github, opensource
Published: 2020-12-27 12:09:55

I had the pleasure of recently showing off the GitHub Command Line on one of my [live streams](https://twitch.tv/MishManners). With such a simple tool, there are so many things you can accomplish without leaving the terminal.

## All the GitHub tools in the terminal

Have you ever been working in multiple windows, not knowing which tab is open, where your code is, and having to flick between multiple applications?; Code editor, browser, folders, GitHub Desktop, iTunes, you name it. Having GitHub available from the command line means you can program and organise your code from the same window.

{% twitter 1306586113293729795 %}

Want to clone a repo? gh repo clone
Want to open an issue? gh issue open
There are lots of standard commands to make working on code that much easier. You can also do things like view your pull requests and even merge them directly from the terminal. I was able to do things like easily clone one of my repos and start from there. I can even open a new issue in my repo and be presented with the issue templates I had already created. Being able to work like this makes things so much easier.

How do you want to use GitHub in terminal. Let me know in the comments below. Keen to see all the cool ways people are using it.

{% twitter 1311061675160764417 %}

For all the commands, check out the [GitHub CLI documentation](https://cli.github.com/). Oh, and fun fact: the GitHub CLI is open source!

## Watch the CLI in action

If you missed the GitHub CLI in action, you can [rewatch all the fun on Twitch](https://www.twitch.tv/videos/751410803). We also show how you can use it with GitHub Desktop as well. They are such a great combo. How are you using the tools you have at your disposal?
PHP 8 New Features
Tags: php, php8
Published: 2020-12-27 11:45:54

-> Arrays starting with a negative index
-> TypeError on invalid arithmetic/bitwise operators
-> Reclassification of various engine errors
-> Consistent type errors for internal functions
-> Fatal error for incompatible method signatures
-> Locale independent float to string conversion
-> Variable Syntax Tweaks
-> Named Arguments
-> Nullsafe operator
-> Non-capturing catches
-> throw expression

[official Doc](https://wiki.php.net/todo/php80)
The Ultimate Yubikey
Tags: security, privacy
Published: 2020-12-27 10:50:28

Using a 2nd Factor Authentication is already great.

Using it with an app in your phone is great, doing it with a USB stick is even better. 👍🏼
But… With this key … Yubico really reached the top of the line in terms of hardware security. 🛡

With the Yubikey Bio, we have the power of 2nd Factor Authentication, a hardware token and, they add biometrics to all that.

I don’t really see what more could be added. 🤔

Here are my thoughts and my enthusiasm about it.
{% youtube Oy2f4PZ0OBE %}
<figure>
  <figcaption>Video with French Audio & English Subtitles</figcaption>
</figure>

---

Video produced by [Wild & Secure](https://wildnsecure.com), your consulting firm to all things security and real estate.
If you want to receive weekly quality content about security, subscribe to our newsletter [on our website](https://wildnsecure.com/contact).
How to add google analytics to a Next.js website
Tags: react, javascript, webdev, nextjs
Published: 2020-12-27 10:49:54


In this tutorial, you'are going to learn how you can add Google Analytics to your Next.js Website.

A typical Google Analytics JavaScript code looks like this

<br>

```html
<script async src="https://www.googletagmanager.com/gtag/js?id=${YOUR_TRACKING_ID}"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', ${YOUR_TRACKING_ID});
</script>
```

<br>
<br>

Adding this directly inside the `Head` component on your Next project does not work because React converts it to a **string before rendering**, 
which helps prevent [cross-site-scripting](https://en.wikipedia.org/wiki/Cross-site_scripting) attack

<br>
<br>

## The best way to add the google analytics script

<br>

Open your `_document.js` file, use the below code to insert the script into your `_document.js` file.

<br>

```jsx
import Document, { Head, Main, NextScript } from 'next/document';

export default class MyDocument extends Document {
  render() {
    return (
      <html lang="en">
        <Head>
          <script async src="https://www.googletagmanager.com/gtag/js?id=${YOUR_TRACKING_ID}"></script>
          <script
            async
            dangerouslySetInnerHTML={{
              __html: `window.dataLayer = window.dataLayer || [];
              function gtag(){dataLayer.push(arguments);}
              gtag('js', new Date());
            
              gtag('config', ${YOUR_TRACKING_ID});`
            }}
          />
        </Head>
        <body>
          <Main />
          <NextScript />
        </body>
      </html>
    )
  }
}
```

<br>
<br>

Replace the `${YOUR_TRACKING_ID}` variable with your **google analytics tracking ID**

<br>

Now when you reload your website you can **notice** one 'Active Users right now' on your google analytics dashboard.

<br>

![add google analytics to nextjs website](https://i.imgur.com/pZ4WbMe.png)

<br>
<br>
Software Developer Job Description (remote work edition)
Tags: watercooler, job, git, career
Published: 2020-12-27 10:36:49

---
title: Software Developer Job Description (remote work edition)
published: true
description: Software Developer Job Description
tags: watercooler, job, git, career
cover_image: https://images.unsplash.com/photo-1589652717521-10c0d092dea9?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=2100&q=80
---

In no particular order - 
 
1. Write Code
2. Write test cases
3. Automate tests/ manual tasks (Jenkins)
4. Wait for PR checks to finish
5. Read and write e-mails
6. Move tasks from TO DO --> IN PROGRESS --> DONE (Jira)
7. Do code reviews
8. Scrum/ standup meeting
9. Write documentation
10. Ask for promotion/pay raise
11. Ask people to review your PR (Git pull request)
12. Play bug hockey with testing team
13. Write peer reviews
14. Get peer reviewed
15. Ask for feedback
16. Give constructive feedback
17. Learn new things and share them with your team/the world
18. Ask people in your team to teach you something new they have learned.
19. Set clear time when you will be available and when you should only be reached if urgent.
20. Know that no task is small or beneath you.
21. Be grateful
22. Beat imposter syndrome
23. Mentor new people.
24. Ask for help when needed
25. Come up with good reasons to take PTO (paid time-off)
26. Talk about the share price of the company
27. Attend parties, farewells 

Please add anything I missed.
JavaScript - Map, Filter, and Reduce
Tags: javascript, beginners
Published: 2020-12-26 23:25:50

Map, filter, and reduce are three useful functions which can help to simplify your JavaScript code.

Below is a simple data structure which we will reference as we learn about these functions.

```javascript
const people = [
    {
        age: 25,
        name: "Jane"
    },
    {
        age: 30,
        name: "Joe"
    },
    {
        age: 35,
        name: "John"
    }
];
```

Let's say that we just needed a collection of peoples ages; there are numerous ways to do this. The following is a common solution.

```javascript
const ages = [];
for (const person of people) ages.push(person.age);
// [25,30,35]
```

Map allows us to simplify the solution quite a bit.

```javascript
const ages = people.map(person => person.age);
// [25,30,35]
```

Here, we pass a callback to map, and for each element within the collection, we determine what we want to return.

Now, what if we need to create a collection comprised only of people over the age of 30? We could do something like the following.

```javascript
const peopleOverThirty = [];
for (const person of people) {
    if (person.age > 30) peopleOverThirty.push(person);
}
// [{age: 35, name: "John"}]
```

Now, let's see how filter can be used to produce the same result.

```javascript
const peopleOverThirty = people.filter(person => person.age > 30);
// [{age: 35, name: "John"}]
```

Similar to map, we pass filter a callback, here however, rather than *what* we want to return, we determine which elements to return using a conditional statement.

Next, let's get a sum of every person's age. Assuming that we have our ages array from earlier, below would be one way to achieve this.

```javascript
let ageSum = 0;
for (const age of ages) ageSum += age;
// 90
```

Here's the solution using reduce.

```javascript
const ageSum = ages.reduce((acc, age) => acc + age);
// 90
```

As per usual, we pass the function a callback, although we're giving our callback two arguments this time. The first argument is the *accumulator*, which is going to hold the result of each consecutive operation. The second argument is the current element, as with map and filter.

These are small examples of how [map](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map), [filter](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter), and [reduce](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce) can help to keep your code simple.
Cloud infrastructure is not immune from the SolarWinds Orion breach
Tags: solarwinds, aws, cloud, security
Published: 2020-12-27 10:23:56

A great post by one of our Senior Researchers about the Orion breach and how it can affect Cloud Infrastructure security 

https://ermetic.com/whats-new/blog/cloud-infrastructure-is-not-immune-from-the-solarwinds-orion-breach/?utm_campaign=Blogs%20-%20Q2%20-%202020%20&utm_content=150013790&utm_medium=social&utm_source=twitter&hss_channel=tw-1145097208771022848
Changing a html navbar on scroll + Tailwindcss integration
Tags: webdev, css, html, tailwindcss
Published: 2020-12-27 10:17:37

I just came across this simple trick to change a navbar on scroll using pure javascript.
```javascript
 window.onscroll = () => {
  const nav = document.querySelector('#navbar');
  if(this.scrollY <= 10) nav.className = 'normal'; else nav.className = 'scrolled';
};
```
Keep in mind that you have to add all the classes you already have if you want to maintain a look.

## Tailwindcss
This can be especially useful if you are using [Tailwindcss](https://tailwindcss.com)
This is because you can add classes prebuilt from tailwindcss, such as `shadow`, `shadow-2xl`, and `bg-black.` You can check out an example of this on [my site](https://siddharth.one). Notice how the navbar gets a shadow when scrolled.

Thanks for reading. If you liked the article, you can buy me a coffee!

<a href="https://www.buymeacoffee.com/siddharthone"><img src="https://img.buymeacoffee.com/button-api/?text=Buy me a coffee&emoji=&slug=siddharthone&button_colour=FFDD00&font_colour=000000&font_family=Cookie&outline_colour=000000&coffee_colour=ffffff"></a>
TVShows Android App Open Source
Tags: android, java, opensource, productivity
Published: 2020-12-27 09:54:28

Hey there! Are you looking for any open source project to contribute to? Well, I made a TVShows Open-Source so anyone could contribute.
This app shows the name, rating, and a short story of searched TVShow. 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/g326lqklh048meq6w1pv.png)
Don't forget to start this project. **[TVshows Github link](https://github.com/ShoaibKakal/TVshows)**

For watching videos of this project: **[Videos Link](https://www.youtube.com/watch?v=hEcma_uOZ7Y&ab_channel=ChiragKachhadiya)**
Nuget Package Manager GUI For VSCode
Tags: dotnet, vscode, nugetpackagemanager, nuget
Published: 2020-12-27 09:42:03

I've developed an extension for Visual Studio Code that lets you easily update/remove/install packages from Nuget server for .NET Core/.Net5 projects.

## Features

- An easy user interface
- Handles workspaces with multiple `.csproj` or `.fsproj` files
- Update all packages with one click
- Remove a package from the projects
- Search and install new packages from Nuget Server


### How it works
1. Open your project workspace in VSCode
2. Open the Command Palette (Ctrl+Shift+P) 
3. Select **`> Nuget Package Manager GUI`**



![Update a Package](https://dev-to-uploads.s3.amazonaws.com/i/swtlblwgcz4vqhg8shiy.png)



## Settings
### You can override the following settings in the **User or Workspace** `settings.json`:
```js
{
//The maximum duration for completing a request from this extension
"nugetpackagemanagergui.nuget.requestTimeout": 9000,

//The Nuget endpoint address for getting package versions
"nugetpackagemanagergui.nuget.packageVersionsUrl": "https://api.nuget.org/v3-flatcontainer",    

//The Nuget endpoint address for searching packages
"nugetpackagemanagergui.nuget.searchPackage.url": "https://azuresearch-usnc.nuget.org/query",

//true or false determining whether to include pre-release packages in the result of the search
"nugetpackagemanagergui.nuget.searchPackage.preRelease": false,

//The number of packages to return in the search result
"nugetpackagemanagergui.nuget.searchPackage.defaultTak":  10		
}

```

Project Source:
https://github.com/aliasadidev/vscode-npm-gui

Extension Address:
https://marketplace.visualstudio.com/items?itemName=aliasadidev.nugetpackagemanagergui
CSS Newsletter with Animated Floating
Tags: html, animation, css, codepen
Published: 2020-12-27 09:15:53

CSS Newsletter with Animated Floating Input Labels | Move Placeholder Above The input on Focus

Click And Get Free Source Code 

=>  https://codepen.io/Bilal1909/full/KKzjgzR

<img src="https://i.postimg.cc/Wzy5WPG5/screenshot-codepen-io-2020-12-27-14-13-54-765.png">
KDE vs GNOME
Tags: kde, gnome, linux, ubuntu
Published: 2020-12-27 09:14:49

I'm currently using Ubuntu 20.04 with Gnome 3.36 on my laptop.
Specs: i3 7th gen, 4GB DDR4 RAM, 1TB HDD.
I heard many people saying as GNOME is bloated and I'm experiencing some performance issues.
I'm thinking of moving to KDE as it looks great and quite snappy as far I have seen in YouTube.
What are your thoughts? Is it worth shifting? Also which one should I choose between Kubuntu and KDE Neon?