teleren/devto huggingface dataset:
Filtering an array on ES6
Tags: javascript, webdev, beginners, es6
Published: 2018-05-08 20:33:49

---
title: Filtering an array on ES6
published: true
description: A gentle explanation about how to filter arrays with ES6
tags: #javascript #webdev #beginners #es6
---

It’s been a while since ES6 was released, and now in 2017. Most of it’s features are widely supported on modern browsers.

Since most of you are already familiar (or not) with filtering arrays. Here is a refresher of how to filter arrays with arrow functions.

Disclaimer: I’m assuming a good level of familiarity with ES6. If you need it, here is an awesome post about arrow functions . This is a question I had a few months ago and I decided to make a post about the answer.

Given the following array of objects(aka collection)
```javascript

let shoes = [{"brand":"Converse", "color": "blue" },
              {"brand":"Nike",     "color": "white" },
              {"brand":"Adidas",   "color": "red" },
              {"brand":"Puma",    "color": "black" }];
```

This array containing each pair of shoes you own, their brand and color. It is a rainy day, and you want a pair of shoes that can get the job done with out getting too dirty.

That’s why out of your collection of shoes, you only want to get the black ones.

In order to accomplish that, we are using filter(). This a method that creates a new array with all elements that pass the test implemented by the provided function.

How does this look like in code? Glad you ask. Here is the answer.

```javascript
shoes.filter(shoe => shoe.color === "black");
```

What we have inside the filter() method, is a function where:

`shoe` is the current element being processed in the array.

`shoe.color === “black”` is the condition we want to evaluate.

Finally, here is all the code in one block for you to copy and paste in your console.

```javascript
let shoes = [{"brand":"Converse", "color": "blue" },
              {"brand":"Nike",     "color": "white" },
              {"brand":"Adidas",   "color": "red" },
              {"brand":"Puma",    "color": "black" }];
shoes.filter(shoe => shoe.color === "black");
```

That’s all folks, thanks for reading.
De-throning the List: Summary
Tags: elm
Published: 2018-05-08 22:37:31

---
title: De-throning the List: Summary
published: true
description: What is it all about
tags: elm
---

I've written a total of five posts (or six, including this one) about why I would like to replace the `List` with `Array`. If you'd missed one, here they all are:

* [Introduction - the grand plan](https://dev.to/skinney/de-throning-the-list-2fjk)
* [Part Deux - Improving the `Array`](https://dev.to/skinney/de-throning-the-list-part-deux-4idm)
* [Part π - stoppable fold operations](https://dev.to/skinney/de-throning-the-list-part--44dl)
* [Part SC4K - API changes](https://dev.to/skinney/de-throning-the-list-part-sc4k-4e3n)
* [Part Boron - literal representation](https://dev.to/skinney/de-throning-the-list-part-boron-185)

These posts lists a ton of work. First we need to alter the `Array` implementation to improve performance in even more cases. Then we need to make it more extensible by introducing stoppable fold operations. Then we need to add functions that currently exists for `List`, but not for `Array`. Finally, we can make the Elm compiler output a literal representation of `Array` directly in the javascript code.

But why do all this work? Because I honestly believe Elm becomes easier to learn if the default collection type not only works similarly to the default collection type in other languages, but also provides decent performance for most cases you wish to use it with. I also believe Elm will become faster in the general case, if `Array` is used in all the places `List` is used today.

I might not be right. But I do think it will be an undertaking worth taking. Or... Uh... You know what I mean.

The next and first step of this journey will be to upgrade the `Array` implementation from being a HAMT to an RRB-Tree. This process will probably take a while, but expect a new blog post with benchmark results when it happens.

Thank you for reading!
Level up your Lisp blogging
Tags: lisp, tips
Published: 2018-05-08 22:03:11

---
title: Level up your Lisp blogging
published: true
description: 
tags: #lisp #tips
---

KLIPSE is a simple client-side code evaluator enabling the viewer to edit and execute code snippets directly on the page. How cool is that?!

http://blog.klipse.tech/lisp/2018/05/07/blog-common-lisp.html

Other than Common Lisp, available languages include the _other_ more _common_ Ruby, Python, and JavaScript.
Pusher Contest idea: 🚁Garbage Drones♻️
Tags: pushercontest
Published: 2018-05-08 21:15:21

---
title: Pusher Contest idea: 🚁Garbage Drones♻️
published: true
description: Multiplayer game - race to pick up garbage
tags: pushercontest
---

# The year is 2020

Jeff Bezos acquires Los Angeles County waste management. All garbage trucks are replaced by drones, which are piloted by Amazon Mechanical Turks. You, a Turker, race against others to pick up the county's garbage.

# 🕹Game design

It's 5am LA time. You and your competitors start up your drones and fly across the city to pick up garbage. At the end of the day, whoever picked up the most garbage wins.

 - Each game is a series of 2-3 minute rounds, representing a full day.
 - Players navigate using their arrow keys.
 - A scoreboard displays how much garbage each player has picked up.

## Base Game

Users visit the website and can opt to:
  - join an existing game. Games have a max number of players. When you join a game, you enter your username and pick an emoji avatar. (No persistent login at this point). Games have a max number of players. When you join an active game, you are an observer until the next round begins.
  - observe a game: A game can have any number of observers
  - start a new game

**Play**:
  - At the beginning of each round, you see the pickup points on the map and have a limited amount of time to select your starting point. You can change this until the game starts.

**Chat**:
  - Observers and players can send "chat" messages that appear for a few seconds on everybody's GUI. Perhaps active players' chats appear as bubbles above their avatars.

## Stretch Features

A lot of this is probably out of scope for the length of the contest, but would be fun to have:

**Garbage types**: Waste, Recycling, and Green garbage. When you start a new round, you pick a drone with different capabilities. Example:
  - Single-type drones can only pick up one kind of garbage, but they are the fastest.
  - All-purpose drones can pick up anything, but are slower.

**Dropoff points**:
  - Drones have different pickup capacities. When they are full, they can't pick up any more garbage. Various dropoff points are located around the city, and must be dropped off before the player gets the 'points' for these pickups. Garbage that hasn't been dropped off at the end of the day doesn't count.

**Map View**:
 - In the base game, the view of the map will be static. But, having a larger map would make play more interesting. There would be a minimap that showed your location and all pickup points, but you wouldn't know where your competitors were until they were in your view.

## Stack

Frontend in React, using the Google Maps API for the base map.
Served with Zeit Now.
Client communication with, of course, Pusher
Backend: TBD!
Do online video streaming sites use TCP or UDP
Tags: discuss, question, networkprotocols
Published: 2018-05-08 20:43:19

---
title: Do online video streaming sites use TCP or UDP
published: true
description: 
tags: discuss, question, network protocols
---

This question arose from an annoyance while watching twitch streams. I often participate in streams where the streamer is playing a [jackbox game](https://jackboxgames.com/). It's quite important to see what's going on on the streamer's screen. My internet connection is quite slow, and so Twitch often buffers. When it resumes, it resumes from the point where it let off.

When TCP Vs. UDP is discussed, the canonical use case for UDP is often teleconferencing, where you don't care if you miss a frame of video, you just want it to be quick. Live video streaming online seems not much different rom that, yet Twitch's video player seems to behave as if it's going over TCP, waiting until it has received enough data to show the next few seconds of video.

So is this what's going on?
Google I/O Announcements
Tags: discuss, googleio
Published: 2018-05-08 20:31:55

---
title: Google I/O Announcements
published: true
description: 
tags: discuss, googleio
---

Google has made a few announcements at [Google I/O](https://events.google.com/io/)

[Google's Chrome OS gets new app muscle with built-in Linux](https://www.cnet.com/news/googles-chrome-os-and-chromebooks-get-new-app-muscle-with-built-in-linux/)

And some new updates to AMP. I haven't followed it all super closely. Anyone who feels like unpacking any of this and providing opinions is super welcome to!

{% youtube GAkkKjds00o %}
Who'd be interested in a kind of open CS lecture stream, and what would you like to have covered?
Tags: discuss
Published: 2018-05-08 19:56:57

---
title: Who'd be interested in a kind of open CS lecture stream, and what would you like to have covered?
published: true
tags: discuss
---

I'm thinking of doing a regular stream about computer science, things like algorithms, complexity, hardware, and all that stuff you might cover in a post-secondary education.  I'd like it to be a live stream to encourage asking questions, but if there is no question I'll just go over fixed topics.

I'd like to know what types of things you'd like to have covered? Or any ideas you might find interesting.

I'd likely due this early day in CET/Berlin time. If there are any people awake at that time then let me know.  I'll aways upload the videos here afterward, with the new video feature. I can then read comments and followup in the next video for those that can't watch live.
Who wants to post videos natively on dev.to?
Tags: meta, discuss
Published: 2018-05-08 18:55:29

---
title: Who wants to post videos natively on dev.to?
published: true
description: 
tags: meta, discuss
---

We want all you glorious devs to upload videos!

We had started doing some videos in collaboration with a couple of members, for example:

{% link https://dev.to/vaidehijoshi/stacks-and-queues--basecs-video-series--20oj %}

We have had these videos on-site for a while now, but initially our video experience was pretty iffy.

{% devcomment 28f6 %}

{% devcomment 28f7 %}

But we made a lot of improvements and playback is much improved. It better be, I put a lot of work into making the transcoding work properly and automatically.

## Now we're ready for a private beta for user uploading

Everyone will soon be welcome to upload programming videos to the platform now. Warning, the upload process is still quite ugly but it seems to work for the most part. But we're not going to sit around until the UX is perfect. We'd love to have a handful of folks give this a try and start uploading tutorials, vlogs, or anything in between.

Even though the early days are janky, this should be a great part of [dev.to](/) and ultimately I think this is going to make videos folks make much more discoverable, contextualized, and with healthier discussions than on YouTube.

## So how do I sign up?

Leave a comment here if you want me to switch on your access. Please link to an example of a video you've made in the past or describe the kinds of videos you plan to share.

Basically show that you are legit in some way, that you plan to upload videos soon. Posting videos you've already posted to YouTube is 100% okay. Regular [dev.to](/) users with lots of on-site activity will have a lower burden of proof.

Eventually this will be available for everyone, but will be limited early on.
Introducing rusync
Tags: rust, cli, rsync, showdev
Published: 2018-05-08 18:43:38

---
title: Introducing rusync
published: true
tags: [rust, cli, rsync, showdev]
canonical_url: https://dmerej.info/blog/post/introducing-rusync/
---

*Originally published on [my blog](https://dmerej.info/blog/post/introducing-rusync/).*

Today I wrote my first “real” rust project.

It’s a re-write of `rsync` in Rust called `rusync`.

Here’s what its installation and usage look like:

```
$ cargo install rusync
$ rusync test/src test/dest
:: Syncing from test/src to test/dest …
-> foo/baz.txt
-> foo/bar.txt
 ✓ Synced 2 files (1 up to date)
```

You can find the sources [on github](https://github.com/dmerejkowsky/rusync).

# Feedback request

I wrote this because I wanted to give Rust a try.

If you’re already are a Rust developer, I’d appreciate it if you could give me a honest review of the code I wrote.

See the [feedback page](https://dmerej.info/blog/pages/feedback/) for all the possible ways to reach me, and many thanks in advance!

# What’s next

Here’s a list of features I plan to implement:

- Option to delete extraneous files
- Global progress bar

The last one is interesting: we need to recursively walk through all the files in the source folder in order to estimate the total size of the transfer, but we want to do that _while the transfer is in progress_.

That will be an opportunity to play a little bit with Rust concurrency features&nbsp;:)

Cheers!
FAQ / Support Thread for the Pusher Contest
Tags: pusher, pushercontest, realtime
Published: 2018-05-08 16:53:12

---
title: FAQ / Support Thread for the Pusher Contest
published: true
description: FAQ and ongoing support from the Pusher team regarding the first-ever DEV Contest.
cover_image: https://thepracticaldev.s3.amazonaws.com/i/f9y0dbubqa5hcf04zwa6.jpg
tags: pusher, pushercontest, realtime
---
Here are some common questions about the [Pusher contest](https://dev.to/devteam/first-ever-dev-contest-build-a-realtime-app-with-pusher-4nhp). If you have a question that's not listed below, drop it in the discussion and we'll get back to you soon! 


**Q: We're talking about using the Pusher APIs and not any specific dev.to endpoints correct?** 
A: The idea is to build something with [Pusher Channels](https://pusher.com/channels?utm_source=dev.to&utm_medium=referral&utm_campaign=Devtocontest). You'd control both the server and client components.

**Q: If we submit mobile applications, should it be a video of the app working as the demo?**
A: You have freedom in terms of how you present the idea, but anything to best demonstrate it is a good idea. Videos, gifs, embeds, anything you can to show the submission in all its splendor.

**Q: Is it limited to mobile apps or can we make web apps too?**
A: All types of apps are equally welcome! 

**Q: Is this contest individual or can we work in teams?**
A: Teams and individuals are both welcome to enter. If you’re going to be submitting posts as a team, email jess@dev.to to add your teammates as co-authors.

**Q: If I plan on writing several posts to document the progress on my project, should I tag every post with pushercontest, or only the submitting entry?**
A: Yes, tag every post with “pushercontest”!

**Q: Is this restricted to any geographical zone?**
A: Of course not - everyone is welcome!
(Unless you're in space 👩‍🚀👨‍🚀🚀🛰, it’s difficult to ship rewards up there. You'd need to land first).

**Q: Can you enter multiple apps?** 
A: It's 100% allowed, this isn’t a school exam 😉

I'll be answering questions in this thread, as will some of my Pusher colleagues.
Looping over object properties with ngFor in Angular
Tags: development, javascript, angular
Published: 2018-05-08 13:55:05

---
title: Looping over object properties with ngFor in Angular
published: true
description: An interesting solution to a problem I found at work.
tags: #development #Javascript #Angular
---

This post was published originally in [medium](https://medium.com/@papaponmx/looping-over-object-properties-with-ngfor-in-angular-869cd7b2ddcc).

Looping over object properties with ngFor in Angular
Hello again, this is post is about an interesting problem I found at work.

If you don’t know it yet. I’m talking about Angular 2+. FYI: Here is a post about why it is just Angular.

The problem

So you want to display the markup for a list, the values for this list come from the back end and for some reason instead of a good old array of objects you receive something like this.

```javascript
{ 
  "car" : 
    { 
       "color" : "red",
       "model" : "2013"
    },
   "motorcycle": 
    { 
       "color" : "red",
       "model" : "2016"
    },
   "bicycle": 
    { 
       "color" : "red",
       "model" : "2011"
    }
}
```

Then you try to use `*ngFor` but a wild error message appears:

Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.
You might fix it in the back end so you get an array of objects, but ain’t no body got time for that. Don’t you worry child, I’ve got us.

The solution

In a perfect world, you would get an array of objects, since the world is not always, perfect. What you want to do, is to store all those objects within an array. Here is an over-simplified solution in plain old JavaScript.

Step 1. Get all the object keys. using Object.keys. This method returns an array of a given object’s own enumerable properties.

Step 2. Create an empty array. This is an where all the properties are going to live, since your new `ngFor` loop is going to point to this array, we gotta catch them all.

Step 3. Iterate throw all keys, and push each one into the array you created.

Here’s how that looks like in code.

```javascript
// Evil response in a variable. Here are all my vehicles.
let evilResponse = { 
  "car" : 
    { 
       "color" : "red",
       "model" : "2013"
    },
   "motorcycle": 
    { 
       "color" : "red",
       "model" : "2016"
    },
   "bicycle": 
    { 
       "color" : "red",
       "model" : "2011"
    }
}
// Step 1. Get all the object keys.
let evilResponseProps = Object.keys(evilResponse);
// Step 2. Create an empty array.
let goodResponse = [];
// Step 3. Iterate throw all keys.
for (prop of evilResponseProps) { 
    goodResponse.push(evilResponseProps[prop]);
}
```



Then you can assign the `goodResponse` to the class property you were trying to iterare trough in the first place.

That’s all folks.
ES6 sets a collection that cannot contain duplicates
Tags: javascript, es6
Published: 2018-05-08 16:30:22

---
title: ES6 sets a collection that cannot contain duplicates
published: true
description: ES6 Sets
tags: #javascript, ES6
---

create a set in ES6 by passing an array into the constructor 
```
let set = new Set([1, 2, 3, 3, 4, 5, 5, 5, 6]);

console.log(set.size); // 6
```
the array I passed in contains duplicates. But the set essentially strips them out leaving a collection of 6 unique items
You also have access to the add() method
```
let set = new Set();

set.add(1);
set.add('two');

console.log(set.size); // 2
```
Finally, there's the has() method, which is very useful. This method allows you to check if an item exists
```
console.log(set.has(1)); // true
console.log(set.has('two')); // true
console.log(set.has(3)); // false
```
[Try it on jsbin] (https://jsbin.com/poqoyoh/edit?html,js,console,output)
Welcome Thread - v12
Tags: welcome
Published: 2018-05-08 16:23:52

---
title: Welcome Thread - v12
published: true
description: Introduce yourself to the community!
tags: welcome
---

Hey there! Welcome to dev.to!

![Rainbow Apple computer flashes the message, "Hello!"](https://media.giphy.com/media/l44Qqz6gO6JiVV3pu/giphy-downsized.gif)

# Welcome!
1. Leave a comment below to introduce yourself! You can talk about what brought you here, what you're learning, or just a fun fact about yourself.

2. Reply to someone's comment, either with a question or just a hello. 👋

```
01110111 01100101 01101100 01100011 01101111 01101101 01100101 00100001
```
Another Round of JWT.io and JWT Debugger Extension Updates
Tags: jwt, authentication, cryptography
Published: 2018-05-08 16:18:47

---
title: Another Round of JWT.io and JWT Debugger Extension Updates
published: true
description: We have released new versions of JWT.io and the JWT Debugger extension, learn what's new.
tags: #JWT #authentication #cryptography
canonical_url: https://auth0.com/blog/more-jwt-io-and-jwt-debugger-extension-updates/
---

We have released another round of updates for our JWT.io website and the JWT Debugger extensions (Chrome, Firefox). Among the new features are HMAC secret length hints, common claim descriptions, simplified library updates for the website, a share button for the website, support for plain RSA public keys, and more token types can be passed in the URL! 

In this post, we will go over these new features.

[Read on ✊](https://auth0.com/blog/more-jwt-io-and-jwt-debugger-extension-updates/?utm_source=dev&utm_medium=sc&utm_campaign=jwtio_update2)

![Another Round of JWT.io and JWT Debugger Extension Updates](https://thepracticaldev.s3.amazonaws.com/i/6f85m1w2ghhzi4btbhwj.png)
Requests for DEV posts (May 8 edition)
Tags: discuss
Published: 2018-05-08 15:14:37

---
title: Requests for DEV posts (May 8 edition)
published: true
description: 
tags: discuss
---

This is a new weekly thread where folks can request blog posts covering a topic, or several topics.

For example

> I'm looking for an article explaining "proof of stake" in blockchain

Or

> I'd love to read a post about moving to San Francisco for a job

If you see something you want to write about, leave a comment that you plan to write about it. More than one person can leave that comment.

Once you have written the post, either @ mention the requestee as a comment in your new post or reply to them again in the thread where they requested it.
Why Do Leaders Treat Programmers Like Children?
Tags: career, leadership, culture, management
Published: 2018-05-08 15:02:48

---
title: Why Do Leaders Treat Programmers Like Children?
published: true
description: In this video I share 9 truths of software development that if understood by leadership, will help them get along with programmers better at their company.
tags: #career, #leadership, #culture, #management
cover_image: https://thepracticaldev.s3.amazonaws.com/i/iqv5hwxmb20s13b5bf5p.png
---

Does it sometimes feel like the decisions made by leaders are almost _trying_ to get programmers to hate their software development projects?

I used to take for granted things I knew about development - and assume that leadership at my company understood them.

Because software development is so expensive, and traditional leadership doesn't always teach enough about the unique challenges of IT - there can be decisions made that lose trust and build resentment from programmers.

But it's not really the fault of leaders unless they know better and _choose_ to go against best practices.

**Complaining never helped the situation for me.**

In this video I share 9 truths of software development that if understood by leadership, will help them get along with programmers better at their company.

If your CEO, Product Manager, or Project Manager doesn't know these things, disastrous results can occur on your software project.

Why would leaders _purposefully_ build a culture that causes people to get angry and eventually leave?

[Subscribe for 90+ videos on healthy software development](https://YouTube.com/c/JaymeEdwardsmedia?sub_confirmation=1)

{% youtube Qp_yMadY0FA %}

# [Watch on YouTube 📺](https://www.youtube.com/watch?v=Qp_yMadY0FA&index=1&list=PL32pD389V8xtt7hRrl9ygNPV59OuqFjI4&t=0s)