teleren/devto huggingface dataset:
Introducing Food Picker, the best way to pick what to eat with your colleagues !
Tags: javascript, webdev, showdev
Published: 2019-08-05 20:45:23

> It's lunchtime, you look up from your monitor and meet your colleague's gaze, they whisper: *sushi*, you whisper back: *no way Jose*.  
You then share with them a link to [Food Picker](https://foodpicker.club/), and both select what you'd like to eat and **BAM**, an accord was reached: pizza.

This could be you if you used Food Picker with your team, no more debating where to eat, no more tears and anger, only food.

![Food picker screenshot](https://thepracticaldev.s3.amazonaws.com/i/aaogfbcs2crj4h89vccl.png)

I hope some of you actually find this useful, otherwise here are some other projects I did recently:

- A banner generator for DEV ➡️ [Link](https://github.com/christopherkade/banner-generator)
- A `.gitignore` generator CLI ➡️ [Link](https://github.com/christopherkade/gitignore-it)

If you like it, feel free to give it a ⭐️ [right here](https://github.com/christopherkade/foodpicker)!
waybackmachine July '19
Tags: monthly, dirtylittlethings, waybackmachine, agile
Published: 2019-08-05 20:07:53


> ... because it's always fun to go back in time and remember what you learnt back then ...


# the CLI


**1)** I never thought I could love reverse-i-search more, but fzf makes a good combo

{% github junegunn/fzf %} 


**2)** [nGrok](https://ngrok.com) \+ [quick access to any ssh machine with nGrok] (https://diegocarrasco.com/how-to-create-a-ssh-tunnel-with-ngrok-on-ubuntu-server-aka-ssh-access-to-your-local-server-in-local-network-with-dynamic-ip/)

If you ever need to expose/access your local services from a public context, quickly and without much configuration hustle (dynamic ip), this is your tool.

> ngrok provides a real-time web UI where you can introspect all HTTP traffic running over your tunnels. Replay any request against your tunnel with one click


edit 2019/11/04: there are even more options to nGrok, like
- [Serveo](https://serveo.net) 

--- 

# Cheatsheets

![Security attacks per layer](https://pbs.twimg.com/media/EAgPA4NXYAEMBLk?format=jpg&name=large)

![Unix performance tools](https://pbs.twimg.com/media/EAjqTXKXkAArD9D?format=jpg&name=4096x4096)


--- 

# Code/J2EE

**1)** Should have known the existence of ``Future`` handlers with [``CountDownLatch``](https://docs.oracle.com/javase/7/docs/api/java/util/concurrent/CountDownLatch.html)... makes code fancier x)

![CountDownLatch threads explanation](https://i.postimg.cc/YCypwwsk/Countdown-Latch-example.png)


**2)** Gracefully shutdown Java Threads with ``ShutdownHooks``
``
Runtime.getRuntime().addShutdownHook(new Thread(() -> {
       server.shutdown();
}));
``

--- 


# Watch

- **One Page Product Design** by @flipper83 (spanish)
Howto bring all your team into the same mindset in order to get to the current goal
  - use visual guides like infographics, diagrams, BIG pictures, with common glossary... and make them as reachable as possible, preferably within the office

{% youtube 9wVJHZEeTY0 %}


--- 

# Adopt

Due to my nature TOC, I've had my own ``git commit message`` convention from a long time, but it's good to know there's something already written about it [Conventional Commits](https://www.conventionalcommits.org) - Standard templates for git commit messages

--- 

# The w00t?

- The shebang (#!)

> Among UNIX shell (user interface) users, a shebang is a term for the "#!" characters that must begin the first line of a script. In musical notation, a "#" is called a sharp and an exclamation point - "!" - is sometimes referred to as a bang. Thus, shebang becomes a shortening of sharp-ban

---


# Monthly hook

{% spotify spotify:track:3EK4tGkSiO5xvvB5sM4tln %}
Need help / suggestions on a project
Tags: discuss, help, webdev, php
Published: 2019-08-05 19:58:04

---
title: Need help / suggestions on a project
published: true
description: Need suggestions on how to improve a feature
tags: discussion, help, webDev, php
---

So for the past few days I have been developing a simple web base app to allow waiters at my brothers bar to manage tables and tabs for guests. 

I have everything setup and ready to be pushed to beta testings.

But one thing that keeps bugging me is the way I currently have the bars layout setup in the app. 

What I have done is created a `svg <rect>` shapes and hard coded them in the view file ****sigh****. Which we all know is a terrible practice especially if there is a change in the bars layout.

This is how it looks in the app at the moment:
![](https://thepracticaldev.s3.amazonaws.com/i/kxoyc9zy2uvesbc4emwb.png)


And this is how it looks in the code:
![](https://thepracticaldev.s3.amazonaws.com/i/pm891ltsdl7x4iwtpqkf.png)

So what I would like to hear from this community is, how you would try and do this so that I can allow maybe an admin to alter this layout if they want it to look a bit different. Maybe add some other config options to it. Because at the moment it doesn't look that good and is not dynamic at all. I was thinking maybe using the `<canvas>` and then store / load that data from a db. But was not able to find a good tutorial for it online. 

All I was able to find was how to like store stuff from a canvas to png file. 

Is there a way to accomplish this without having to implement a complicated library or have a 3rd party service embedded in the app ?

If needed, these are the project specs:
    - Langues: PHP, jQuery
    - Database: MySQL 

I didn't use any frameworks for this project. 

Thanks for any feedback / help. :)
Why there is not a SDK a la Android for creating Mobile and Desktop APPs based in OpenSource Core Technologies?...
Tags: sdk, opensource, kotlin, typescript
Published: 2019-08-05 19:35:18

**Why there is not a SDK a la Android for creating Mobile and Desktops APPs based in OpenSource Core Technologies? Let's Avoid Vendor Lock-In.**


I've being making myself this question for already long time. *Clearly Android success has being due to it's SDK and appeal to developers*, so why the people in the OpenSource community have not develop a SDK like that with already known technologies like Kotlin, TypeScript, etc. which already have a large community around them.

Also, to provide the opportunities to create a central OpenSource store/repo where to buy and get the apps and to create the possibilities for other to create their own.

Let's avoid vendor lock-in.


What are your thoughts on this matter?
I've been looking to break into the industry since 2018, what am I doing wrong?
Tags: career, beginners
Published: 2019-08-05 18:53:48

I have been frustrated by the constant rejection emails I have been getting. I don't wear them as a badge of honor as much as a reminder of how discouraging the tech industry can be. I often have thoughts of maybe if I wasn't female or maybe I was white, I would have gotten a job faster. I feel like I am doing something wrong and I don't know what it is. I have been doing the following:

-Networking
-Attending Meetups
-Asking for what I could do better in interviews
-Updating my resume (I have 3 versions of the same resume.)
-Building projects
-I have my own website
-Taking on independent projects for free to build my resume (I, however, would not work for a startup with no funding/for free, I tried that before and I didn't feel motivated with the project.)

I have come to the conclusion that the city I live in is not junior friendly however, it is unrealistic for me to consider a move since I am a junior and nobody would pay for me to relocate since I have no experience (I was told this on a Slack channel.)

I feel like I am hitting a brick wall and think I have wasted a year and a half looking for work. I have so many negative thoughts that I wonder if it's even worth it to keep going.

I really want somebody to tell me what I am doing wrong. I feel like people are laughing at me behind my back for wasting time going into the tech industry. If I am not good enough just say so. I am more than happy being miserable in retail.

Sorry for the negativity of my post.
Best Advice To Land A Startup Job?
Tags: career, startup, beginners
Published: 2019-08-05 18:40:14

Hello, everyone. 

I am new to the site but I already have learned and discovered so many cool new things. I have nearly always worked for myself and I did not attend college, so finding a decent job in any field is tough. Finding a job in tech or a startup is even harder. I have always been passionate about technology and the startup culture. It is something I think about and follow daily in my free time.

I am smart, creative, humble and determined. My goal is to start my own tech related company someday. Can anyone give me any advice or suggestions on what steps to take? Thank you for taking the time to read and respond.
What Is The One Website / App You Would Build If You Had All The Necessary Skills to Do It Yourself?
Tags: discuss
Published: 2019-08-05 18:01:04

---
title: What Is The One Website / App You Would Build If You Had All The Necessary Skills to Do It Yourself?
published: true
description: What would you be building if you had all the skills required?
tags: #discuss
---

We’re super curious on this one. Maybe you can follow it up with actually learning the skills necessary if it doesn’t seem too impractical?
I am an African developer, Ask Me Anything!
Tags: ama, difficulty, code, learn
Published: 2019-08-05 17:51:40

---
title: I am an African developer, Ask Me Anything!
published: true
cover_image: https://www.statravel.com/static/us_division_web_live/assets/UK-AFRICA-CONTENT-JUNE_960X400.jpg
tags: ama, difficulty, code, learn
---

You might wanna know how it feels :) ready for all your question
Taking counter-questions to interviews
Tags: discuss
Published: 2019-08-05 17:50:18

---
title: Taking counter-questions to interviews
published: true
tags: discuss
---

I've been interviewing recently and I'm having typical interview questions thrown at me - mostly not brainteaser type stuff, but the sort of 'Do you know your Javascript?' type questions. I had this thought about bringing my own set of questions to the interview, to see if the interviewing developer could likewise answer questions on the spot.

I was reminded recently that interviews are as much an opportunity to evaluate the company, as it is for the company to evaluate you. While I certainly wouldn't want to make anyone uncomfortable, interviews tend to be lopsided in favor of the interviewer seeking specific answers, and being able to evaluate the knowledge of the interviewer to see how you'd fit into the team is interesting.

Thoughts?
30 days of learning - 000
Tags: beginners, todayisearched, todayilearned
Published: 2019-08-05 17:38:36

Hello All & Myself,

This is my first ever post on dev.to and I guess first ever "sensible" blog post. I am quite bored of things which I get too often. I'm finding it quite difficult to concentrate on things as and I feel too bored with the usual stuff I do at office. 

So, to get over this I have decided I will learn something new everyday. Not something big but some pieces from here and there and will try to gather little every day. My learnings would vary from reading/learning something new to trying out something. Whatever small or big it may be, I will try to write a blog for my learnings every day.

Hope I reach the goal!


P.S : This post might have a number of mistakes, please avoid it. I am just BEGINNING. 

P.P.S : This was the first day :D, I stepped into blogging!
The Little History of Redux
Tags: redux, history, todayisearched
Published: 2019-08-05 17:32:42

Redux is one of the libraries that helps me implement sophisticated state management in my applications. It goes beyond the local state. It is one of the solutions me would take in a scaling application in order to tame the state. A React application is a perfect fit for Redux, yet other libraries and frameworks highly adopted its concepts as well.

"*Redux is a predictable state container on JS*" -[https://redux.js.org/](https://redux.js.org/)

Dan Abramov and Andrew Clark are the creators of Redux. It was introduced by Dan Abramov at React Europe in 2015. However, the talk by Dan doesn’t introduce Redux per se. Instead, the talk introduced a problem that Dan Abramov faced that led to implementing Redux. 

I don’t want to foreclose the content of the talk, that’s why I encourage you to watch the video yourself. If you are keen to learn Redux, you should dive into the problem that was solved by it.

Nevertheless, one year later, again at React Europe, Dan Abramov reflected on the journey of Redux and its success. He mentioned a few things that had made Redux successful in his opinion. Redux was developed to solve a problem. The problem was explained by Dan Abramov one year earlier when he introduced Redux. It was not 'yet another npm library'. It was the library that solved a hands-on problem. Time Traveling and Hot Reloading stress tested Redux, proving the constraints of Redux to be 'yet' another key factor to library's success. Redux managed to shield away the problem with simple API and a thoughtful way to solve the problem of state management.
The 7 Most Popular DEV Posts from the Past Week
Tags: top7
Published: 2019-08-05 17:14:42

---
title: The 7 Most Popular DEV Posts from the Past Week
published: true
description: A round up of the most-read and most-loved contributions from the community this past week.
tags: icymi
cover_image: https://thepracticaldev.s3.amazonaws.com/i/sfwcvweirpf2qka2lg2b.png
---
Every Monday we round up the previous week's top posts based on traffic, engagement, and a hint of editorial curation. The typical week starts on Monday and ends on Sunday, but don't worry, we take into account posts that are published later in the week. ❤️

#1. Remember GeoCities?

Nicole shares their journey with us on how they transitioned to becoming a developer.

{% link https://dev.to/nicolepdev/why-i-became-a-front-end-web-developer-at-age-35-4apa %}

#2. Best Practices

Milecia tells us a little bit about design patterns and why they're important. Specifically, they dive into the singleton, strategy, observer, and decorator design pattern.

{% link https://dev.to/flippedcoding/4-design-patterns-in-web-development-55p7 %}

#3. Acceleration

Evan explores the perspective of businesses that hire developers and explains why developers are not fixed costs.

{% link https://dev.to/flaque/what-developers-are-why-an-unprofitable-company-can-have-70-margins-4jbg %}

#4. Covering The Basics

A handy list of Docker commands.

{% link https://dev.to/kojikanao/15-docker-commands-for-beginners-4m4d %}

#5. Byte Sized

Vaidehi takes us back in time to learn about the creation of Graph Theory in a fun monologue style video with lots of fun graphics and sound effects.

{% link https://dev.to/bytesized/byte-sized-episode-2-the-creation-of-graph-theory-34g1 %}

#6. Measurements Units

Matthias teaches us about relative units, absolute units, and viewport units in CSS.

{% link https://dev.to/fullstack_to/units-in-css-em-rem-pt-px-vw-vh-vmin-vmax-ex-ch-53l0 %}

#7. Extra Cash

Florin shares a list of ways developers make money -- from monetizing blogs to coaching lessons to buy bounty programs.

{% link https://dev.to/florinpop17/ways-to-make-money-as-a-developer-11fb %}

_That's it for our weekly wrap up! Keep an eye on dev.to this week for daily content and discussions...and if you miss anything, we'll be sure to recap it next Monday!_
How to find distinct items in an array in javascript or typescript
Tags: javascript
Published: 2019-11-01 10:06:56

---
title: How to find distinct items in an array in javascript or typescript
published: true
tags: #javascript
canonical_url: https://darraghoriordan.com/2019/08/05/fnding-distinct-items-in-array-typescript/
---

I have to sort a bunch of work items in to organisational areas so I needed to know what were the distinct categories of objects in an array. 

In C#/Linq there is a nice IEnumerable.Distinct(f(x)) method available but JavaScript doesn’t have something like this yet. I didn’t want to install a helper like lodash if I could avoid it. 

Luckily my list was simple strings so I was able to use ‘Set()‘.

```
// The solution is to map your objects to the array of identifiers. note: This only works if the identifier is, or can be reduced to, a primative type. If you supply objects it will use object references which might not act as you expect. There is no IEquatable in JS either.

// map objects to a list of identifier strings
let areaNames = stagingBuild.workitems.map(x => x.area)

//distinct categories will be distinct! The set will check if the value already exists
// A value in the Set may only occur once; it is unique in the Set's collection.
const distinctCategories = [...new Set(areaNames)]

// watch out becuase undefined and NaN can be stored in the Set.
// And in the case of strings, casing is respected for uniqueness
```
Preparing USB for Linux
Tags: linux, ubuntu, beginners, tutorial
Published: 2019-08-05 17:05:02

Great Guyz, thanks for pushing me this far with your reactions, views and some comments although more comments would be more helpful. Anyhow lets get ready for Linux. The Flavor I will be using is known as Manjaro GNOME, which is quite much trending on [Distrowatch](www.distrowatch.com), you should visit the site it has great community and reviews for linux OS releases.

Lets download the ISO file and we will be repeating the process from [Windows USB Guide](https://dev.to/th3n00bc0d3r/preparing-usb-for-windows-2p3) by using [Rufus](https://github.com/pbatard/rufus/releases/download/v3.6/rufus-3.6.exe).

Normal Edition
[https://pop-iso.sfo2.cdn.digitaloceanspaces.com/19.04/amd64/intel/10/pop-os_19.04_amd64_intel_10.iso](https://pop-iso.sfo2.cdn.digitaloceanspaces.com/19.04/amd64/intel/10/pop-os_19.04_amd64_intel_10.iso)

Those who have NVIDIA Cards
[https://pop-iso.sfo2.cdn.digitaloceanspaces.com/19.04/amd64/nvidia/10/pop-os_19.04_amd64_nvidia_10.iso](https://pop-iso.sfo2.cdn.digitaloceanspaces.com/19.04/amd64/nvidia/10/pop-os_19.04_amd64_nvidia_10.iso)

You should have the files like this, it does have the previous window file as well.

Now open Rufus and click on select and select pop-os_xx.iso that you have downloaded. Then Click on Start.

![](https://thepracticaldev.s3.amazonaws.com/i/fib8of7ipfggiezdwn0w.PNG)

Also if you want details on whats going on during the build process, click the info window button in lower left corner.

![](https://thepracticaldev.s3.amazonaws.com/i/tj1l9fd517x8uum5lcxq.PNG)

You have a Linux Installation USB ready to go, Lets get ready to Rumble once again!!!!

[Next: Installing Linux](https://dev.to/th3n00bc0d3r/installing-linux-5d9e)

[Noob Index](https://dev.to/th3n00bc0d3r/noob-guides-index-4mne)
What Is Step-Up Authentication, and When Should You Use It?
Tags: authentication, security
Published: 2019-08-05 16:58:04

---
title: What Is Step-Up Authentication, and When Should You Use It?
published: true
description: Learn how to use step-up authentication to strike a balance between security and friction.
tags: #authentication #security 
canonical_url: https://auth0.com/blog/what-is-step-up-authentication-when-to-use-it/
---
Ideally, your new service or app is easy to use and access, and customers—who you want using your product as quickly as possible — can start using it with minimal friction.

Your core value proposition is just on the other side of a login screen, and making that entrance even marginally more difficult can risk sending those potential customers elsewhere.

Step-up authentication is a way to strike a balance between security and friction. It ensures users can access some resources with one set of credentials but will prompt them for more credentials when they request access to sensitive resources.

We'll go over three emblematic use cases for step-up authentication:

Users want seamless access to certain resources, but organizations want to verify their identities before they access anything more sensitive.
Employees need access to data to complete everyday work, but occasionally need access to private data that would cause damage if exposed.
You have or want to deploy a membership model that limits complete access to your site or service to paying users.
Step-up authentication enables you to provide easy access to one layer of resources and secure access to another layer of resources. This makes authentication work for you and your users and unlocks new ways to run your business.

[Continue Reading 📖](https://auth0.com/blog/what-is-step-up-authentication-when-to-use-it/?utm_source=twitter&utm_medium=sc&utm_campaign=stepup_authentication)
Aha! Understanding Typescript's Type Predicates
Tags: typescript, javascript, tutorial, webdev
Published: 2019-08-05 16:47:48

This article will cover Type Predicates at a high level. To understand Type Predicates, we must first understand how they are used in relation to union types. 

## Union Types

In Typescript, a variable isn't always restricted to a single type. [Union Types](https://www.typescriptlang.org/docs/handbook/advanced-types.html#union-types) are a way to declare  multiple types onto a single value.

```ts
// value can now be set to a `string`, `boolean`, or `null` value. 
let value: string | boolean | null = ...

interface Cat {
  numberOfLives: number;
}
interface Dog {
  isAGoodBoy: boolean;
}

let animal: Cat | Dog = ...
```

When we use union types, we have to do work to _narrow_ the possible types down to the current value's actual type. [Type Guards](https://www.typescriptlang.org/docs/handbook/advanced-types.html#type-guards-and-differentiating-types) are what allow us to do this narrowing. 

## Type Guards

According to the official docs, 
> A type guard is some expression that performs a runtime check that guarantees the type in some scope.

Put another way, type guards guarantee that a string is a string when it could also be a number.

Type guards are not entirely different than doing feature detection. The big idea is to try to detect properties, methods or prototypes to figure out how to handle a value. There are four main ways to use type guards:

- `in` keyword
- `typeof` keyword
- `instanceof` keyword
- type predicates with custom type guard


## Type Predicate

While you are probably familiar with "in", "typeof", and "instanceof", you might be wondering what "type predicates" are. Type predicates are a special return type that signals to the Typescript compiler what type a particular value is. Type predicates are always attached to a function that takes a single argument and returns a boolean. Type predicates are expressed as `argumentName is Type`.

```
interface Cat {
  numberOfLives: number;
}
interface Dog {
  isAGoodBoy: boolean;
}

function isCat(animal: Cat | Dog): animal is Cat {
  return typeof animal.numberOfLives === 'number';
}
```

For sample function, `isCat`, is executed at run time just like all other type guards. Since this function returns a boolean and includes the type predicate `animal is Cat`, the Typescript compiler will correctly cast the `animal` as `Cat` if `isCat` evaluates as true. It will _also_ cast `animal` as `Dog` if `isCat` evaluates as false.

```ts

let animal: Cat | Dog = ...

if (isCat(animal)) {
  // animal successfully cast as a Cat
} else {
  // animal successfully cast as a Dog
}

```

Pretty neat! Perhaps the best thing about custom type guards and type predicates is not only we can use `in`, `instanceof`, and `typeof` in our type guards but we can also custom type checks. As long as our function returns a boolean, Typescript will do the right thing.
Come code with me ...
Tags: discuss, livecoding, javascript, opensource
Published: 2019-08-05 16:43:48

From now on, I'll stream my working process [over Twitch](https://www.twitch.tv/gmartigny) everyday.
So come join me all days of the week from [12:00pm to 6:00pm CEST](https://www.worldtimebuddy.com/?qm=1&lid=2988507&h=2988507&date=2019-8-5&sln=12-18).

So why come joining me ?

I'll be working on open-source projects using modern Javascript stack. I'll do my best to answer any question related to the stream, so come if you want to have a nice chat about new web technologies.
Also, you can laugh at my weird French accent 🤓🇫🇷.

I hope to see you there, and until next time, peace ✌️