teleren/devto huggingface dataset:
Machine Learning, classification explanation
Tags: python, machinelearning
Published: 2019-07-19 17:37:39

---
title: Machine Learning, classification explanation
published: true
description: python
tags: python, machine learning
cover_image: https://proxy.duckduckgo.com/iu/?u=https%3A%2F%2Ftse2.mm.bing.net%2Fth%3Fid%3DOIP.wpDngUiJFox-A7OJTqJvoQHaFj%26pid%3DApi&f=1

---
Do you have data? Machine Learning lets you play with data. In this article we'll use Python (<a href="https://pythonbasics.org/why-python-for-machine-learning/">Why Python for Machine Learning</a>)

Data can be classified with algorithms. So the first thing you need is data. You can measure objects and collect data on it.

For instance, suppose you have these measurements. (2 values for each measurement).

<img src="https://thepracticaldev.s3.amazonaws.com/i/5d2o7kuuslornmhm3nln.png">

From the look of it, there's clearly 2 classes.  An algorithm could find these two classes.

<img src="https://thepracticaldev.s3.amazonaws.com/i/p5k59xspxwvrh2gyxd8x.png">

Then you can predict the class, given two new measurements. So how do you know how well an algorithm works? is it accurate?

You can split the data set into a training set and a test set. Then you can run the algorihtm and measure the output. As the example below:

    #!/usr/bin/python3
    from sklearn import preprocessing
    from sklearn.model_selection import train_test_split
    from sklearn.datasets.samples_generator import make_classification
    from sklearn.svm import SVC

    import matplotlib.pyplot as plt


    X,y = make_classification(n_samples=600,n_features=2,n_redundant=0,n_informative=2,
                              random_state=2020,n_clusters_per_class=1,scale=100)

    plt.scatter(X[:,0],X[:,1],c='black')
    plt.show()

    plt.scatter(X[:,0],X[:,1],c=y)
    plt.show()

    X = preprocessing.scale(X)
    X_train, X_test,y_train,y_test = train_test_split(X, y, test_size=0.3)
    clf = SVC()
    clf.fit(X_train, y_train)
    print(clf.score(X_test, y_test))

Related links:
* <a href="https://scikit-learn.org/stable/index.html">Sklearn Machine Learning module</a>
* <a href="https://gumroad.com/l/MnRYU">Machine Learning with Python course</a>
* <a href="https://pythonbasics.org/machine-learning-classifier/">Classifier with sklearn</a>
I will post your project to 100 websites
Tags: showdev, productivity, discuss, testing
Published: 2019-07-19 16:48:06

Hi, in my newest experiment I'll do all the work for you and post your project to 100 startup-websites like GeekWire, AlternativeTo, WebWiki and so on. You only have to provide your information once and I'll do the rest. For verification purposes you'll receive the welcome emails from those sites and screenshots from me (of every submission).

You don't even need to create a single account (not even on my website)! https://launchpropeller.com/
Machine Learning Classification comparison
Tags: python
Published: 2019-07-19 16:46:24

---
title: Machine Learning Classification comparison
published: true
description: python, machine learning
tags: python
---
Classification is a task algorithms can do. Given a new sample, the classifier can decide what class it belongs to.

The algorithms we talk about are <a href="https://pythonprogramminglanguage.com/python-machine-learning/">Machine Learning</a> algorithms. 

These algorithms classify based on data. For instance, data is collected on the flower data set. 

<img src="https://proxy.duckduckgo.com/iu/?u=https%3A%2F%2Fcdn-images-1.medium.com%2Fmax%2F1600%2F1*1q79O5DCx_XNrAARXSFzpg.png&f=1">

Then based on these measurements and the algorithm, classification can be done.

These algorithms have a different performance. Some algorithms do better than others. The ideal is to have the classifier score as high as possible (near 100%), but classifiers don't always achieve that.

<img src="https://proxy.duckduckgo.com/iu/?u=https%3A%2F%2Ftse3.mm.bing.net%2Fth%3Fid%3DOIP.P2DUKQYyX-6gIycMun77rAHaEK%26pid%3DApi&f=1">

The Python module sklearn contains many implementations of algorithms

    from sklearn.ensemble import  RandomForestClassifier
    from sklearn.naive_bayes import MultinomialNB
    from sklearn.neighbors import KNeighborsClassifier
    from sklearn.linear_model import LogisticRegression

and many more. The program below evaluates how well they do the classification test for different algorithms. 

    #!/usr/bin/python3
    #coding=utf-8

    from sklearn import datasets
    from sklearn.ensemble import  RandomForestClassifier
    from sklearn.naive_bayes import MultinomialNB
    from sklearn.neighbors import KNeighborsClassifier
    from sklearn.linear_model import LogisticRegression
    import numpy as np
    from sklearn.model_selection import train_test_split

    # Load dataset.
    iris = datasets.load_iris()
    X, y = iris.data, iris.target

    # split data into training and test data.
    train_x, test_x, train_y, test_y = train_test_split(X, y,
                                                        train_size=0.5,
                                                        test_size=0.5,
                                                        random_state=123)

    clfs = {'random_forest' : RandomForestClassifier(n_estimators=50),
            'knn' : KNeighborsClassifier(),
            'bayes': MultinomialNB(alpha=0.01)}

    def try_different_method(clf):
        clf.fit(train_x,train_y.ravel())
        score = clf.score(test_x,test_y.ravel())
        print('the score is :', score)

    for clf_key in clfs.keys():
        print('the classifier is :',clf_key)
        clf = clfs[clf_key]
        try_different_method(clf)

Related links:
* <a href="https://scikit-learn.org/stable/index.html">Sklearn machine learning module</a>
* <a href="https://pythonprogramminglanguage.com/python-machine-learning/">Machine Learning with Python</a>
* <a href="https://pythonbasics.org/">Python tutorial</a>
Save time using SASS to create classes with variations
Tags: css, html, saas
Published: 2019-07-19 16:35:51

Last week, I had a problem.

I needed to define a class in HTML that would give me the margin according to the last char. But this last char wasn’t always the same, nor the place was the margin would be applied.

I wanted a class that would be margin-top-1, or bottom,or left or right and the last number would go from 1 to 5 rem.
I was using SCSS already but, I didn’t know how to do it.

God knows that I searched for an answer, but still could not find how that should be done.
Maybe I googled it wrong but I know the answer now, and I was not limited to the margin.
Now I use this everywhere.
Let’s see how I’ve done it.


We have all been there. We need to create a class with different variations so that we can use them in HTML. Although SCSS can save us a lot of work, it is still repetitive, it’s still boring.
Sometimes the best way to avoid repetitive tasks is by doing a repetitive function.
How? You ask.
Through a @for directive.

So let’s say that you need to define a CSS class to use in your HTML with some variables. Let’s say you wanted to define the class margin-(number) and the number would be the value in rem. Something like this:

![](https://thepracticaldev.s3.amazonaws.com/i/ygx296v5lyrhyhds5laf.png)



Well if you only wanted to define .margin-1 there is no need to make a loop. You can simply write it like this but, let’s say for the sake of this article that you would want to define margin all the way to the 100rem. That is the beauty of SAAS.

You can define a starting point, an ending point and a @for directive to iterate through the numbers.

So, let’s see how does it look!

![](https://thepracticaldev.s3.amazonaws.com/i/ltjbefajmwyaeutel2ff.png)


And that’s it. after you compile it, it’s like if you have written 300 + lines of code.

![](https://thepracticaldev.s3.amazonaws.com/i/zsxc4uwkwmb235pkjgrs.png)

Won’t post the full CSS here because it’s too large, but you get the idea if not open your text editor and try it yourself.
And now you can use the margin class on your HTML as you like.

![](https://thepracticaldev.s3.amazonaws.com/i/ulxttlw2st8qs9tloztf.png)

But what if I want to define the top or bottom or any other?
Well, in that case, you should define the variables, and create other classes.

Still can use the same directive.
The only difference is that you need to define top, bottom, left, right and auto. But in the end, it is the same that we have done above. You can use this for everything.

![](https://thepracticaldev.s3.amazonaws.com/i/gcb8sn1orngxxyn88har.png)

Here you go, with approximately 30 lines of code, you have compiled a CSS file with more than 2000 lines.

And the possibilities are endless, you can use this with almost all attributes, width, height, you name it.
Have fun!
Basics#1 Noob troubleshooting "go get"
Tags: noob, troubleshooting, go
Published: 2019-07-19 16:33:21

ISSUE

 - How do I tell npm to use the local install rather than the nvm global install to use the go command seen below?

INFO

    $ npm list -depth=0
    gopak@1.0.0 /home/user/go
    ├── git@0.1.5
    ├── go@3.0.1
    └── npm@6.10.1

    $ go get github.com/ethereum/go-ethereum
    Error: command is not recognized
    at /home/user/.nvm/versions/node/v12.6.0/lib/node_modules/go/node_modules/go-cli/lib/invoke.js:24:13
    at processTicksAndRejections (internal/process/task_queues.js:85:5)
    $ env |grep go
    OLDPWD=/home/delta/go/src/github.com/ethereum
    PWD=/home/user/go
    GOPATH=/home/user/go


I removed global go:

    $ npm uninstall -g go

Verified npm global to ensure removal:

    $ npm list -g -depth=0
    /home/user/.nvm/versions/node/v12.6.0/lib
    ├── browserify@16.3.0
    ├── ethers@4.0.33
    ├── ethers-cli@4.0.0
    ├── ganache-cli@6.4.5
    ├── jquery@3.4.1
    ├── lite-server@2.5.3
    ├── npm@6.9.0
    ├── npx@10.2.0
    └── truffle@5.0.27

Tried connecting again but it checks the nvm path, so of course it is expected to not find any go:

    $ go get github.com/ethereum/go-ethereum
    bash: /home/user/.nvm/versions/node/v12.6.0/bin/go: No such file or directory

Issue tied to nvm...


Checked env again:

    $ export GOPATH="$HOME/go"
    $ env |grep go
    OLDPWD=/home/user/go/src/github.com/ethereum/go-ethereum
    PWD=/home/user/go

I did try checking yesterday (6/19/2019) on stackoverflow > javascript chat room, but did not get tracktion.

FIX:
Remember that online tuts do NOT "dockerize" information, some must be gathered around. 
Install go , instructions https://golang.org/doc/install?download=go1.12.7.linux-amd64.tar.gz
Documentation Overhaul - Our Startups Sprint
Tags: documentation, gitbook, programming
Published: 2019-07-19 16:32:10

Our team (4 developers) decided it was time to overhaul our docs. Therefore, we all stopped what we were doing and spent the week sprinting on building much better docs for WayScript (drag and drop programming language).

Here are the results: https://docs.wayscript.com/ 

As a startup that is constantly shipping, changing, and altering our software.. we are striving to make sure we prioritize always having the most up to date docs we can.
What programming skills are you learning right now?
Tags: discuss, learning
Published: 2019-07-19 16:25:13

---
title: What programming skills are you learning right now?
published: true
description: Are you working on improving your existing skills or learning new stuff? Let's talk about that and share good resources.
tags: discussion, learning
---

I guess the people on this site are quite eager in learning new things and improving. I'd love to know what skills (maybe it's building or consuming REST APIs, learning React Hooks or SQL) you are learning right now.

In the comment section, let's work together to help each other learn these things by sharing good ideas, articles, learning materials and so on.

I'm currently working on learning how Electron works and how sharing data between the main thread and renderers work. Mostly by trial-and-error.
Works on my machine
Tags: testing, beginners, debug, discuss
Published: 2019-07-19 16:22:45

---
title: Works on my machine
published: true
description: Practical response to "Works on my machine"
tags: Testing, Beginner, Debug, Discuss
cover_image: https://thepracticaldev.s3.amazonaws.com/i/piknw2ovvkhhbk7sg8yk.jpg
---

Originally posted on my blog:
https://www.dowen.me.uk/it-works-on-my-machine/

So, you just found this great bug and it's returned "cannot reproduce", or you have been told "it works on my machine", classic right?

As a tester, in this situation, it can be easy to get defensive. Am I being told I am making it up? Am I being disrespected, why should I raise bugs if they are not important enough to fix?

My suggestion, turn this on its head and consider this for a moment. Time to get technical! What details can be added to help identify the root cause of the issue? Can you do more investigation and help understand what is different between the environment you tested on, and the one the developer tried to reproduce it in?

Ways you could add value in response to "it works on my machine" in include:

1. Identifying the exact build or deployment you observed the issue on, and check is this the same build the developer is checking against? Can you check the build they are using, maybe the issue is already fixed, but you haven't been given the latest code?
2. Identify what platform are you both using. If it's web, make sure to check not only the Browser but the version of that browser. If it's mobile, what version of Android or iOS is installed?
3. Is there any additional logging you can get to help add context? If you can find an exception being thrown that is captured in a log, this can go a long way towards helping identify the issue.
4. If you can continue to reproduce the issue, can you give the developer access to your machine or environment? If you are remote, can you set up a screen sharing session? At a minimum, it should be easy enough to capture a video of the steps. for this, I use Open Broadcast Software Studio [https://obsproject.com/download](https://obsproject.com/download "https://obsproject.com/download"), but many alternatives exist.
5. If any of these have helped get to the root of the problem and get the bug fixes, try and use them more often in your usual bug reports, and see if you can reduce your "Works on my machine" count.

I hope my thoughts on this are useful, I am really interested to know if you agree, disagree, or even better have additional hints and tips! if you do, please let me know on twitter: [https://twitter.com/dowenb](https://twitter.com/dowenb "https://twitter.com/dowenb")
What was your win this week?
Tags: discuss, weeklyretro
Published: 2019-07-19 16:07:27

---
title: What was your win this week?
published: true
description: Got to all your meetings on time? Started a new project? Fixed a tricky bug?
tags: discuss, weeklyretro
cover_image: https://cl.ly/188e843c2985/download/Image%202019-02-15%20at%202.36.37%20PM.png
---

👋👋👋👋

Looking back on your week, what was something you're proud of?

All wins count -- big or small 🎉

Examples of 'wins' include:

- Getting a promotion!
- Starting a new project
- Fixing a tricky bug
- Cleaning your house...or whatever else that may spark joy 😄

![](https://media.giphy.com/media/l0IpWdz5FIJCEJO6I/giphy.gif)
I dreamt that I was coding
Tags: jokes
Published: 2019-07-19 15:45:04

---
title: I dreamt that I was coding
published: true
description: So one fine morning, I had this conversation with @picocreator. Him: I dreamt that I was coding this morning.
tags: jokes 
---

So one fine morning, I had this conversation with @picocreator:

```
Him: I dreamt that I was coding this morning.
Me:  Wow! That's awesome, you are productive in your sleep!
Him: No! It totally sucks!
Me:  Why?
Him: Coz' I didn't get to save my work! Q_Q
```

![Noooooo](https://thepracticaldev.s3.amazonaws.com/i/km8qbho3c82o6ye4g2y6.png)
<figcaption>When the power goes out (?) and you realised you didn't save your work. </figcaption>
Creating tabs with CSS only
Tags: webdev, css, experiments
Published: 2019-07-19 15:37:02

## [TL;DR] Here's the demo: [Codepen](https://codepen.io/Cadienvan/pen/PMoyrR)

### If you haven't already...
Take a look at my first post to proper understand the premise of the series: [Creating a lateral menu with CSS only](https://dev.to/cadienvan/creating-a-lateral-menu-with-css-only-3mmp)

### Let's go...
As I did in my last article, I limited the amount of work on UI and UX for the sake of simplicity, to provide a simple and usable solution that could be easily explained and understood.

### The HTML...
There you have it, simple and clean:
```
<!DOCTYPE html>
<html>
  <body>
    <!-- Our First Tab Trigger -->
    <label for="firstTab">Toggle First Tab</label>
    <!-- Our Second Tab Trigger -->
    <label for="secondTab">Toggle Second Tab</label>
    
    
    <!-- Our First Checkbox -->
    <input type="radio" class="radio-tab-toggle" name="tabTest" id="firstTab" value="1" />
    <!-- Our First Tabbed Content -->
    <div>First Tab</div>

    <!-- Our Second Checkbox -->
    <input type="radio" class="radio-tab-toggle" name="tabTest" id="secondTab" value="2" />  </body>
    <!-- Our First Tabbed Content -->
    <div>Second Tab</div>
</html>
```

### The CSS...
CSS is probably the shortest and simplest I ever written, 3 rules and we have our tabs:
```
.radio-tab-toggle{
  margin: -1px;
  padding: 0;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip: rect(0, 0, 0, 0);
  position: absolute;
}

.radio-tab-toggle + div {
  height: 0;
  overflow: hidden;
}

.radio-tab-toggle:checked + div {
  height: auto;
}

```
So there we have it.. By clicking on the trigger labels, we check our invisible checkboxes and, consequently, make our content visible.

## Level it up a bit..
The only issue I can see here is the lack of "close current tab" functionality. In fact, as far as I know, you can't "uncheck" a radio box group once you checked one of its components. So I guess we could level it up a bit via a simple JS snippet.

### The JS...
Third post, third time you ask for it. How do I have to tell you? 
```
JS = false;
```

### Conclusion...
Nice experiment, but limited to the lack of possibility to uncheck a checked radio-box without JS.

Give me a heart, a unicorn, or whatever you want! See you soon!
Automatically watch queries in Apollo GraphQL
Tags: apollo, graphql
Published: 2019-07-19 15:14:06

I just worked on one of our hooks that fetches data from our Apollo GraphQL server, but I noticed that my data won't be updated in the local cache when the current subscription is not open.

This is how my code looked like before:

```js
const chatId = '123456';

client.query({
  query: GET_CHAT_MESSAGES,
  variables: {
    chatId,
  }
}).then(res => {
  // do stuff here
})
```

This query would not update after being run once because Apollo saves all queries locally without knowing about potential changes.

When mutations were made, the chat view would still show an old state, even when my subscription would rewrite the cache.

What I had to do was using `client.watchQuery` instead of `client.query`. watchQuery allows you to watch a query for potential changes via mutations and re-run the query if needed. It also allows you to use the 'cache-and-network' fetch policy.

Now my code looks like this:

```js
const chatId = '123456';

const querySubscription = client.watchQuery({
  query: GET_CHAT_MESSAGES,
  variables: {
    chatId,
  },
  fetchPolicy: 'cache-and-network'
}).subscribe({
  next: ({ data }) => { // do stuff },
  error: (e) => console.error(e)
})
```

Just make sure to disconnect the subscription if it is not needed anymore with `querySubscription.unsubscribe()`.
What do you currently want to learn, but can't find good material about?
Tags: learning, teaching, journey
Published: 2019-07-19 15:07:50

---
title: What do you currently want to learn, but can't find good material about?
published: true
tags: learning, teaching, journey
---

Hey folks,

I'm looking for new topics to write about.

So are there any topics, that you want to learn, but can't find good material about?
Or perhaps there is some material, but it isn't organized that well?

Let me know! :)
Server-Side, data-driven animation & video rendering with nodejs.
Tags: node, nodecanvas, ffmpeg, weather
Published: 2019-07-19 14:56:16

---
title: Server-Side, data-driven animation & video rendering with nodejs.
published: true
description: 
tags: nodejs, nodecanvas, ffmpeg, weather
---

In this demo, we created a nodejs application generating weather forecast videos on-the-fly.

The dynamic weather data is loaded as JSON and presented on web canvas with animations. Using the node-canvas library and ffmpeg, the same canvas animation is rendered on server and exported as an mp4 video file.

Edit on 31 Aug 2020: 

The demo is now a fully working nodejs library. You can check it out from: https://github.com/pankod/canvas2video

{% youtube xv8M3ScElv0 %}
What Newsletters do you subscribe to?
Tags: discuss, newsletters
Published: 2019-07-19 14:55:14

---
title: What Newsletters do you subscribe to?
published: true
description: A discussion of newsletters that various developers subscribe to
tags: discuss, newsletters
---

I recently started learning React and I wanted to find a good newsletter to subscribe to so I can keep up on the latest React news. I came here to see if there was a discussion thread about newsletters that people follow and realized that there isn't. So here is a place to share newsletters that you follow, read, or even share yours if you run one. Please feel free to share any, even if they aren't specifically development related! Please also link to the site where people can sign up for it.

Here's my list of what I currently follow:

- [JavaScript Weekly](https://javascriptweekly.com/)
- [DB Weekly](https://dbweekly.com)
- [Vue.js News](https://www.getrevue.co/profile/vuenewsletter?utm_campaign=Issue&utm_content=forwarded&utm_medium=email&utm_source=Vue.js+News)
- [Morning Brew](https://www.morningbrew.com/daily/r/?kid=1ccb55) - General business news
Best way to write class methods in javascript?
Tags: discuss, javascript, productivity, beginners
Published: 2019-07-19 14:45:42

Can anyone tell which is the beat approach to write class methods in js and What are the pros and cons?

# First Approach

```javascript
class Dog {

    constructor(name) {
         this._name = name;
    }

    bark() {
         console.log(`hello ${this._name}`);
    }

}

```

# Second Approach

```javascript
class Dog {

    constructor(name) {
         this._name = name;
    }

}

Dog.prototype.bark = function bark() {
     console.log(`hello ${this._name}`);
}

```