teleren/devto huggingface dataset:
Grab Your Wine, Lets Demystify ML And NLP 🍷
Tags: azure, machinelearning, serverless, ai
Published: 2020-09-29 21:17:28


#### 📺 030 - Cassie Breviu 🎙️ Jason Hand

{% youtube i0vk-nKVGvo%}

In this episode we will learn how to use Machine Learning to predict wine prices, points, and variety from the text description. 

We will process the wine description text with the library "SciKit Learn" to create a Bag-of-Words Logistic Regression Multi-Classification model. 

If that didn't make sense then you are in the right place! 

If it did make sense join anyway because wine. 

After we build our models I will show how we deployed them using Azure functions and Static Web Apps.

### Useful Links

#### Learn
🔗 [Build AI solutions with Azure Machine Learning](https://docs.microsoft.com/en-us/learn/paths/build-ai-solutions-with-azure-ml-service/?WT.mc_id=allaroundazure-devto-cassieb)

🔗 [Create no-code predictive models with Azure Machine Learning](https://docs.microsoft.com/en-us/learn/paths/create-no-code-predictive-models-azure-machine-learning/?WT.mc_id=allaroundazure-devto-cassieb)

🔗 [Create machine learning models](https://docs.microsoft.com/en-us/learn/paths/create-machine-learn-models/?WT.mc_id=allaroundazure-devto-cassieb)

🔗 [Introduction to Azure Machine Learning](https://docs.microsoft.com/en-us/learn/modules/intro-to-azure-machine-learning-service/?WT.mc_id=allaroundazure-devto-cassieb)

#### Docs:
🔗 [What is Azure Machine Learning designer](https://docs.microsoft.com/en-us/azure/machine-learning/overview-what-is-azure-ml?WT.mc_id=allaroundazure-devto-cassieb)

🔗 [Azure Machine Learning documentation](https://docs.microsoft.com/en-us/azure/machine-learning/?WT.mc_id=allaroundazure-devto-cassieb)

🔗 [What is Azure Machine Learning?](https://docs.microsoft.com/en-us/azure/machine-learning/overview-what-is-azure-ml?WT.mc_id=allaroundazure-devto-cassieb)

🔗 [Azure Functions](https://docs.microsoft.com/en-us/azure/azure-functions/?WT.mc_id=allaroundazure-devto-cassieb)

More:

🔗 [Github Repo](https://github.com/cassieview/onnx-csharp-serverless)

🔗 [Grab Your Wine. It's Time to Demystify ML and NLP 🍷](https://dev.to/azure/grab-your-wine-it-s-time-to-demystify-ml-and-nlp-47f7)

🔗 [ONNX: No, it's not a Pokemon! Deploy your ONNX model with C# and Azure Functions](https://dev.to/azure/onnx-no-it-s-not-a-pokemon-deploy-your-onnx-model-with-c-and-azure-functions-28f)

### Learn more about Cassie Breviu

🔗 [@CassieView](https://twitter.com/cassieview)

🔗 [Cassie's Bio](https://developer.microsoft.com/en-us/advocates/cassie-breviu)


---

### Find Us On

📺 [Twitch](https://www.twitch.tv/microsoftdeveloper)

🔗 [Twitter](https://twitter.com/jasonhand)

☁️
Hacktober Fest 2020 - 5. Steps Pull Request
Tags: hacktoberfest, beginners, github, opensource
Published: 2020-09-29 20:34:52

As a coding beginner / newbie it can be very confusing at first. To handle a lot of new information can be very difficult. Many have problems with GitHub, so a short introduction to **Pull Requests** so that everyone can 
participate at the upcoming **Hacktober Fest 2020**.

#### What's Hacktober Fest?
Hacktoberfest is a monthlong celebration of open source software run by DigitalOcean.

Hacktoberfest is open to everyone in our global community! Four quality pull requests must be submitted to public GitHub repositories. You can sign up anytime between October 1 and October 31.🍂🎃🧟🕷️

#### What you need
1. A Computer 💻
2. Editor of Choise 🗒
3. Internet 🌐
4. Coffee ☕️
5. or Mate 🧉

... and a lot of fun 🙌

#### 1. Fork
The first step is to search for a good Repro which one you want to work on. If you found a Repro than you have to **Fork** the Repro. Forking means that you create a _"Copy"_ of this Repro to your GitHub account. After that you have to **Clone (Download)** the Data to your Computer. 

#### 2. Code
The second step is to **Code and work with the Cloned Files** on your Computer. You can use every Editor of your choise like **VSCode, Atom, Brackets, Sublime etc**. After you create a **meaningful Update** you have to Commit this Update to your GutHub Repro.

#### 3. Commit
You create an awesome piece of Code, now you **commit** this, with a small declaration of what you have done with the Code, to your GitHub Repro in your Account. The best way you can do this if you use a program like **GitHub Desktop, GitKraken or GitAhead**. With these progamms you can see **all previously published commits**. After the commit you have to Push this commit to your Repro.

#### 4. Push
To **Push** _"Upload"_ the commit, means that you transfer the changes to your forked Repro on your GitHub Account. When the Push was sucessful, you see this on the forked Repro Page. 

#### 5. Pull Request
At the End you have to open a **Pull Request** on the Repro you forked before. When you open a **Pull Request** to the maintainer of the Repro you should discribe clearly what you have changed as a comment in the Pull Request. 

The maintainer will be informed about your Pull Request and **Review your Code changes**. If you make a **meaningful Update** to the Project the Repro Maintainer will accept and integrate your Pull Request. 

#### How I get a limited T-shirt? 👕
To get a limited T-shirt and more goodies after the Hacktober Fest 2020 you have to make and create 4 meaningful Pull Requests. 

_Only the first 70.000 participants who successfully complete the Hacktoberfest challenge get a T-shirt._

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

I wish all **Hacktober Fest 2020** participants a lot of fun and of course Happy Hacking.🦥

#### Links
* [Hacktober Fest 2020](https://hacktoberfest.digitalocean.com/)
* [Hacktober Fest FAQ](https://hacktoberfest.digitalocean.com/faq)
* [The first Pull Request](http://yourfirstpr.github.io/)
The 7 Most Popular DEV Posts from the Past Week
Tags: top7
Published: 2020-09-29 20:28:46

---
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 Tuesday 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. ❤️

---

### Ding-Dong, it’s AWS Awesomeness!

@pubudusj created an intelligent doorbell with AWS Serverless services + a Raspberry Pi — cool stuff!
{% link https://dev.to/pubudusj/how-i-created-a-door-bell-with-aws-serverless-3n9j %}

### Getting to the Core of NGINX

In this post, @hasone walks us through the configuration of NGINX and its core features. Handy to say the least!

{% link https://dev.to/hasone/all-about-nginx-configuration-https-ssl-http2-caching-1c0i %}

### Thinking Like a Black-Hat Hacker

@omerxx asks and answers a crucial question we should all be considering regularly: what do hackers do and use to find passwords and application secrets?

{% link https://dev.to/omerxx/how-hackers-steal-your-keys-and-secrets-45g2 %}

### Emmanuel Did Us a SOLID

If you are one of the many folks who understand one or two SOLID principles but scratch your head over the others, this post by @evrtrabajo is for you!

{% link https://dev.to/evrtrabajo/solid-in-php-d8e %}

### Fun With Switch!

Thanks for promising to share your progress as you animate your on-screen Nintendo Switch gameplay, @acupoftee! I can’t wait to see the rest!

{% link https://dev.to/acupoftee/nintendo-switch-box-shadow-gradient-practice-c4j %}

### Rolling Your Own Redux

@nas5w shares the instructions and encouragement you’ll want if you decide to write your own version of Redux! Great educational project idea here! 

{% link https://dev.to/nas5w/learn-the-basics-of-redux-by-writing-your-own-version-in-30-lines-1if3 %}


_That's it for our weekly wrap up! Keep an eye on DEV this week for daily content and discussions...and if you miss anything, we'll be sure to recap it next Tuesday!_
Hacktoberfest - Random Issue Picker
Tags: hacktoberfest, random, development, opensource
Published: 2020-09-29 20:26:24

The [Hacktoberfest2020](https://hacktoberfest.digitalocean.com/) is just around the corner, but where to contribute?

[Andreas Frömer](https://twitter.com/icanhazstring) has created a small tool that can help you. The "Random Issue Picker" selects a random issue from GitHub based on certain criteria. 

### Requirements for the tool:

* PHP 7.3+
* composer


### How to use it

```shell
$ git clone https://github.com/icanhazstring/random-issue-picker.git
$ cd random-issue-picker
$ composer install
$ bin/rip random:issue -l js --label hacktoberfest
```

This will then post information on the issue

```shell
Hamburger icon in dark mode
---------------------------

https://github.com/Ninja-Developers/Tech_Phantoms_website/issues/66


Hamburger icon in dark mode blends with the background. Icon color can be changed to white. 
```

Now you can copy/paste or click the link to the issue and start working and earn your hackathon T-shirt.

Have fun, and have a great Hacktoberfest.
Types To Your Discord Bot Command Arguments
Tags: discord, tutorial, javascript
Published: 2020-09-29 20:09:39

# Install Type Validator
`npm install --save discord-arg-validator`

## Look at structure
How you implement this package really depends on the structure of your bot and what framework you use. Typically, you would want to add the validation to the `execute` function of your command.

```javascript
const { validate, String, Number, YesNo } = require("discord-arg-validator");

module.exports = {
	name: 'foo',
	description: 'bar',
	execute(message, args) {
		validate(args, [String, Number, YesNo]).then(() => /* Command logic here */).catch(() => message.channel.send("Make sure you use the command correctly!")))
	}
}
```
You could also use `await` so you don't have to put your command login in a `.then()` chain.
All Glory to the Principle of Least Astonishment! ❤
Tags: principles, tip, architecture
Published: 2020-09-29 20:07:29

The [PoLA](https://en.wikipedia.org/wiki/Principle_of_least_astonishment) is one of my favorite principles and I wish it's known as much as the [KISS principle](https://en.wikipedia.org/wiki/KISS_principle), maybe even more. It's also a playful way to think about anything you want to create and is supposed to be used by others.

## Meet the PoLA

The idea behind it is straightforward - anything you create must not astonish or negatively surprise. As little WTFs as possible, which can help you to avoid bugs introduced by humans and provide a good user experience. This basically means to follow consistency, common user expectations and user's experience. The principle is universally applicable similarly as KISS and as a software developer I use it often to define interfaces, code behavior or in software architecture discussions

## An example

Let me demonstrate that on the famous Javascript comparison operator `==`. The comparison behaves this way for values `""`, `[]` and `0`:

```
>> [] == 0
true

>> "" == 0
true

>> "" == []
true
```

For these values it behaves like a [transitive relation](https://en.wikipedia.org/wiki/Transitive_relation#Examples). However when you replace `""` with `"0"`, `"0" == []` returns actually `false`:

```
>> [] == 0
true

>> "0" == 0
true

>> "0" == []
false
```

If you know all the necessary Javascript details this behavior might make sense to you, but for the rest of the humanity it, well... it totally doesn't. And that's the point. How does it break the principle of least astonishment specifically?

You might say that the last statement should be `true` so it follows the behavior of the rest of the comparisons, but I think to really follow the principle of least astonishment the rest of the comparisons shouldn't return `true` in the first place. They should either throw an exception (comparing something which isn't really comparable), return `undefined` (result of such comparisons shouldn't be really defined) or just return `false` (they are not really equal). This actually shows nicely PoLA since the right solution sometimes really depends on the context.

To be fair Javascript also has strict operator `===` which has less astonishing behavior, but hey, that wouldn't really demonstrate PoLA, would it? And `==` is the first thing which anyone coming from a different programming language would use.

## So...

The PoLA is a simple but really powerful principle. When designing with PoLA in mind it helps to explicitly consider more perspectives which leads to less bugs and problems.

Do you have any examples of PoLA violations? They are usually great lessons learned.
Perl Weekly Challenge #79,Task #1
Tags: perl, bitcounting
Published: 2020-09-23 19:35:37

## Task: Count Set Bits

You are given a positive number $N. Write a script to count the total numbrer of set bits of the binary representations of all numbers from 1 to $N and return $total_count_set_bit % 1000000007.

## Proposed Answer:

 Note that perl already has the capability to get a binary expression of an integer, just using the sprintf formatter %b, as in

```perl
my $binary_string = sprintf("%b", $number);
```


 We need to count how many "1"s are in the binary representation. There are many ways to do that in perl. We will use the return value of the transliteration internal function of perl (tr):

```perl
$amount_of_ones = $binary_string =~ tr/1//;
```

This will efectively remove all "1"s from our string, but most important, will return a scalar with the amount of substitutions done (i.e, number of 1s in the binary representation)

 Also we are supposed to truncate to a modulo 1,000,000,007 integer on every addition, probably avoiding any overflows on perl arithmetic for 32 bit perls (that number is a prime number often used for that purpose).

 So with all these considerations, our script will just be:

```perl
use strict;
use warnings;
use v5.20;

my $big_prime           = 1_000_000_007;
my $total_count_set_bit = 0;

for my $n (1 .. shift) {    # or $ARGV[0]
  $total_count_set_bit += sprintf("%b", $n) =~ tr/1//;
  $total_count_set_bit %= $big_prime;
}

say $total_count_set_bit;

```

As an example, you can use the script like this:

```shell
$> perl ch-1.pl 12345678
143433315
$> _
```
React Component Libraries
Tags: react, javascript, webdev
Published: 2020-09-29 19:47:03

# Material UI
React components for faster and easier web development, based on material design.

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

https://material-ui.com/

# Ant Design
Open source design react ui library.

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

https://ant.design/

# React Bootstrap
bootstrap is rebuilt for React, include Bootstrap components.

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

https://react-bootstrap.github.io/

# Blueprint JS
React-based UI toolkit for the web.

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

https://blueprintjs.com/

# Semantic UI React
UI components based off of the Semantic UI Framework.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/4k5s7nusp6u2blyblc35.JPG)

https://react.semantic-ui.com/

# Rebass
React primitive UI components built with styled system.

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

https://rebassjs.org/

So, which one you use?
Failover Proxy
Tags: iptables, linux, database, bash
Published: 2020-09-29 19:39:39

In case you ever think about failover proxy solution to migrate database from one server to another, consider failover proxy script, no need for HA Proxy at least for TCP based services:

```sh
#!/bin/bash

iptables -t nat -A PREROUTING -p tcp --dport $PORT -j DNAT --to-destination $TARGET:$PORT
iptables -t nat -A POSTROUTING -j MASQUERADE
```

We at [ScaleChamp](https://www.scalechamp.com/) utilising Failover Proxy to reduce downtime until DNS propagates to new master server.

While this solution do not provide session support and may require some retries for transactions on application level, it's still a simple and universal solution for many use cases. 

P.S.
Do not forget to enable ip forwarding via sysctl. Also in order to archive atomical iptables update consider ip namespaces (netns).
DynamoDB or PostgreSQL???
Tags: discuss, sql, postgres, aws
Published: 2020-09-29 19:20:23

I love both but don't know witch to use for my project!

I've already made the decision not to use *MySQL* but I also don't want to be locked when migrating out of AWS if I ever need to when using *DynamoDB*. Using *PostgreSQL* could potentially be more expensive in the start if I use AWS RDS!

A solution might be to have a LightSail or EC2 instance run both *PostgreSQL* and the application, but is this a good idea?

What do **you** think?
Day 32 of 100DaysOfCode
Tags: 100daysofcode, javascript, functional, codenewbie
Published: 2020-09-29 19:19:51

Today I started the Helsinki UNI full stack course and continued functional programming challenges at freeCodeCamp.

Also finally decided to finish the responsive web design landing page project. You can see it down below.

{% codepen https://codepen.io/Pyyconen/pen/qBEMqNQ %}

###What I did today:

####1. Started the Helsinki UNI full stack course
https://fullstackopen.com/en

####What I learned from it:
* Using Chrome dev-tools
* What different http codes mean

####1. Continued FCC functional programming challenges
https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/functional-programming/

####What I learned from it:
* Why use functional programming
* Meaning of side-effects and mutations
* What are pure functions
* Using map and filter

####Time spent learning:
Task 'Fullstackopen'. Elapsed time: 0 h 40 min 3 s
Task 'FCC'. Elapsed time: 1 h 1 min 3 s

#### Total time: 1 h 41 min 6 s
Time spent is tracked by my [TaskTimer](https://www.arttupyykonen.com/tasktimer/) script and the [WakaTime app](https://wakatime.com/about).


### Links and videos

Found this video which explains nice css tips! Going to try these out later.

{% youtube qm0IfG1GyZU %}

See you all tomorrow!
Como o PHP lida com a questão da segurança
Tags: php, security
Published: 2020-09-29 19:04:28

## O que é um problema de segurança?

O time do PHP classifica como problemas de segurança, bugs que:

* Permitem que os usuários executem ações não autorizadas;
* Cruzam os limites de segurança;
* Acessam dados que não deveriam ser acessíveis;
* Impactam severamente a acessibilidade ou desempenho do sistema.

O objetivo desta classificação é alertar os usuários e desenvolvedores sobre problemas que precisam ser tratados como prioridade.

## O PHP é seguro

Esta afirmação é possível com base no conhecimento do ciclo de vida de uma vulnerabilidade no PHP, em resumo o processo funciona assim:

* Uma possível vulnerabilidade é reportada;
* Então ela é avaliada por alguém do time ou um contribuidor externo/você que está lendo;
* Acontecerá uma discussão sobre o suposto bug;
* O problema é resolvido;
* Uma versão menor (por exemplo: 7.4.9), é criada contendo a solução, depois é possível ver no log de mudanças tudo que foi resolvido;
* Novas versões, são criadas em média a cada 4 semanas.

## Cuidando da segurança

* Mantenha-se informado, fique atento aos materiais que a comunidade disponibiliza;
* Sempre que possível atualize a versão;
* Observe todos os outros aspectos de segurança (códigos, sistemas operacionais, configurações, infra estrutura e o fator humano/engenharia social).

## Conclusão

Nenhum sistema é invulnerável, pois o fator humano sempre existirá. Entretanto é possível mitigar a maioria dos problemas que acontecem em softwares, mas isso requer um pouco de atenção e cuidados por parte de todos os envolvidos.

Deixe nos comentários o que você acha disso.

## Referências e links úteis

https://bugs.php.net/
https://wiki.php.net/security
https://www.php.net/supported-versions.php
https://www.php.net/eol.php
Production ready Django App in Amazon Lighsail
Tags: cloudcomputing, aws, deployment, apps
Published: 2020-09-29 19:01:29

This article is based in [this documentation page](https://aws.amazon.com/getting-started/hands-on/deploy-python-application/) and [this video](https://youtu.be/6p8tEIqvGoo) where Mike Coleman takes us how to deploy a Django application on Amazon Lightsail. It was also considered two articles from Bitnami ([Getting started with Django](https://docs.bitnami.com/aws/infrastructure/django/get-started/get-started/), and [Deploy a Django project](https://docs.bitnami.com/aws/infrastructure/django/get-started/deploy-django-project/)).

Read more about it here: https://weblog.tiagoperes.eu/production-ready-django-app-in-amazon-lighsail/
An annotation tool to help you read open source codes
Tags: opensource, github, sideprojects
Published: 2020-09-29 18:56:46

I'm so excited to introduce my side project [wonder.codes](https://wonder.codes), which is a tool to make annotations when you read open source codes, you also can organize your annotations in topics and publish them, to share your knowledge to the open source community.

Hope you like it, and feel free to comment if you have any questions or problems when use it.
10+ Radio Button CSS style Examples
Tags: javascript, webdev, beginners, css
Published: 2020-09-29 18:48:32

---
title: 10+ Radio Button CSS style Examples
published: true
tags: javascript, webdev ,beginners, css
---
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/c260ismydk1rj54ykvpt.png)

<b>30+ Radio Button CSS style Examples</b>
<b>https://gscode.in/radio-button-css/</b>



<p>1.Try selecting all three options! 😉 Feel free to share this little form with new clients! 😅</p>

<p>The classic iron triangle was recently shared with me in a chat and I figured I'd put together a little form component for it.</p>

<p>Instead of wiping only one option it resets, so you could in theory extend the component to work as a multi option <code>radio</code> button 👍</p>

<p>Enjoy!</p>

{% codepen https://codepen.io/jh3y/pen/oJyzdp %}

<p>2.Tired of boring ole' radio buttons? Why take a peek at this wondrous mystique.</p>

<p>Brought to you by the Hamburger Network.</p>

{% codepen https://codepen.io/sodapop/pen/GpgEeE %}

<p>3.It only takes 2 seconds to make a selection.</p>

{% codepen https://codepen.io/oliviale/pen/RwWaBdN %}

4.
{% codepen https://codepen.io/coswise/pen/abOBJJB %}


<p>5.Radio Button List with mouse hover moving marker on css3</p>

{% codepen https://codepen.io/vineethtrv/pen/xbyvmZ %}

<p>6.Simple CSS radio button to list and pick from a set amount of color options.</p>

{% codepen https://codepen.io/wildbeard/pen/eZZPZr %}


<p>7.Styled radio buttons that still allows for keyboard input (at least in Chrome).</p>

{% codepen https://codepen.io/kristofferh/pen/MyOKMo %}

<p>8.A range-click slider with a sliding dot indicator, labels, validity-conditional styling, and NO JS. Works 100% on JS-restricted sites.</p>

{% codepen https://codepen.io/brandonmcconnell/pen/Zqjdmg %}


<p>9.Custom radio button style using only CSS (SCSS) by taking advantage of sibling selectors and the: checked pseudo-class. </p>

{% codepen https://codepen.io/havardob/pen/dyYXBBr %}

10.
{% codepen https://codepen.io/gabrielferreira/pen/oYxNVy %}

<p>11.pure css option with native radio and checkbox</p>

{% codepen https://codepen.io/Aoyue/pen/MEPJEp %}

12.
{% codepen https://codepen.io/montechristos/pen/EPvOwJ %}

<h3>13. Sticky Radio Button</h3>

<p>Enjoy this flat and simple styling of radio button in only vanilla CSS :)</p>

{% codepen https://codepen.io/tomma5o/pen/grJyzL %}

14.Completely CSS: Custom checkboxes, radio buttons, and select boxes
{% codepen https://codepen.io/KenanYusuf/pen/PZKEKd %}

## Related Articles
<b>30+ Radio Button CSS style Examples</b>
https://gscode.in/radio-button-css/

<b>50+ CSS BUTTONS</b>
https://gscode.in/css-buttons/