teleren/devto huggingface dataset:
How to make Music Player in Python
Tags: python, tutorial
Published: 2020-08-02 07:29:36

Hello Programmers
Originally posted here with detail: https://www.codesnail.com/how-to-make-music-player-in-python/

```python
# Music player in python

from pygame import mixer

mixer.init()
# --------------------------Path of your music
mixer.music.load("PYAR-HUA-IKRAAR-HUA.mp3")
mixer.music.set_volume(0.5)
mixer.music.play()

while True:
    print("Press 'p' to pause")
    print("Press 'r' to resume")
    print("Press 'v' set volume")
    print("Press 'e' to exit")

    ch = input("['p','r','v','e']>>>")

    if ch == "p":
        mixer.music.pause()
    elif ch == "r":
        mixer.music.unpause()
    elif ch == "v":
        v = float(input("Enter volume(0 to 1): "))
        mixer.music.set_volume(v)
    elif ch == "e":
        mixer.music.stop()
        break

# Follow @code_snail
```

For more detailed and step by step visit: [How to make music player in Python](https://www.codesnail.com/how-to-make-music-player-in-python/)
How To Write a Good JavaScript Code
Tags: javascript, todayilearned, codenewbie
Published: 2020-08-02 06:59:42

### In this Blog, we gonna tell you the best way to write a javaScript code which I learned till my learning journey.

### So, I gonna discuss 5 points which I used to write my javaScript code and it is very helpful for me to read and update my previous codeBases. And these tips can also helpful for you. So, please read once if you are a JS developer or gonna be a JS developer.

***
![pretty js code](https://dev-to-uploads.s3.amazonaws.com/i/mx6d8fpzn4em5qkzgvt4.png)

## 1. JavaScript is CaseSensitive
### This means when You use your `Shift` or `CapsLock` keys it really matters. Unlike in **HTML** and **CSS** Where you can use UPPER and lowercase letters, But in JS the casing of the words matters.
**Example:-**
```javascript
var greenDuck ="This Duck is Green";
console.log(greenduck);
```
`Above code will show an error`
```
Uncaught ReferenceError: greenduck is not defined.
```

## 2. Use `camleCase` Words
### practice of writing phrases such that each word or abbreviation in the middle of the phrase begins with a capital letter, with no intervening spaces or punctuation. Common examples include "iPhone" and "eBay".
```javascript
//variable starts with a Lowercase letter
var greenDuck;

//objects and classes start with UpperCase letter
var date = new Date();

//Constants are All-Caps
const NAME;
```

## 3. WhiteSpace Matters (for Human)
### JavaScript doesn't care about whiteSpaces but as a human, you should. So, use whiteSpaces in your code for make it more readable for humans. It is useful when you work with a team.
```javascript
//With whiteSpaces(human readable)
var date = new Date();
document.body.innerHTML = "<h1>" + date + "</h1>";

//without whiteSpaces (machine Readable difficult for humans)
var date=new Date();document.body.innerHTML="<h1>"+date+"</h1>";
```

## 4. End Each Statment with a SemiColon(;)
### Technically javaScript doesn't care you use a semicolon or not except some specific situations. But if you do not use it then your code is difficult to be read for humans. So, Good practice is to use a semicolon at the end of your statement in your codebase.
* Semicolon is just a matter of opinion
`Do What Works best for you`

## 5. Use Comments Liberally.

```javascript
// A single line comment starts with two slashes.

/* A multi-line comment
starts with a slash and an asterisk
and ends with an asterisk and a slash */
```
***

## This is the end. if you found this blog post helpful then, please comment and give a reaction.
What's the best CMS for Gatsby blog?
Tags: discuss, gatsby, react, cms
Published: 2020-08-02 06:49:18

Recently I've started learning Gatsby. It's a really good framework for static website. 

Currently, my blog [Code Eureka](https://codeeureka.com/) is hosting in WordPress which I don't like at all because of many plugins for every new component.😪

I'm planning to make a new blog website using Gatsby. But the problem is which CMS should I use for my Blog? There are many CMS for Gatsby blog,

[strapi](https://strapi.io/)
[contentful](https://www.contentful.com/)
[netlifycms](https://www.netlifycms.org/)
[prismic](https://prismic.io/)
[ghost](https://ghost.org/)

Help me out.😁 
Thank you.
SCSS Mixins
Tags: css
Published: 2020-08-02 06:34:07

Let's get a closer look at using `@mixins` in `SCSS`. You can look at mixins like the [import](https://daily-dev-tips.com/posts/scss-import/) we used before. But mixins place a certain set of codes on the element we are mixing in.

## Defining our Mixin

We use the `@mixin` directive to define our mixin, so let's go ahead and create our first one:

```css
@mixin flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}
```

> Note: Naming in SCSS can be either with - or \_ they are considered the same and can be used at the same time!

## Using our Mixin

To use our mixin we simply use the `@include` statement:

```css
.container {
  @include flex-center;
  height: 100vh;
}
```

Our properties on the mixin will now also exist on the container element.

## Mixin inside a Mixin

Another cool thing we can do is use mixins inside each other like so:

```css
@mixin font {
  font-family: Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-size: 2rem;
}
@mixin flex {
  display: flex;
}
@mixin flex-center {
  @include flex;
  @include font;
  justify-content: center;
  align-items: center;
}
```

## Mixin and Arguments

Something that is really strong for using mixins is the use of arguments.

We can define our mixin as such:

```css
@mixin button($background: blue, $padding: 10px, $color: #fff) {
  background: $background;
  padding: $padding;
  display: block;
  border-radius: 5px;
  color: $color;
}
```

> Note: We added default parameters, but these are not mandatory, you can leave them out.

And once we call it, pass these arguments:

```css
.box {
  @include button(#7afdd6, 20px, #ffffff);
}
```

## Pro-tip

A really good pro-tip is to use Mixins for vendor prefixes!
It will safe you so much time for border-radius for example:

```css
@mixin border-radius($amount) {
  /* Safari 3-4, iOS 1-3.2, Android 1.6- */
  -webkit-border-radius: $amount;
  /* Firefox 1-3.6 */
  -moz-border-radius: $amount;
  /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
  border-radius: $amount;
}
```

And we use this like so:

```css
@include border-radius(20px);
```

Have a play around with these examples on Codepen.

<p class="codepen" data-height="265" data-theme-id="dark" data-default-tab="css,result" data-user="rebelchris" data-slug-hash="oNbKbGP" style="height: 265px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;" data-pen-title="SCSS Mixins">
  <span>See the Pen <a href="https://codepen.io/rebelchris/pen/oNbKbGP">
  SCSS Mixins</a> by Chris Bongers (<a href="https://codepen.io/rebelchris">@rebelchris</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>

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

### Thank you for reading, and let's connect!

Thank you for reading my blog. Feel free to subscribe to my email newsletter and connect on [Facebook](https://www.facebook.com/DailyDevTipsBlog) or [Twitter](https://twitter.com/DailyDevTips1)
Knowing Probability Distributions…
Tags: statistics, probability, datascience
Published: 2020-08-02 06:32:45

A *probability distribution* is a function that describes the chances of finding a random variable over a defined range.

Below is the list of some of the most used probability distribution functions.

• Normal(Gaussian) distribution.
• Log-Normal distribution.
• Bernoulli distribution.
• Binomial distribution.
• Poisson distribution.

Today let’s see what are Bernoulli, Binomial and Poisson distribution.

### Bernoulli distribution:-
The distribution of random variables which can take up two values, i.e. either success(1) or failure(0) is called a Bernoulli distribution. Some examples are coin flip, whether a patient tested has cancer or not, etc.

Consider we have a random variable X, which follows Bernoulli distribution. It can be denoted as; **X~Ber(p)**

>
The probabilities are given as:-
For success: P(X=1)=p
For failure: P(X=0)=1-p
The standard deviation is given by; Standard Deviation=√[p(1-p)]
Variance is the square of standard deviation and hence Variance=p(1-p)
The expectation for Bernoulli distribution is given as E[X]=p

### Binomial distribution:-
A binomial distribution is a distribution of random variables that represent the number of success or failures in 'n' successive independent trials of a Bernoulli experiment. Examples include coin flips for a particular ’n’ number of times, result whether 'n' number of patients have hypertension or not.

Thus we can say that binomial distribution is some complex version of Bernoulli distribution.

Suppose X is a random variable following Binomial distribution. It can be denoted as- **X~Bin(n,p)**

>
Probability is given as below-
Expectation E[x]=np
Variance is given by var(X)=np(1-p)

### Poisson distribution:-
The Poisson distribution is the special case of binomial distribution where p → 0 and n → ∞.

It is used when we have to express the probability of a given set of event occurs in a fixed time interval or a constant space with a fixed mean rate. In addition to this, the event happening should be independent of the time since the occurrence of the last event.

>The probability function is given as;
Expectation E[X]=λ where np → λ as p →0 and n →∞.
Here Standard Deviation=√λ
Limitation Of HTTP/2 That Led To HTTP/3: Explained with Example
Tags: tutorial, quic, codenewbie, http3
Published: 2020-08-02 05:26:42

{% youtube AIDkSTiknLg %}
In this video, We will discuss the limitation of http2 that led to http/3, http/3 will solve the TCP level Head Of Line Blocking.


------------------------------SOCIAL------------------------------
Github: https://github.com/codingx01
Twitter: https://twitter.com/TechParida
Linkedin: https://www.linkedin.com/company/codingx/
Facebook: https://www.facebook.com/codingx
Instagram: https://www.instagram.com/coding.x/

Leave any questions in the comments section and don't forget to subscribe to be notified of new content! :)
kmastore.id
Tags: kmastore
Published: 2020-08-02 05:06:30

/* http://kmastore.id/feed
/* https://apk.siterubix.com/feed
   v2.0 | 20110126
   License: public (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
Data Structures [Arrays] 
Tags: datastructures
Published: 2020-08-02 04:58:34

---
title: Data Structures [Arrays] 
published: true
description: 
tags: datastructures
//cover_image: https://direct_url_to_image.jpg
---

Hello there friends, this past week officially started with my job search, which means that I need to start trying to improve what I feel is my weakness so for me was an easy answer data structure 😅. So let's start.

##What is an array##
An array is a linear data structure consisting of a collection of elements which are stored in contiguous physical memory locations and identified by an index, we have two different ways to work with arrays, onde dimensional and two-dimensional array.

##How we can iterate over one-dimensional array##
```javascript
function arrayTraversal(array){
  for(let i = 0; i < array.length; i++){
    console.log(array[i])
  }
}
```
How do you tackle CSS rendering differences?
Tags: webdev, discuss, css
Published: 2020-08-02 04:47:12

---
title: How do you tackle CSS rendering differences?
published: true
description: 
tags: webdev, discuss, css
cover_image: https://css-tricks.com/wp-content/uploads/2018/07/div-different-browser.jpg
---
When a browser renders an HTML page, it applies basic styles before you’ve even written a single style. 

While all browsers apply their basic styles, each browser has its specific styles different from other browsers, and that, of course, causes an inconsistency problem.

Which approaches do you use to tackle this problem?

Do you try to provide cross-browser consistency in the default styling by using some libraries like [Normalize CSS](https://necolas.github.io/normalize.css/)? 

Do you reset all the default browser styles completely using something like [Reset CSS](https://meyerweb.com/eric/tools/css/reset/) and then style everything from scratch?

Or do you write your own set of rules by using some kind of combination of rules from both approaches?
How to deploy web apps as a beginner ?
Tags: codenewbie, beginners, webdev
Published: 2020-08-02 04:29:41

Did you recently start learning web development and made your first or second web app but are now confused about how and where would you deploy it?
Then this article is for you.

I have tried to keep this extremely short to let you know just enough to get started quickly as I too understand the excitement of hosting your first few projects on the web.
Though there are tons of options out there ( both free and paid ) still we will be mainly looking at the two most popular and free ones:

1. Heroku – It is a platform that lets developers deploy, manage, scale web apps. It provides its own CLI which lets you use your terminal to track changes or deploy your code directly to Heroku after logging in. They provide a detailed and step by step guide for beginners as soon as you sign up and set up your account.
But if you still want to read their documentation in detail then click [here](https://devcenter.heroku.com/articles/)

2. Vercel – Vercel is also a platform to deploy and manage your web apps but the front-end part only. Though the steps are very easy. You just need to connect your Github account with Vercel and then choose the repository which has the project you wish to deploy. Once added, it will also keep track of any changes you’ll do in your master branch and will keep re-deploying the app with those changes. Just visit [Vercel](https://vercel.com/) and follow the steps.

After looking at the options, let us look at their use cases.
I use Heroku to launch my node apps or any other backend I build and Vercel for my static sites or front-end of my apps.
Now, if you’re looking to deploy a Fullstack app you might ask, “Why to deploy the front-end and backend separately? Why not host everything in one place ?”

The answer is simple. In a Fullstack app (where you are using some framework for your front-end), you need to run two commands, one for your front-end like *npm start* in case of React and one for your backend like *node index.js* but platforms like Heroku can not run both of these commands simultaneously on the same host whenever you visit your app's link. Hence we deploy our backend seperately and use that link to connect it to our frontend (you can use fetch functions or [axios](https://www.sitepoint.com/axios-beginner-guide/) for that).

Though this was a very brief article still I hope that I cleared the most basic stuffs required to deploy your app without confusing you much.
Wish you all the very best, Happy Coding.
Three Most Useful but least known List functions. | KnowYourKotlin 
Tags: android, kotlin, java, tips
Published: 2020-08-02 04:10:49

Hi #androidDevs, This is Androidbites where I try to break down a small concept into an understandable code snippet and share my learning experience with it.

hope you having a great Sunday morning! , make it more productive by spending some time over your Kotlin skills, It's very common practice to merge a list, find common elements in two lists, remove items of one list from other, very obvious interview questions, and problem-solving questions. Learn how they can be done using standard library functions.

![union-intersection](https://dev-to-uploads.s3.amazonaws.com/i/254nlyg241jwl3aodwtl.png)

## 👉 [AndroidBites|Three-List-Functions](https://chetangupta.net/union-intersect-subs/)

Hope to see you on the other side...

Until next time. Happy Hacking! 👩‍💻

Stalk Me 👀 :
[LinkedIn](https://bit.ly/ch8n-linkdIn) | [Medium](https://bit.ly/ch8n-medium-blog) | [Twitter](https://bit.ly/ch8n-twitter) | [StackOverflow](https://bit.ly/ch8n-stackOflow) | [CodeWars](https://bit.ly/ch8n-codewar) |[WorkX](https://bit.ly/ch8n-home) |[Github](https://bit.ly/ch8n-git) |[Instagram](https://bit.ly/ch8n-insta) |[Youtube](https://bit.ly/ch8n-youtube)
The Best Cloud for Kubernetes ?
Tags: kubernetes, devops, automation, cloudnative
Published: 2020-08-02 04:09:22

As a DevOps engineer, understanding how Kubernetes is cloud native is important. Kubernetes decouples our software from the infrastructure. It allows us to thinking less about scheduling, compute instances, health checks, load balancing, service discovery and more.

We can simply package our app in a container, and throw it at Kubernetes and then tell Kubernetes how we want the app to be distributed, scaled and it will keep it running.

When people ask me where is the best place to run Kubernetes, i always say LOCALHOST is the best. 

This is because it simply does not matter anymore.
As a developer, I run Kubernetes on Kind, or Docker for Windows.
Enable it with a click of a button.
With a small YAML file, I can run my app as if it's running in the cloud.

No matter the cloud, the YAML - where you fundamentally define how Kubernetes should run your app - is the same, regardless if you're on AWS, Azure or Google cloud.

As a DevOps engineer it really helps having a bit of knowledge on what it takes to get a Kubernetes in each cloud provider. Each having their own niche, features and challenges.

For that, I have started a series called "Kubernetes in the Cloud"

We cover all the basics to be learnt about running Kubernetes in:

* Microsoft Azure
* Amazon AWS
* Google Cloud
* Digital Ocean
* Linode

Check it out & Enjoy!

{% youtube 3jA9EfkSAUU%}
System Design 101: System Design Analysis of Google Auto-Suggestion Service.
Tags: softwaredevelopment, architecture, technology, programming
Published: 2020-09-06 05:21:48

---
title: System Design 101: System Design Analysis of Google Auto-Suggestion Service.
published: true
date: 2020-08-02 04:04:44 UTC
tags: softwaredevelopment,softwarearchitecture,technology,programming
canonical_url: https://codeburst.io/system-design-analysis-for-auto-suggestion-service-d28bf1701658
---

[![](https://cdn-images-1.medium.com/max/2600/0*bwTh8Z5GD2w444y7)](https://codeburst.io/system-design-analysis-for-auto-suggestion-service-d28bf1701658?source=rss-577e2119c7f2------2)

##How does Google provide auto-suggestion? 

Autosuggestion enables users to search for known and frequently searched words. As the user types in the Google search box, it tries to predict the query based on the characters that are entered and give a list of suggestions to complete the query. A lot of us wonder how this occurs in real-time. In this article, we will try to design an autosuggestion service!!

[Continue reading on codeburst »](https://codeburst.io/system-design-analysis-for-auto-suggestion-service-d28bf1701658?source=rss-577e2119c7f2------2)

**Those who do not have a medium account,[here is the link] (https://codeburst.io/system-design-analysis-for-auto-suggestion-service-d28bf1701658?source=friends_link&sk=875e5f07973048faf0ebb265be44daac)
String In Javascript | Javascript Crash Course
Tags: tutorial, javascript, webdev, codenewbie
Published: 2020-08-02 03:42:58

Hello wonderful person!
Thank you for clicking on this post. In this video, I will be talking about String In javascript. I hope that you learn a ton and if you have any questions, don't forget to ask me in the comments below.

Connect With Me:
Youtube: <a href="https://www.youtube.com/c/ShubhamSauravYT" target="_blank" rel="noopener noreferrer">ShubhamSauravYT</a>.
Twitter: <a href="https://www.twitter.com/hiShubhamSaurav" target="_blank" rel="noopener noreferrer">@hiShubhamSaurav</a>
Instagram: <a href="https://www.instagram.com/hiShubhamSaurav" target="_blank" rel="noopener noreferrer">@hiShubhamSaurav</a>
Facebook: <a href="https://facebook.com/hiShubhamSaurav" target="_blank" rel="noopener noreferrer">@hiShubhamSaurav</a>
O que é um Servidor e para que serve?
Tags: tech, cloud, server, servidor
Published: 2020-08-03 19:27:44

---
title: O que é um Servidor e para que serve?
published: true
date: 2020-08-02 03:31:02 UTC
tags: Tech,cloud,server,servidor
canonical_url: https://marquesfernandes.com/o-que-e-um-servidor-e-para-que-serve/
---

O conceito de servidor é muito claro para quem vem do mundo da tecnologia, mas se esse não é seu caso não se preocupe. Provavelmente você já escutou alguém falando sobre servidores, que algo está em um servidor na nuvem ou que deu problema no servidor. Mas, o que exatamente é um servidor? E para que ele serve?

## O que é um servidor

Um servidor pode ser definido como um software e/ou computador que fornece serviços específicos para um cliente. Provavelmente quando você escuta alguém falar de um servidor, ele está se referindo a uma máquina dedicada para executar um sistema ou aplicação, basicamente um servidor é uma máquina conectada a internet que recebe e responde solicitações e que normalmente está ligado 24 horas por dia, 7 dias por semana.

## Para que serve uma servidor

Nos servidores normalmente normalmente se encontram as aplicações que fornecem dados e serviços para o cliente. Vamos imaginar o serviço do Instagram por exemplo, existem duas maneiras de acessar esse serviço, através da internet ou do aplicativo mobile, podemos chamar eles de cliente, eles fazem requisições para os servidores de fotos, comentários e outras informações.

## Sistema operacional de um servidor

Os servidores normalmente possuem sistemas operacionais específicos, normalmente sem interface gráfica, pois focam todo a potencia computacional em executar a aplicação que hospedam. Eles são acessados pela famosa linha de comando, muito conhecida por leigos como a ferramenta dos hackers.

![](https://marquesfernandes.com/wp-content/uploads/2020/08/image-5-1024x560.png)

A maioria dos servidores usam linux como seu sistema operacional, por exemplo o [Ubuntu Server](https://ubuntu.com/download/server) e [CentOS](https://www.centos.org/), porém algumas aplicações precisam ser rodadas no sistema operacional da Microsoft, e por isso existe uma versão Windows dedicada a servidor, o [Windows Server](https://www.microsoft.com/pt-br/windows-server).

Basicamente qualquer computador pode ser considerado um servidor, por exemplo, você pode pegar um computador velho e usar ele como servidor, instalar o sistema operacional específico e hospedar alguma aplicação. Servidores caseiros são muito utilizado por desenvolvedores de software.

## Como o Cliente se comunicada com o Servidor

A comunicação de um cliente com o servidor é feita através de protocolos da internet, existem diversos protocolos para usos específicos, o mais conhecido é o http://, protocolo que utilizamos para acessar uma página na internet.

O post [O que é um Servidor e para que serve?](https://marquesfernandes.com/o-que-e-um-servidor-e-para-que-serve/) apareceu primeiro em [Henrique Marques Fernandes](https://marquesfernandes.com).