teleren/devto huggingface dataset:
DevDiscuss Season 4 Premiere: Meetings Worth Making with Andy Goodman
Tags: discuss, podcast
Published: 2021-02-10 19:29:15

---
title: DevDiscuss Season 4 Premiere: Meetings Worth Making with Andy Goodman
published: true
description: A preview of the Season 4 premiere of DevDiscuss!
tags: discuss, podcast
series: DevDiscuss Season 4
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/tul3noy17j3pt8xs9qdc.png
---

> **DevDiscuss is back for a brand-new season!**

{% podcast https://dev.to/devdiscuss/s4-e1-this-is-how-you-have-effective-meetings %}

In the season four premiere, @Jess and I talked about a subject we think about often as co-founders of an entirely remote, global team: meetings. That is, how to make sure they are worth everyone's time — and maybe even enjoyable. 

**In S4E1, we were joined by [Andy Goodman](https://twitter.com/GoodmanCenter), co-founder and director of The Goodman Center. Andy teaches a popular workshop called, “Meetings for People Who Hate Meetings.”**

Naturally, Andy gave us a lot of insight into how to design better meetings, how meetings differ across various industries, the number one thing every meeting needs to be successful, and lots more. 



---

_You can [follow DevDiscuss](dev.to/devdiscuss) to get episode notifications and listen right in your feed_ — or subscribe on your platform of choice! Plus, if you leave us a review, we'll send you a free pack of thank-you stickers. Details [here](https://airtable.com/shr8oKAIMZgdYnBxx). 

## Quick Listening Links
- [Apple Podcasts](https://podcasts.apple.com/us/podcast/devdiscuss/id1513053883)
- [Spotify](https://open.spotify.com/episode/4K9YMjOtpEoxUMc80OoHj1)
- [Google](https://podcasts.google.com/feed/aHR0cHM6Ly9mZWVkcy5kZXZwb2RzLmRldi9kZXZkaXNjdXNzX3BvZGNhc3QueG1s/episode/aHR0cHM6Ly9kZXZwb2RzLmRldi9wb2RjYXN0cy9kZXZkaXNjdXNzLzI2?sa=X&ved=0CAQQkfYCahcKEwiwjuClheDuAhUAAAAAHQAAAAAQAw)
- [Listen Notes](https://www.listennotes.com/podcasts/devdiscuss/s4e1-this-is-how-you-have-KZTJrgauFSe/)
- [TuneIn](https://tunein.com/podcasts/Technology-Podcasts/DevDiscuss-p1324596/?topicId=160722393)
- [RSS Feed](http://feeds.codenewbie.org/devnews_podcast.xml)
- [Transcript](https://devpods.herokuapp.com/podcasts/devdiscuss)
- [Pocket Casts](https://pca.st/fbiqm2mr)

---
_Acknowledgements_ 
- _@levisharpe for producing & mixing the show_
- _Our season four sponsors: DataStax, New Relic, Educative, and Ambassador Labs!_

# 🗣️🗣️🗣️
Docker Desktop on Windows expose daemon to LAN
Tags: docker, windows10
Published: 2021-02-10 18:49:37

# Steps : 
- Enable "Expose daemon on tcp://localhost:2375 without TLS" in settings.
- From admin Command Prompt
```cmd
netsh interface portproxy add v4tov4 listenport=2375 listenaddress=192.168.0.2 connectaddress=127.0.0.1 connectport=2375
```

> _NOTE_ : replace listenaddress to your LAN ip

- On Remote machine Set DOCKER_HOST to tcp://192.168.0.2:2375
Intro to Vue.js
Tags: vue
Published: 2021-02-10 18:38:18

##What is Vue?
Well, completely stolen from their website, Vue is defined as:
> Vue (pronounced /vjuː/, like view) is a progressive framework for building user interfaces. Unlike other monolithic frameworks, Vue is designed from the ground up to be incrementally adoptable. The core library is focused on the view layer only, and is easy to pick up and integrate with other libraries or existing projects. On the other hand, Vue is also perfectly capable of powering sophisticated Single-Page Applications when used in combination with modern tooling and supporting libraries.

##That's helpful... NOT
I know. It's a little wordy. But to help break this definition down a little bit, you should first know what a framework is.

##So what is a framework?
A framework is a building block for making websites or web apps. Think of it like somewhat of a template to use. There's a library of predefined functions that you can take advantage of rather than creating everything from scratch.

My favorite analogy that I've heard is; if you're building a car, you're best off buying a wheel rather than try and reinvent it.

##Do you have a super digestible and intelligently explained video that I can just watch instead?
Funny you should ask that. I actually do. I made [this video](https://youtu.be/8U40thKt1xA) demonstrating how I used Vue to build off of my resume that I made using HTML and CSS. If you want to know how I made that, you can watch [this video](https://www.youtube.com/watch?v=DNbNcJ9LqnI&ab_channel=JonasJason)
Typescript and hapi payloads
Tags: typescript, hapi
Published: 2021-02-11 10:05:32

---
title: Typescript and hapi payloads
published: true
date: 2021-02-10 18:31:41 UTC
tags: typescript,hapi
canonical_url: https://www.solarwinter.net/typescript-and-hapi-payloads/
---

I’ve spent a bit of time on this over the last couple of days - it’s probably really obvious to people more familiar with [Typescript](https://www.typescriptlang.org/), but I’m getting there. :-)

## The problem

Typescript kept complaining when I used fields from the payload object:

```ts
src/code.ts:65:37 - error TS2339: Property 'previousUrl' does not exist on type 'string | object | Buffer | Readable'.

```

And it’s not wrong - that property doesn’t exist there.

Since the type of `payload` is already declared, I couldn’t just declare a new interface with a different value.

## A solution

I’m not claiming this is the best solution necessarily, but it does work, and it seems in keeping with the whole Typescript approach of “don’t make things an `any` object”.

What I did was define a new interface:

```ts
interface myInterface {
	previousUrl: string
};

```

And then use payload as that:

```ts
h.redirect((request.payload as myInterface).previousUrl);

```

## A note on hapi

I thought I’d try [hapi](https://hapi.dev) after using Express for a while. I’m still learning the patterns, but so far it seems nice, actually. It follows the “batteries included” approach from Python, but the batteries are plugins, so you only import the ones you want.
3 . Visual Element Shapes
Tags: design, codenewbie, career, computerscience
Published: 2021-02-10 18:07:23

There are three types of SHAPES 
1. Geometric
2. Organic 
3. Negative 


**1. Geometric Shapes :~ **
are those which are made by joining the lines like 
Rectangle, Triangle, Hexagon, Polygons, Circles etc 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/ghof2aazwa35qqscshvy.jpg)



**2. Organic Shape:~ **
are those Which has no difened bounderies and close to NATURE. 
Leaf, Tree, etc
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/l8mdtz6ppc7ci7e9zq5i.jpg)



**3 .Negative Space:~ **
 are those which appears When we create a shape and it give rise to another shape after completion. This space would be called a Negative Space. For example : Peter and the wolf, Jungle and cities, Plate and Trees, Cocal Cola and Slipper etc .
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/42laramfszaa01rp6x14.jpg)
What kind of health issues do a software engineer face?
Published: 2021-02-10 18:04:51

<a href='https://www.hindihealthpoint.com.'>Health</a> is combination of physical and mental state:

Software engineers Life In general:

Project specific timings, so if you are not working in regular shift you are not sleeping on time.

Entire life gets affected with your sleep cycle.

Waking up late? you are already hungry, so can not work out much.

waking up late makes you skip breakfast, but breakfast is very important in our daily routine. It supplies more oxygen to the brain.

This reflects in poor decision making, which in turn reflects in your task prioritizing.

Some people hardly sleep for 4 hours which causes Alzheimer decease.

This could affect the hormones and results in hair fall, weight gain and fluctuating blood pressures.

Some people tend to smoke a lot to avoid all these tensions, and get addicted to this in no time with out their knowledge, which is direct and indirect healthy hazard. Alcoholism too is a side effect of this profession. I have personally seen many cases where people lost their lives and body parts due to drink and drive cases.

Project deadlines, traffic pollution, long hour drives, sitting for long time in wrong postures with out knowledge will result in sciatica, back bone damage and result in sever back pain which might need surgery or even end up getting physically weak.

Eating junk and eating out side frequently is part of your life? Please see how and when those KFC and McD foods are prepared and shipped.

Restaurants end up cooking food in lot of salt and oils to make it taste better. Which will increase BP & cholesterol. You might think you are lean or feeling healthy but cholesterol doesn’t just mean being obese. Your blood veins could have got clotted already but you don’t feel it until you get your blood tests done.

I am a victim of some of the above mentioned problems too, but i make sure i have time to meditate, walk in sun, take stairs when ever possible, avoid social media and regular prayers to over come them.

I have seen people working 12–14 hours for the company, when the same person is sick, is running out of sick leaves HR will call him back to check if he is going to join back or not? Not even those colleagues who take his help completing their work check on his health condition, then the only people to support are family members, who he never spared few hours in those many years come to his rescue.

Our health and happiness is more important than anything else, so to all those who read this my request is : Set your priorities right.
Famous last words
Tags: gamedev, unity3d, beginners
Published: 2021-02-10 12:57:47

Hello, Namaste, Ola, Bonjour, Konnichiwa, Guten Tag, Ciao.

These words greet me every morning as I leave my one year old at his creche every morning. After almost 18 months of watching my son grow up around us, it feels a little strange that he’s going to be spending almost 8 hours a day away from us.

8 HOURS !!

What I’ve kind of become good at, over the past 18 months, is to squeeze 8 hours worth of work into 4. Every minute we were not attending to him, we were hard at work.

This invariably leaves me with an hour or two to work on my interests.
So the question now is, do I resurrect my old side projects or learn something new and add to my side-project-cemetery ?

My old side projects, while interesting, and definitely had potential to become something more than they did, but as they say, necessity is the mother of all invention, mine have outlived their necessity and purpose, for now.

I’ve always wanted to create multi-platform apps and game development, in general. So I took the plunge, bought some study material, to learn Unity & C#, and I’m now an aspiring game dev ! (with a little bit of Xamarin on the side)

I’m quite certain I will not make any money in this brutal, competitive world of indie games, but I’d be able to add a couple of things to my repertoire.

And art ! I need to find someone to do my art ! But that’s for another day. Baby steps !

So here goes nothing !
Google XSS challenge: Level 5 aka Breaking protocol (detailed walkthrough)
Tags: security, xss, cybersecurity
Published: 2021-02-10 18:02:35

## Prerequisite

Before getting started one should be familiar with XSS or at least have an idea about it. Here is a good article which you may give a read to understand what is XSS. [Read](https://portswigger.net/web-security/cross-site-scripting)!

Also, I assume that readers are at least familiar with JavaScript. If not then I'll suggest to spend some time with JS and get comfortable with the basics. You can refer to [javascript.info](https://javascript.info/) and [MDN](https://developer.mozilla.org/en-US/docs/Web) which are extremely helpful.

> 💡 Also in this whole series we'll not even roll our eyes on **Hints** and **Toggle Code** as in real-world bug hunting no one will give you hints or non-obfuscator source code so you have to figure out things yourself.

## Mission Description

Cross-site scripting isn't just about correctly escaping data. Sometimes, attackers can do bad things even without injecting new elements into the DOM.

## Mission Objective

Inject a script to pop up an alert() in the context of the application.

## Breaking In

This one is interesting and easy as well. One thing you'll notice here is as you click on `signup` the URL changes to `level5/frame/signup?next=confirm` but what is this `next=confirm`. On clicking `next` you'll see the URL changes to `level5/frame/confirm` which tells us that `next=` is where we'll be redirected.

While having a look at the network tab we click on `signup`, we can see the following in the response tab:

[![xss-level-5-network-dev-tool.png](https://i.postimg.cc/44H8BtM2/xss-level-5-network-dev-tool.png)](https://postimg.cc/5j1qtHf8)

so `signup?next=confirm` request is being made with query `next=confirm` and we can see in the response tab that the `href` is set to the query parameter i.e *confirm*. Just to make sure this is what is happening you can try `signup?next=hello` and you'll see `href=hello`.

Now that we found the entry point we need to think of a payload. This is where the level gets different from other levels. **Hint**:[ can you execute JavaScript from an `<a>` tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#onclick_events)?

**Payload**: `javascript:alert(/xss level 5/)`

set `next=javascript:alert("xss level 5")` in the URL.

**After Injecting Payload**: `<a href="javascript:alert(/xss level 5/)">Next >></a>`

Click on the *next* link and Boom! an alert showed up and you cleared the level.

We are not done yet!! We have 1 more level of Google XSS challenges to complete so head over to the [blog section](http://souvikinator.netlify.app/tags/google-xss-challenge/) and checkout walkthroughs.



🥳 So it's time to wrap up the post with a quote 

> "In learning, you will teach, and in teaching, you will learn" -Phil Collins
Talking about "for" and "while" loops in JavaScript
Tags: javascript, loops, 100daysofcode, webdev
Published: 2021-02-10 18:02:26

Looping in JavaScript is a time-efficient method to actually run a code more than once according to the requirement. Loops are very helpful in most cases and save a great deal of time and effort. There is various type of loops that are used in different situations as explained below:

For Loops
For loops are used where some code is to be repeated a number of time that can be predetermined by giving it specific instructions such as
```
for (let i=1; i<=6; i++){
    console.log("Da ba dee da ba daa");
}
```

While Loops
While loops are used where it cannot be pre-determined how many times the code will actually run. In while loops, the code keeps repeating "while" the given condition is not satisfied as shown below
```
while (i < 10) {
  text += "The number is " + i;
  i++;
}
```
Contentful Changes: Phrase full-text search, GraphQL Richtext
Published: 2021-02-10 17:49:12


Every month [Shy](https://twitter.com/shyruparel) from the Contentful Dev Rel Team shares his favorite changes from the [Contentful Changelog](https://www.contentful.com/developers/changelog/). This January he's sharing a visual reference of the [Contentful web app](https://www.contentful.com/developers/changelog/#a-visual-refresh-of-the-contentful-web-app​), updates to [RichText in GraphQL](https://www.contentful.com/developers/changelog/#existence-and-search-term-filter-for-richtext-field-type​) and support for [Full Phrase search](https://www.contentful.com/developers/changelog/#search-for-entire-phrases-using-double-quotes​).
Functional Programming in Dart
Tags: dart, functional, crossplatform
Published: 2021-02-10 17:37:22

---
title: Functional Programming in Dart
published: true
description: With dartz
tags: dart, functional, crossplatform
cover_image: https://images.unsplash.com/photo-1607166857790-c63f199b1317
---
> ⚠️ This article was deprecated. ⚠️
>
> Check out the updated full article on my personal [blog](https://marcossevilla.dev/functional-dart).

You can find even more and keep in contact with me on my socials:

- [GitHub](https://github.com/marcossevilla)
- [LinkedIn](https://www.linkedin.com/in/marcossevilla)
- [Twitch](https://www.twitch.tv/noscopedevs)
- [Twitter](https://twitter.com/MarcosJSevilla)
- [YouTube](https://www.youtube.com/noscopedevs)
Javascript Array Methods Part 1
Tags: javascript, frontend, webdev, fullstack
Published: 2021-02-10 17:16:39

# Javascript Array Methods
>Arrays in Javascript provide a lot of methods, To make things easier.

## Add Items
There are many ways to add items in an array Like:
* push
* unshift

<br/>
We use push method to add items to the end of an array.

```
let arr = [1,2,3,4];
arr.push(5);
console.log(arr); // [1,2,3,4,5]

```
And, The second method is unshift is used for add items to the beginning.

```
let arr = [2,3,4];
arr.unshift(1);
console.log(arr); // [1,2,3,4]

```
## How to delete an element from the array?

For delete any element form an array the is a `arr.splice()` method.

Let's know the syntax of `splice()` method:
```
let arr = [1,2,3];
arr.splice(startIndex, num_of_items, ...addItems);

```

Now if we have an array like this:
```
let names = ['Ahmed', 'Mohamed', 'Mahmoud', 'islam'];
```
And, we need to delete any items. Easily we use `splice()` method like this:

```
names.splice(0,1); // here we say please start from index 0 and delete one item.
console.log(names); // ['Mohamed', 'Mahmoud' , 'islam']

let removed = names.splice(1, 1); 
console.log(removed); // ['Mahmoud']


```
> we can add items after with delete items.


```
let arr = ['hello', 'world'];
names.splice(0,1, ...arr);
console.log(names); // ['hello', 'world', 'Mohamed', 'Mahmoud', 'islam']

```

<hr>

> If you need to read the other parts of this article follow us:

Facebook Page : <a href="https://www.facebook.com/semantic.code" title="Semantic Code" target="_blank">
Semantic Code</a>

Hashnode :  <a href="https://semantic-code.hashnode.dev/" title="Semantic Code" target="_blank">
Semantic Code</a>
 dev.to :  <a href="https://dev.to/ahmedibrahimgalal" title="Ahmed Ibrahim" target="_blank">
Ahmed Ibrahim</a>
Find and remove docker image
Tags: docker, devops
Published: 2021-02-10 17:15:13

Docker documentation mentions [removing all stopped containers][1] using command:
```bash
$ docker rm $(docker ps -a -q)
```
but at times we want to first find existing containers and then remove them. This can be achieved when you filter and limit the result of `docker ps` command.

## Limit the result of `docker ps`
You can either use the [`--filter`][2], [`--last`][3] or [`--latest`][3] options or pipe the result of `docker ps` to `grep` command to filter the results for matching _PATTERN_.

Here is an example using `grep`:
```bash
$ docker ps -a | grep PATTERN | \
  awk '{print $1}' | xargs -r docker rm
```
where the _PATTERN_ could be part of container name, image name or any other details present in the result of `docker ps` command like mapped port number.

Feel free to share your feedback/opinion in comments.

---
<span>Photo by <a href="https://unsplash.com/@boxedwater?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Boxed Water Is Better</a> on <a href="https://unsplash.com/s/photos/ocean?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></span>

[1]: https://docs.docker.com/engine/reference/commandline/rm/#remove-all-stopped-containers
[2]: https://docs.docker.com/engine/reference/commandline/ps/#filtering
[3]: https://docs.docker.com/engine/reference/commandline/ps/#options
7 Steps to Create a Successful Multi-Vendor Marketplace
Tags: ecommerce, onlineshopping, webdev, marketplace
Published: 2021-02-10 17:01:05

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

Once you decide to create your own multi-vendor marketplace, you should remember that you’ve chosen quite a competitive business model. 

On the one hand, multichannel approach is highly popular among online merchants nowadays, so there is a great demand in online marketplaces. On the other hand, demand generates supply, so, no wonder, there is a diversity of available marketplaces. It means before you start you should consider every detail in depth.

### Meanwhile, here are 7 essential steps to follow to build a powerful online marketplace:

1. **Choose your niche and analyze your rivals**. If you look at some leading online marketplaces, every multi-vendor marketplace belongs to a particular business segment. Choosing the right business niche that might be relevant in a few years has a direct impact on your profit. Analyzing your competitors is also a useful activity. Like the saying goes, *“know your enemy to win!”* Probably, this example is too radical, but there is always a bit of truth.


2. **Select your website and domain name**. Your online marketplace name is like a banner above the entrance to your store. It should reflect your business specifics and arouse the interest. 


3. **Decide on functionality and monetization methods of your marketplace**. Here are some basic features every marketplace must have: integration with social media, customer reviews, wish lists etc. Nevertheless, it’s a classical set. If you want to attract more customers and provide a seamless shopping experience, you should think about some extra features.


4. **Consider promotion campaigns**. It’s necessary to think of how you will engage your target audience long before you launch your marketplace. 


5. **Find your development approach**. There are 3 major website development approaches: development from scratch, ready-to-use open-Image Source, CMS-based development. Each type has its own nuances, but CMS-based development can be considered a golden mean between two other approaches.


6. **Calculate your budget**. Certainly, your business idea and its realization plan should correspond to your budget. 


7. **Test your multi-vendor marketplace**. On this stage MVP (minimum viable product) should be created. It allows you to display your newly-minted marketplace for the entire world to see, so you could collect user references and, relying on this data, detect vulnerabilities and resolve them.

[This article](https://dinarys.com/blog/multi-vendor-marketplace) provides more extensive information on each of these steps. Welcome!
I built a box-shadow generator
Tags: showdev, css, webdev, news
Published: 2021-02-10 16:55:52

[https://shadows.joeczubiak.com](https://shadows.joeczubiak.com)

I built an open-source CSS box-shadow generator this week.

I was trying out WebFlow the other day and I noticed that like a lot of visual editors, it lets you specify an angle and distance on your box-shadows but both angle and distance aren't CSS attributes on box-shadow. So I decided to explore how angle and distance are converted to an x and y offset.

I started to write an article detailing the math behind it, turns out it's basic trigonometry and if I was still in 9th grade it would have been obvious, but before you know it and before the article was done I built and released my own CSS generator. 

It taught me a lot about shadows and was a good overall exercise that I hope will now live on to help others.
 
I found that a good shadow is built with layers and opacity and mimic real-world behavior. The ability to specify multiple layers in a box-shadow isn't intuitive and most box-shadow generators online don't allow multiple shadows to be specified. They also don't typically give you a great preview. This is where I tried to make mine different. I made it easy to add multiple shadows, the page and preview cards are customizable, and there are presets from popular frameworks. 

Take a look and let me know what you think. I built it this week so it's not totally polished and I'm open to suggestions.

Thanks!