teleren/devto huggingface dataset:
Learn react-testing-library for test react projects 
Tags: react, javascript, testing, jest
Published: 2021-02-19 15:35:50

Here I am  not going to give you the basic and usual tutorial for
Learn to test in reacting with use of jest and react-testing-library instead I going to list some resource and trick to get you to hand dirty and make ownself perfect to give 100 % coverage on Sonarqube.
Sonarqube is a code analysis tool to Catch bugs and vulnerabilities in your app, with thousands of automated Static Code Analysis rules. 
Sonarqube gives you an analysis of your test case as code coverage.
you can see your code coverage on the dashboard of your Sonarqube server.

while writing a test case you have right your code inside a describe blog and inside describe block you must use it or test function to write your test case.

#first Trick

I always get confused or stuck while writing my test case that how to select and specific element.
So for that, you can use this testing-playground [testin-playgorund ](https://testing-playground.com/) given by react-testing-library.

#second trick 

while writing test cases you have to write an assertion but some you get stuck that how we can test code so you can use the docs 
given by jest in the official documentation [expect](https://jestjs.io/docs/en/expect)
Monitorando SQS via terminal
Tags: aws, sqs, awscli, terminal
Published: 2021-02-19 15:27:20

### Introdução
Alguns de processos do [7Belts](https://7belts.com/?utm_source=nobeltdev) são feitos ássincronos, utilizamos filas para realizar a transferência e mensagens. Hoje utilizamos as funções de fila do SQS da AWS.

Desenvolvi um script para auxiliar na monitoria das filas, verificar o fluxo de mensagens e se a vazão delas está ocorrendo. O script funciona no terminal do linux no qual eu deixo uma aba abertar e vou observando os comportamentos da filas.

O código foi postado no [Github](https://github.com/joaofernandez/list-sqs-queues)

### Instalar o AWS-Cli

Primeiro passo é instalar o CLI da aws:
https://docs.aws.amazon.com/cli/latest/userguide/install-cliv2-linux.html

### Criar os arquivos de configurações
É necessário criar os arquivos de configuração que AWS-CLI vai utilizar como credencial para ler o SQS.

Precisa ter o **ACCESS_KEY**, **ACCESS_SECRET** e a **REGION**.

```bash
#!/bin/bash
$ aws configure
AWS Access Key ID [None]: ACCESS_KEY
AWS Secret Access Key [None]: ACCESS_SECRET
Default region name [None]: REGION
Default output format [None]
```

Paths dos arquivos gerados:
 - ~/.aws/config
 - ~/.aws/credentials

### Configurando as filas que vão ser monitoradas
Basta incluir a URL da fila no arquivo de configuração **configs/queues.config**.

Exemplo:
```bash
https://queue.amazonaws.com/80398EXAMPLE/MyDeadLetterQueue
https://queue.amazonaws.com/80398EXAMPLE/MyQueue
https://queue.amazonaws.com/80398EXAMPLE/MyOtherQueue
https://queue.amazonaws.com/80398EXAMPLE/TestQueue1
https://queue.amazonaws.com/80398EXAMPLE/TestQueue2
```

### Executar
Para executar o script basta executar o script **view-queues.sh**

```bash
$ chmod +x view-queues.sh # Caso precise a permissão de execução
$ ./view-queues.sh
+-------------------------------------+---------------+
| Queue                               | MessageCount  |
+-------------------------------------+---------------+
| queue_1                             | 15            |
| queue_2                             | 0             |
| queue_3                             | 0             |
+-------------------------------------+---------------+
```

### Utilizando o Watch
Um comando auxiliar para poder monitorar é utilizar o **watch** que executa um comando por períodos de tempo.

Exemplo:
```bash
$ watch -n 10 ./view-queues.sh 
```

A cada 10 segundos o comando ./view-queues.sh será executado automaticamente.
Brief Introduction to Machine Learning for Beginners
Tags: machinelearning, tutorial, beginners, python
Published: 2021-02-19 15:24:39


## Machine Learning
Machine Learning is the ability of Machines, that is, computers learn and improve from their past experiences or data without being explicitly programmed.

*PAST EXPERIENCES----->PATTERN RECOGNITION----->PREDICTIONS*

## Applications of Machine Learning:-
* Facebook NewsFeed
* Facebook Photo Auto-tagging feature
* Product recommendations by shopping portals
* Automatic recommendation of movies to watch on various platforms like Netflix, Amazon Prime, Hotstar, etc.

## Some of the Advanced Applications of Machine Learning:-
* Identifying Frauds in Banking
* Sentiment Analysis
* Amazon Go
* Chatbots
* Self Driven Cars

#### Apart from Commercial Applications, Machine Learning has a tremendous influence on the way data-driven research is done today.
* Finding distant Planets.
* Discovering New Particles.
* Analyzing DNA Sequences.
* Personalized Cancer treatment, etc.

## Why Machine Learning?
In the early days of *intelligent* applications used hand-coded rules of *if* and *else* decisions to process data or adjust to user input.

Think of a spam filter whose job is to move the appropriate incoming email messages to a spam folder. We could make a blacklist of words that would result in an email being marked as spam. This would be an example of using an expert-designed rule system to design an *"intelligent"* application.

## How Machine Learning Works?
Machine Learning is the ability of machines to learn from past experiences to make predictions or recommendations.
*Data is at the heart of Machine Learning.*

#### In Tradition, We give Input to the Program and get Output as the result.
 Input------>Program------>Output
#### But, In Machine Learning Model We give Data to the Machine Learning Model and get Intelligence(Algorithms, Rules) as a result.
 Data------>ML Model------>Intelligence

### Knowing Your Task & Knowing Your Data
Quite possibly the most important part of the Machine Learning process is understanding the data you are working with and how it relates to the task you want to solve. It won't be effective to randomly choose an algorithm and throw your data at it.

*It is necessary to understand what is going on in your data set before you begin building a Model.*

##### Note:-
Hey, I'm a beginner too. I'm sharing my journey. Hoping that someone might get benefit from this.
*If you have any suggestions or questions for me ask me in the comment section.*
Ping Pong Scorekeeper Widget
Tags: html, javascript, webdev
Published: 2021-02-19 15:17:57

After going through the basic JavaScript in the Web Developer Bootcamp course by Colt Steele, I moved on to functions and Document Object Model(DOM). Once I got enough practice with functions and manipulating DOM objects by doing the course's coding exercises, I decided to do a code-along project of a scorekeeper widget, specifically for Ping Pong. Bulma was used as a CSS framework for the styling of the widget.

Before adding the logic for the widget with JavaScript, basic HTML was added to layout the content on the page. A "Player 1" button, a "Player 2" button and a "Reset" button were added for manipulating the widget. A "select" was also added to determine the score up to which the game will be played.

You can check out the widget at vigorous-blackwell-9259c4.netlify.app.

Source code can be found at Github: github.com/saqibs3291/scoreKeeper_widget
Yeni başlayanlar için saz nasıl olmalıdır?
Tags: saz
Published: 2021-02-19 15:07:41

Saz; günümüzde kullanımı oldukça yaygın olan, nesilden nesile aktarılarak günümüze kadar gelen ve birçok kişi tarafından rağbet gören telli bir çalgı çeşididir. Yörelere ve ebatlarına göre değişik şekilde isimlendirilir. Sazın ne olduğu hakkında bilgi sahibi olmak için ve tarihçesini öğrenmek için saz nedir tarihçesi nedir adlı yazımızı okuyabilirsiniz. Saza merakı olan insanlar saz hakkında merak ettiklerini internet ortamında aramaktadır. Bu yazımızda size öğrenci sazının ne demek olduğu ve en iyi bağlamanın hangi ağaçtan yapıldığı hakkında bilgi vereceğiz.

Kaynak: https://www.asemuzik.com/muzik/yeni-baslayanlar-icin-saz-nasil-olmalidir/
Advantages and Disadvantages of Adopting PWA First Strategy
Tags: ecommerce, magento, pwa, pwafirst
Published: 2021-02-19 14:57:05

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d6ceieu9ivfv6tnzj77q.png)
A couple of years ago the Mobile First strategy was a priority for the majority of eCommerce companies. Nevertheless, everything changes very quickly, and recently the Mobile First was replaced with the PWA First approach.

PWA First is a concept that implies in developing a progressive web application as your entry into the market instead of building an iOS or Android mobile app. 

In some ways, the PWA First can be considered as a form of the Mobile First, but it’s not limited to a single platform or an app store. 

The main difference between PWA and a native mobile app is that PWA can be released on the web and it also doesn’t have to be installed. It means that online users can easily find a PWA and get fast access to it. 

Let’s investigate if the PWA First is a good solution exactly for your online business.

### PWA benefits:

* PWAs are **faster than a traditional website** due to the caching and request processing technologies;


* **Light weight**. For example, Twitter Lite PWA is only 600KB. In fact Twitter Android native mobile apps is 23,5MB; 


* The biggest advantage of PWA is its ability to **run in offline mode**;


* **Lower development cost**. If you are an online merchant, it would be much cheaper for you to create only one app that will fit any device, rather than to build several apps for each operating system;


* **Higher level of security**. PWA is based on the HTTPS protocol, which protects data from intercepting and spoofing.

### PWA drawbacks:

* **Limited features for iOS users**. Currently Android users can take more advantages of using PWA, as Safari browser doesn’t support progressibe web apps at all;


* **App store traffic**. App stores are a separate world with thousands of apps to choose from. As it was mentioned, PWA doesn’t require to be downloaded, so you will have to look for another way to reach your target audience;


* **Challenge of finding an experienced PWA developer**. The PWA First concept is comparatively young, which may become a reason there are still less professionals that will be ready to create a truly functional progressive web app for your business.

If you want to offer your customers exceptional mobile experience, you shouldn’t give up on the PWA idea. To learn more about it, you can visit [this article](https://dinarys.com/blog/magento-pwa-an-advanced-solution-for-boosting-ux-of-your-magento-store) that describes all basic aspects of Magento PWA development.
Class Design in Python: simple rules for managing complexity
Tags: python, design, classes
Published: 2021-02-19 14:56:51

Class design is tricky in any language. There is no substitute for careful consideration of somewhat abstract design principles and your specific use-case. But here is a formula that can be applied almost mechanically to simplify class design in Python, making your code easier to read, change and test.

For a full discussion, see this documentation (by the present author):

<https://python-coding-guidelines.readthedocs.io/>

Try making these changes to your class and see what you end up with:

* Remove all constants from the class to the module level or even better to a file called `constants.py`

* Remove class variables to the module level

* Remove all methods that do not access `cls` or the `self` parameter to the module level

* Make sure all module level functions are pure, i.e. they have no side-effects

* Make sure any instance variable if initialised via `__init__()` is type hinted as `Final` if the value will not change during the lifetime of the class instance

* If `__init__()` has a lot of variables (more than two or three), consider consolidating those variables into a
[Dataclass](https://docs.python.org/3/library/dataclasses.html) and pass that class instance as the sole parameter. Ensure that `dataclass` is frozen so none of its members can be changed.

* Make sure there are no variables that never change and are not set as parameters by the class user. These are constants. See above.

* If you are giving your class capabilities (like acquiring state via an external integration) from parameters to `__init__()`, make sure you have a factory function that is independent of your class, possibly in a file called `factories.py`. This factory function or class should construct the class for you.

Remember, `cls` and `self` parameter names are not keywords. They are conventions. 

What you should end up with are classes that are more appropriately sized, having the methods they actually need. The classes will be more readable (i.e. you can understand how state changes over time). And it should be easier to
write unit tests.

You might find by applying these rules that you remove all methods from your class. This is not necessarily a bad thing. There is a special case where the class might be implementing an interface and you need this interface implementation. It would be implementing an interface if it derives from an Abstract Base Class with methods you need on each subclass type. Then you have to decide what methods actually belong to that interface. 

In general, classes should manage state. They are not for namespacing only behaviour. Modules already perform that function.

If you would like to see a fuller example of these principles, full source code can be found here:

<https://github.com/paul-wolf/python_coding/tree/main/fish>

Photo courtesy of https://unsplash.com/@tahe
🚀10 Trending projects on GitHub for web developers - 19th February 2021
Tags: react, javascript, css, webdev
Published: 2021-02-19 14:56:39

Trending Projects is available as a weekly newsletter please sign up at [www.iainfreestone.com](https://www.iainfreestone.com) to ensure you never miss an issue.

### 1. React Simple Animate

React UI animation made easy. Animation from style A to B,CSS keyframes animation, Chain up animation sequences and a tiny size without other dependency

{% github https://github.com/bluebill1049/react-simple-animate %}

---

### 2. Hookstate

The simple but very powerful and incredibly fast state management for React that is based on hooks

{% github https://github.com/avkonst/hookstate %}

---

### 3. rich-markdown-editor

A React and Prosemirror based editor that powers Outline and can also be used for displaying content in a read-only fashion. The editor is WYSIWYG and includes formatting tools whilst retaining the ability to write markdown shortcuts inline and output plain Markdown.

{% github https://github.com/outline/rich-markdown-editor %}

---

### 4. Fabric.js

Fabric.js is a framework that makes it easy to work with HTML5 canvas element. It is an interactive object model on top of canvas element. It is also an SVG-to-canvas parser.

{% github https://github.com/fabricjs/fabric.js %}

---

### 5. TailwindCSS

A utility-first CSS framework for rapidly building custom user interfaces.

{% github https://github.com/tailwindlabs/tailwindcss %}

---

### 6. CASL

CASL is an isomorphic authorization JavaScript library which restricts what resources a given user is allowed to access

{% github https://github.com/stalniy/casl %}

---

### 7. React Static Tweets

Extremely fast static renderer for tweets.

{% github https://github.com/transitive-bullshit/react-static-tweets %}

---

### 8. bcrypt.js

Optimized bcrypt in plain JavaScript with zero dependencies.

{% github https://github.com/dcodeIO/bcrypt.js %}

---

### 9. Sass Boilerplate

A boilerplate for Sass projects using the 7-1 architecture pattern from Sass Guidelines.

{% github https://github.com/HugoGiraudel/sass-boilerplate %}

---

### 10. Devicons

An iconic font made for developers. Devicons contains 85 vectorized sharp glyphs . Devicons iconic font is free to use and licensed under MIT.

{% github https://github.com/vorillaz/devicons %}

---

Trending Projects is available as a weekly newsletter please sign up at [www.iainfreestone.com](https://www.iainfreestone.com) to ensure you never miss an issue.

If you enjoyed this article you can [follow me](https://twitter.com/iain_freestone) on Twitter where I regularly post bite size tips relating to HTML, CSS and JavaScript.
Module 5 - Responsive Design
Tags: html, css, javascript, scrimba
Published: 2021-02-19 14:47:51


So, another module of the [Scrimba tutorial](https://scrimba.com/learn/frontend) done and I learned a lot of things like:
* CSS Units 
* Flexbox 
 * display: flex
 * flex-direction
 * justify-content
 * align-items
 * flex-wrap
 * order 
* Media Queries
* Background Image
* Basic Transitions

I also did a ton of challenges *and* I also decided to make one last challenge for myself and because I am fond of *tutorials* I made **flexbox playground** so you can try out multiple properties. In order to learn even more I will try to include properties I don't know about so [**ENJOY**](https://dominikgorczyca.github.io/Flexbox-Playground/
)!

It took me a lot longer to do than I thought and I really understood that I'm only a beginner and I should use libraries which will ultimately help me make websites a lot faster. There were many things I didn't managed to do and those which I did are still far from perfect. I will take a short break and return to action!
How to do Firebase, NodeJS, ExpressJS API endpoint unit tests?

Tags: help, node, javascript, unittesting
Published: 2021-02-19 14:47:04

I'm lost, I have been searching for good resources but I can't find any. How to do unit testing for a back-end NodeJS, ExpressJS, Firestore, RESTful app? What tools to use? How to mock data? I don't want to have a test database for testing, I want to mock data. Can any one help me?

Example of an endpoint:
```
router.post("/color", async (request, response) => { 

    if(Object.keys(request.body).length === 0) return response.status(406).send("Ups... There was missing data.");

    try {
        await db.collection('Colors').add({
            realColor: request.body.realColor,
            colorMap: request.body.colorMap
        });
        response.status(201).send("Success! A color was creted!");
    }
    catch (error) {
        console.log(error);
        response.status(400).send("Ups... A color was NOT creted!");
    }
});
```
Day 20: Seven-segment display
Tags: 100daysofcode, java
Published: 2021-02-19 14:46:05

A seven-segment display is a form of electronic display device for displaying decimal numerals.

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

```java
public class Display {
    public static void main(String[] args) {
        Display pd = new Display();
            pd.setAssoc("5647");
    }

    public void setAssoc(String inputn) {

    String[][] nums = {
            { "+--+ ", "   + ", "+--+ ", "+--+ ", "+  + ", "+--+ ","+--+ ", "+--+ ", "+--+ ", "+--+ " },
            { "|  | ", "   | ", "   | ", "   | ", "|  | ", "|    ","   | ", "   | ", "|  | ", "|  | " },
            { "|  | ", "   | ", "   | ", "   | ", "|  | ", "|    ","   | ", "   | ", "|  | ", "|  | " },
            { "+  + ", "   + ", "+--+ ", "+--+ ", "+--+ ", "+--+ ","+--+ ", "   + ", "+--+ ", "+--+ " },
            { "|  | ", "   | ", "|    ", "   | ", "   | ", "   | ","|  | ", "   | ", "|  | ", "   | " },
            { "|  | ", "   | ", "|    ", "   | ", "   | ", "   | ","|  | ", "   | ", "|  | ", "   | " },
            { "+--+ ", "   + ", "+--+ ", "+--+ ", "   | ", "+--+ ","+--+ ", "   + ", "+--+ ", "+--+ " } };

              for (int i = 0; i < 7; i++) {
                  for (int j = 0; j < inputn.length(); j++) {
                           int index = inputn.charAt(j) - 48;
                           System.out.print(nums[i][index]);
                  }
               System.out.println();
              }
      }
}
```
How to start Web Development without having a PC
Tags: webdev, html, css, javascript
Published: 2021-02-19 14:25:20

Are you willing to trying your hands on Web Development but don't have a computer or laptop. Same pinch! This was me 8 months ago. I still don't have a pc yet i pretty confident with my front end skills. In these 8 months i made tons of projects!

I never knew that i could become a Front-end web Developer without having a PC.
To Start All you need is An Android Device and a strong will to learn.
(For IOS Users: You own a Iphone, you are rich enough to get a pc Bruh!)

So, First You need to download
<b>Spck Editor</b>. I have tried every code editors out there for mobile and i can tell that this is the farmost better than the rest. It's clean, efficient, easy to use!

You can Get that on Google Play store. For more comfort, you can buy a Keyboard and a OTG Cable so you can use the keyboard on your phone. 

Then i suggest browse a web development beginner course on Youtube or FreeCodeCamp.com, There are enough free sources for you to learn!

Lastly, if you want to check how your website look on bigger screens you can check that on this website 
http://www.viewportemulator.com/
Just host your website on github and paste the link in this website. You can check how your website looks in various screen sizes! 

Have a great future ahead!
30 Friday Stress Relievers For Programmers
Tags: webdev, javascript, jokes, react
Published: 2021-02-19 14:38:57



[![](https://cdn-images-1.medium.com/max/600/0*pr7K27UyYDYADsdJ)](https://js.plainenglish.io/30-friday-stress-relievers-for-programmers-fbcfede676f7?source=rss-795bd33d705------2)

Why programmers don’t Have Fun?

[Continue reading»](https://js.plainenglish.io/30-friday-stress-relievers-for-programmers-fbcfede676f7?source=rss-795bd33d705------2)
Hello, DEV!
Tags: hello, welcome, introduction, intro
Published: 2021-02-19 14:22:32

I thought I’d use my first post as a little introduction. I’m Paulina, I'm 23 and based in London, UK. In the summer I graduated with a degree in International Business but I realised that I wasn’t actually passionate about it and didn’t want to pursue it as a career. I felt really lost and it seemed like everyone around me had their “thing”, that they were passionate about and loved. Then I saw someone post about a course in coding and I thought f*ck it, why not? And I fell in love. I’ve since turned into a massive nerd and next week I’m starting an immersive, three month training to become a software engineer! I’m really excited to start this journey and my biggest dream is to one day work for Spotify. 

I’ve been thinking of starting a blog for a while however the little hater in my head always said “you’re bad at writing”, “what are you even going to write about”, “no one is going to read it anyway”. And then I found DEV and I think its a great place for me to start and practice my writing skills. One of the reasons why I decided to start a career in tech is the amazing community and everyone wanting to help each other. I really want to be a part of that so hopefully someone, somewhere will find something helpful! 

Outside of coding I love RnB 🎧, dogs 🐶, food 🍔 and art 🎨.
February 19th, 2021: What did you learn this week?
Tags: weeklylearn, discuss, weeklyretro
Published: 2021-02-19 14:21:37


It's that time of the week again. So wonderful devs, what did you learn this week? It could be programming tips, career advice etc.

<center>

![Yoda wooping someone's butt](https://media.giphy.com/media/yDYAHbqe5DfyM/giphy.gif)
</center>

Feel free to comment with what you learnt and/or reference your TIL post to give it some more exposure.

{%tag todayilearned %}

And remember, if something you learnt was a big win for you, then you know where to drop it as well.👇👇🏻👇🏼👇🏽👇🏾👇🏿

{%link https://dev.to/devteam/what-was-your-win-this-week-2m6d %}

<center>

![Little kid making a fist as if to say "Yes!"](https://media.giphy.com/media/6brH8dM3zeMyA/giphy.gif)
</center>