teleren/devto huggingface dataset:
Everything you want to know about SonarQube
Tags: codequality, sonarqube
Published: 2020-09-08 12:04:27

---
title: Everything you want to know about SonarQube
published: true
date: 2020-07-11 00:00:00 UTC
tags: CodeQuality,SonarQube
canonical_url: https://www.loginradius.com/engineering/blog/everything-you-want-to-know-about-sonarqube/
---

SonarQube is a very universal tool for static code analysis that has become more or less the industry standard. Keeping code clean, simple and easy to read is also a lot easier with SonarQube.

   
[Read On](https://www.loginradius.com/engineering/blog/everything-you-want-to-know-about-sonarqube/)
Laravel load anonymous components from packages
Published: 2020-07-13 09:07:08

---
title: Laravel load anonymous components from packages
published: true
date: 2020-07-10 23:14:49 UTC
tags: 
canonical_url: https://dcblog.dev/laravel-load-anonymous-components-from-packages
---

From Laravel 7 blade [components](https://laravel.com/docs/7.x/blade#components) are included. You may want to use these in packages.

For the components to be loaded from a package, the package service provider has to first load views from a folder and then use Blade::component to load the components.

Example:

In the package `src` folder create a folder called `components`

This example is for a fictional package called `Elements`

The service provider loads the files from the components folder and then uses Blade::component to load each one.

At the time of writing this, there is no way to automatically load components, the need to be loaded individually.

```
use Illuminate\Support\ServiceProvider;
use Illuminate\Support\Facades\Blade;

class ElementsServiceProvider extends ServiceProvider
{
    public function boot()
    {
        $this->loadViewsFrom( __DIR__. '/components', 'elements');

        Blade::component('elements::form-button', 'form-button');
    }
}
```

These components can then use using by called <x- followed by the name:

```
<x-form-button method="GET" action="/demo">
    Delete
</x-form-button>
```
DISCUSS: What was your first web app deployment experience like?
Tags: beginners, webdev, discuss
Published: 2020-07-10 22:53:15

Did you deploy to one of the major cloud providers such as AWS, GCP, or Azure? 

Did you use a PaaS option like Heroku?

How did it go? Any lessons learned you can share?

---

I recently had a chance to talk with Dylan Albertazzi, a CS student at Oregon State University, about various options for deploying the web application he has been working on!

We discussed the tradeoffs of options ranging from Heroku to DigitalOcean and how he could go about scaling the application down the road.

{% youtube zX1dol4j2JA %}
Variable "$slug" of required type "String!" was not provided.
Tags: gatsby, graphql, javascript
Published: 2020-07-10 22:51:51

I receive this error when executing: gatsby build
ERROR #85920  GRAPHQL

There was an error in your GraphQL query:

Variable "$slug" of required type "String!" was not provided
query homeyassineContainersmyBlogsrcpagestemplatehealthJs3338664333($slug: String!) {
     
      contentfulBlogHealth(slug: {eq: $slug}) {
        title,
        date(formatString: "MMMM Do, YYYY"),
        body {
          json
        },
        id
     }
   }
Como definir contratos para importação de arquivos texto com C#?
Tags: csharp, dotnet, braziliandevs
Published: 2020-07-10 22:47:34

Olá! Tudo bem?

Recentemente necessitei de uma funcionalidade onde lia arquivos texto e criava objetos. Estava fazendo um trabalho bem repetitivo e minhas classes que instanciavam os objetos, precisavam saber em qual posição do array deveria buscar para setar nas propriedades:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/pm2s8nvg69j1iwy9zamf.PNG)
<sup>*Meu arquivo texto.*</sup>

Dessa forma:
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/vc7z3v47nl4we2bmyn90.PNG)

Assim, pensei na possibilidade de minhas classes DTOs definirem nas propriedades quais posições do arquivo os valores delas estava. Criei um atributo para setar nas propriedades e passar o index que o valor dela está no array:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/7l3p2lgeak4bdn2sintz.PNG)

E defini os atributos nas propriedades:

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

Agora que minha classe já sabe em qual posição da linha do arquivo o valor dela está definido, eu preciso setar o valor com base na posição dela. Criei uma classe abstrata que no construtor, receberia o array da linha lida e setaria os valores nas propriedades:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/24dnwgxown3a2n73ikqz.PNG)

Por fim, nossa classe DTO, ficaria dessa forma e nosso método que o instancia, mais enxuto e sem a necessidade de saber quais propriedades setar:

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

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

Acredito que tenha perdido um pouco de performance por conta do uso de Reflection, farei um post comparando com o BenchmarkDotNet, entretanto conseguimos generalizar o comportamento necessário.

É isto! Você vê alguma forma que posso melhorar meu código ou outra abordagem? Comenta aí!

Até mais!
Paging a http endpoint by recursion
Tags: java, http, recursion
Published: 2020-07-10 22:46:09

---
title: Paging a http endpoint by recursion
published: true
date: 2020-07-10 22:45:12 UTC
tags: java, http, recursion
canonical_url: https://blog.wick.technology/recusion-paging/
---

Paging the results of REST API calls is a good opportunity to show recursion and how it differs from just using loops.

Recursion requires 3 things:

- a stop condition (also called a base case)
- an accumulator (some number or value which changes) which is used as input into the stop condition
- a method which can be called with the accumulator

Here’s an example where the goal is to get REST resources from a HTTP API. We have a `client` which has a method `get(int offset, int limit)` which gets the resource from the API and returns a Java object representation of the response. Here’s how to use that client recursively:

```
public List<Object> getResources() {
    List<Object> resources = new ArrayList();
    return retrievePagedResource(resources, 0);
}

private List<Object> retrievePagedResource(List<Object> resources, int offset) {
    ResourceResponse response = client.get(offset, limit);
    resources.addAll(response.getItems());
    if (response.getTotal > limit + offset) {
        retrievePagedResource(resources, limit + offset);
    }    
}
```

Let’s see how the above implementation of paging satisfies the requirements for recursion. The stop condition is in the implicit else of the if statement - recursion will stop when total results are less than or equal to the limit plus offset. We use the combination of the limit and offset as the accumulator and we use it as an input in the stop condition. Because the original method takes no method arguments we need a second method which takes the accumulator as an argument. This second method can then be called from the original function with a default value, 0, indicating we want to start paging from the 0th item in the available resources.

Using loops, this same example would look like:

```
public List<Object> getResources() {
    int limit = 50;
    int offset = 0;
    int totalResults;
    List<Object> resources = new ArrayList();
    ResourceResponse response = client.get(offset, limit);
    resources.addAll(response.getItems());
    totalResults = response.getTotal;
    while (totalResults > limit + offset) {
        offset = offset + limit;
        ResourceResponse response = client.get(offset, limit);
        resources.addAll(response.getItems());
    }
    return resources;
}
```

There are some clear differences - the loop implementation relies heavily on modifying variables and so since the variables are always changing it’s harder to reason about. The recursive example can be made purer by not adding items to an existing list but creating a new list every time which is concatenated with another list.

When paging, be wary of storing every object in-memory, in case there’s a lot of objects. If you are filtering the returned list, it is best to filter as each page comes in rather than gather a huge list and filter after everything has been returned.
What is backwards compatible?
Tags: help
Published: 2020-07-10 22:29:34

I'm gaining some insight into [semver](https://semver.org/) (Symantec versioning, aka 1.0.0) for the open source project [didi.land](http://didi.land)

While attempting to understand smaller details for once, I am of course actually thinking about what it means to release software, a question that oddly I have managed to avoid in my job for many years, but as we are in a dev-ops world, it's time to dig in and try to understand.

3 little numbers which we might already be aware of, major.minor.patch as defined by the specifications, this is not a post about that, the semver spec does an ... Okayish job of that, perhaps il do a semver for humans post sometime?

Back on tangent, what the heck is a backwards compatible change, why do I want to go backwards? Can somebody spell it out for me.

My previous understanding of semver was, major, it's a brand new product, don't expect a piece of code to work with 1.0.0 or 0.0.0 my PlayStation 8 won't run disks from PlayStation 9?

Semver starts talking about API's and that is the most broad term, as a web developer, an API is a public set of endpoints 🤦‍♂️, but I can expect that on occasion it refers to library code yes, I'm struggling to contextualize it. API might also mean npm, given I replace the word API with npm, it kind of makes more sense.
First React Project
Tags: reactnative, react
Published: 2020-07-10 22:21:09

---
title: First React Project
published: true
description: my first react project.
tags: reactnative,react
---

Hello, I just finished my First React-Native project, it is a tictactoe game, nothing complicated. Currently learning the ins and outs of react, if you have any advice for learning react, please let me know.  :)







link to code and game in google play store here
https://github.com/mioppong/react-tic-tac-toe
Day 172: Rain All Day
Tags: hiphop, code, coding, lifelongdev
Published: 2020-07-10 21:37:10

_liner notes_:
- Professional : Pretty chill day. A couple of meetings, worked on my blog post and did some research. Good way to wind down from the week. Looks like it will rain all day.

- Personal : Got the components I was building for my project done. Pretty cool that I'm able to include the same components on different pages and pass in some parameters and get it working as if they were different things. What I did was create components for selecting your video source and screen capture. I needed one for the guest and host for my side project. Got it working pretty well. There was a slight hiccup in how I thought I would get everything working, but I can come up with a workaround. Went through some more tracks and went to sleep.

![The hillside of Selva Di Val Gardena, Italy with some houses and a large cloud covered mountain in the background](https://dev-to-uploads.s3.amazonaws.com/i/q88x215xq40kc67h4dtb.png)

The flooring for my van came in early. I'll be cleaning the floor and put it down tomorrow. Doing my laundry and going through tracks for the radio show tomorrow. After that, I want to figure out how to Access Google APIs for Users with OAuth 2.0 on the server for my project. I need to be able to allow users of my side project to be able to stream videos to my YouTube channel.

Have a great night and weekend!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube d0oWKBC_1MY %}
Onde fica o prop-types do React?
Tags: react, javascript
Published: 2020-07-10 21:12:45

---
title: Onde fica o prop-types do React?
published: true
description: Onde fica o prop-types do React?
tags: react, javascript
//cover_image: ![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/ka3i88fvgu6f9vxx4cro.jpg)
---
A inspiração para esse artigo veio de algumas perguntas que encontrei pela internet sobre as 'mágicas' que percebemos no React durante o desenvolvimento.

Inclusive essa pergunta foi feita em um tutorial que eu mostrava a criação de um componente. Pode parecer básico esse questionamento, 
na verdade muitos questionamentos são básico enquando são fermentados em nossa mente, na hora de explicar nem sempre é tão intuitivo.

**O que é esse prop-types?**
O nome é bem sugestivo depois de uma análise, podemos extrair do *prop* propriedade e do *type* a palavra tipo. Acredite, já foi meio caminho andado!

**Onde ele mora?**
Quando usamos o comando: *npx create-react-app filename*, para criar nossa estrutura inicial do nosso projeto, os scripts internos do React se encarregam de buscar lá no **NPM** *(Node Package Manager)* esse pacote chamado *prop-types*.

**O prop-types no nosso projeto:**
Depois que o React, de forma automática, baixa suas dependências, dentre elas o *prop-types*, ele é registrado em dois arquivos:

**(1)** Na pasta **node_modules/prop-types**, nessa pasta temos de fato o módulo (código).
**(2)** Outro local é no **package-lock.json**, onde podemos ver o endereço do repositório **@types** (arquivo de definição de tipos)

Se você colocar o endeço abaixo na sua barra de buscas: https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz , você vai baixar o pacote de definição de tipos automaticamente.

**Pra que serve?**
Se você já usou ou sabe pra quer serve o **TypeScript** e o **Flow** (dentre outras soluções) é fácil entender pra que serve o *prop-types*. Serve para você ter o controle do tipo das suas variáveis. Mas o benefício não é só esse, o *prop-types* assim como o TypeScript (inclusive, recomendo usa-lo e o próprio Facebook também recomenda).

(1) Pra usar, precisamos importar no nosso componente:
***import PropTypes from 'prop-types';***

(2) Depois que declaramos a nossa importação, podemos fazer uso do seus benefícios.
```
UserItem.propTypes = {
     user: PropTypes.object.isRequired
};
```
No trecho acima, temos um componente chamado UserItem, 'conectamos' ao nosso propTypes e dentro, no corpo do objeto, passamos qual variável queremos controlar, no caso a variável user que vai ser do tipo objeto e é obrigatória.

Como você pode imaginar, esse exemplo pode se extender pra outros tipos de variáveis e obrigatoriedades.



Think, code and share!
"I'll be emailing you weekly" - Yeah, no, stop.
Tags: discuss, email, marketing, spam
Published: 2020-07-10 20:50:20

---
title: "I'll be emailing you weekly" - Yeah, no, stop.
published: true
description: 
tags: discuss, email, marketing, spam
//cover_image: https://direct_url_to_image.jpg
---

I got this e-mail title "I'll be emailing you weekly" today from dev.to,

This actually hit a nerve.

No you do not get to email me another weekly without me asking.
This email prompted me to disable the weekly's...

Anyone else got annoyed by this?

Also, and this might be subjective, but i feel like the amount of email CTA's have been increasing during my year on the site, anyone else noticed this?

I hope this finds the right audience.
Share your SpriteKit experiences...
Tags: discuss, gamedev, swift, spritekit
Published: 2020-07-10 20:34:20

---
title: Share your SpriteKit experiences...
published: true
description: Does anyone have recent experience with the framework? Highly appreciate any kind of discussion.
tags: discuss, gamedev, swift, spritekit
cover_image: https://miro.medium.com/max/3420/1*xjhk3EclSuMSVN13XRRviA.png
---

I build a 2D game a few years back using SpriteKit. Back then SpriteKit was just released and not very stable. I plan to rebuild the game towards the end of the year and wonder if I should stick with spritekit. Does anyone have recent experience with the framework? Highly appreciate any kind of discussion.
Cheers
4 Javascript Array Methods to Use Daily
Tags: javascript, webdev, 100daysofcode, angular
Published: 2020-07-10 20:06:33

As developers, dealing with arrays is a thing we just cannot do without. Whether it's a list of items in a shopping cart, or a list of users, or even a list of todo items, we regularly manipulate these to get various results.

My favorite javascript array methods are forEach, map, filter, and find. Before now, the good old for-loop, was used to loop through  arrays and perform manipulations using the common variable i. And while we can still do everything with a for-loop, the newer array methods make things a lot simpler.  Let's go over them briefly and see how to use each of them. 

###forEach
The forEach method is normally used to loop through an array and perform a callback on each item. For example:

```javascript
const students = ["James","Rita","Jean","Francis"]


students.forEach(student => console.log(student))

// expected output: "James"
// expected output: "Rita"
// expected output: "Jean"
// expected output: "Francis"

```

###map
The map method works just like the forEach method with a little modification. While the forEach method simply runs the callback method, the map method returns a new array. For example:

```javascript
const positiveIntegers = [1,3,4,5]

const modified = positiveIntegers.map(i => i+2)

console.log(positiveIntegers)
console.log(modified)

// expected output: [1,3,4,5]
// expected output: [3,5,6,7]
```

###filter
The filter method works just like the name implies, it filters through a list and returns a new list based on the conditions supplied in the callback function. For example, lets get the students whose names do not begin with the letter a

```javascript
const students = ["angel","angela","becky","james"]

const filtered = students.filter(name => name[0] !== "a")

console.log(filtered)

//expected output: ["james"]
```

###find
The find method loops through an array and returns the first element that matches the condition provided in the callback. For example, let's get the first number that is greater than 5 in a list of numbers.

```javascript
const numbers = [3,2,4,7,9,12,3]

const matched = numbers.find(item => item > 5)

console.log(matched) // returns 7
```

Indeed these methods are invaluable in the day to day workflow of a javascript developer. Theres are other interesting javascript array methods. Which is your favorite?
Check out my open-source project!
Tags: privacy, github, opensource, php
Published: 2020-07-10 19:57:33

lunr is an anonymous, private, and secure open-source meta-search engine.

It protects your privacy by not sending your private data to Google or other third-parties (e.g. targeted ads) that collect, process, and sell your data.

The project is in its early stages and needs a lot of work and love put into it.

I am trying to gather some attention and create a community around this project. Any feedback, or improvement ideas are welcome!

[lunr.xyz](https://lunr.xyz)
[GitHub](https://github.com/obsidianbit/lunr)

Thank you!

P.S. wear a mask and stay safe!
Rails Installation (Windows, Linux & Mac)
Tags: rails, installation
Published: 2020-07-10 19:49:42

Ruby on rails is a great framework, especially so when speaking of rapid development. But the toughest part for most beginners is getting rails up and running on their machine.

Note: If you are on windows, go to microsoft store and install WSL(ubuntu), this shouldn't take long and you'll be able to follow the installation steps from ubuntu.
Contributed to dev.to and you can too!
Tags: opensource, ruby, javascript, webdev
Published: 2020-07-10 19:41:33

I just wanted to say that if you are thinking about contributing to OSS. DEV is a great place to get started. Their installation documentation is great and I had little to no issues spinning up a local environment. 

Links that will get you started

* [GitHub Repo](https://github.com/thepracticaldev/dev.to)
* [Contributing ReadMe](https://github.com/thepracticaldev/dev.to/blob/master/CONTRIBUTING.md)
* [Installation Guides](https://docs.dev.to/installation/)

After installation the docs that helped me get my first PR up
* [Easy issues](https://github.com/thepracticaldev/dev.to/issues?q=is%3Aopen+is%3Aissue+label%3A%22difficulty%3A+easy%22)
* [Good for beginners to OSS](https://github.com/thepracticaldev/dev.to/labels/good%20first%20issue)
* [Get started](https://docs.dev.to/getting-started/)
* [Frontend guide](https://docs.dev.to/frontend/)
* [Testing/QA guide](https://docs.dev.to/tests/)

The installation for MacOS was pretty straight forward and these are all of the links I used to get my first PR up. There is much more documentation to read through, but I will leave those up to you to read :).

## Steps to first PR
* Reviewed the Github repo
* Read through the contributing documents
* Installed prereqs for MacOS
* Went through the 'Getting Started' section
* Looked for a `difficulty: easy` issue
* Claimed it in the comments
* Spun up the local environment and got to hacking.
* Cleaned up my commits and created a PR
* Waited for reviews
* Got approval and my PR was merged :D
* Got sweet badge for my profile

So don't delay get out there and contribute some code!
What's the recommended amount of metadata for a link preview?
Tags: discuss, webdev, html
Published: 2020-07-10 19:18:59

When we post a link to any online content, we generally have little previews pop-up. This happens for Reddit, Twitter, Facebook, and even Whatsapp.

I know that crawlers use the metadata present in the header of an html document to obtain the info. These are generally contained in the meta tags. Crawlers also use Open Graph meta data specifications (i.e. data stored in with the `og` prefix) to display preview images and stuff.

I wanted to know what's the minimum set of data that you include for good link previews? Are there any best practices regarding that? I'm curious to know your thoughts.
Have you a hey.com account ? What do you think of it ?
Tags: discuss
Published: 2020-07-10 18:44:20

[Hey.com](hey.com) is a new email service created by Basecamp. 

> It’s a redo, a rethink, a simplified, potent reintroduction of email. A fresh start, the way it should be.

> HEY is our love letter to email, and we’re sending it to you on the Web, Mac, Windows, Linux, iOS, and Android.

What do you think of it ? If you already use it, can you please share your thoughts about it ?
GitHub new feature to add README on your Profile 
Tags: github, tutorial, contributorswanted, feature
Published: 2020-07-10 18:43:12

GitHub has finally enabled this really new cool feature for all their users where you can add **README** file to showcase yourself on the main page of your GitHub profile, earlier it was enabled for very selected users.

To get started:

* First create a repository with name as your **GitHub username** (make sure their is no other repository available with same name ). If you have selected correct name, then you should be able to see this while creating repository.
   
![Create Repo message](https://raw.githubusercontent.com/coderjojo/coderjojo/master/img/demo.png)

* Create a README.md file inside it.
* Now add all necessary content in the file to make it detailed and if you want you can use below resources to make it look good.
 
 [Sample README](https://github.com/coderjojo/coderjojo)
 [Markdown Cheatsheet](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet)
 [Emojis](https://gist.github.com/rxaviers/7360908)
 [Brand Icons](https://github.com/edent/SuperTinyIcons)
 [Online Markdown Editor ](https://stackedit.io/app#)
* Commit the files and push all the changes.
* On bottom right side GitHub will ask you to use README to your profile, click on share.

That's it your profile is now ready. :heart_eyes:

Do visit my GitHub [Profile](https://github.com/coderjojo) and provide some feedback.
![My Profile](https://dev-to-uploads.s3.amazonaws.com/i/2ylco60zrgvjshcfjknp.png)

I have added few profile to [Developer Profile](https://github.com/coderjojo/creative-profile-readme) repository.

Please consider to contribute to [Developer Profile](https://github.com/coderjojo/creative-profile-readme) repository with your updated profile, So that other's will get inspiration to do more creative work. :heart: