teleren/devto huggingface dataset:
"The Code is with you, young CodeWriter. But you are not a Programmer yet."
Tags: beginners, discuss, watercooler, motivation
Published: 2022-05-29 21:49:36

Do you cook? And… does that make you a cook?

More and more, life is code!
Low/No code is something awesome when done right, and even then you will still need some code.

With barely basic knowledge, will, and anger alone I was able to automate my whole team workload by doing a web scraper… in VBA… in Excel.

There are people out there doing so much more on their jobs with code, I would guess probably with Python, maybe with Javascript.

## The question is: they code, but are they programmers?

Most likely not.

They code and solve problems with code, they use StackOverflow, and they probably learn from some Indian guy on Youtube… but code is just a tool in their toolbox.

## Then, what makes a programmer?

What is the line between an amateur and a professional?

You cook, and you probably even have one dish that can be better than that of a professional cook.
You can take photos, and some might be true works of art, but how are you different from a professional photographer?

What is the difference between someone who programs and a programmer?

### My turning point

For me, the “turning point” was discovering Uncle Bob.

I’ve devoured his books and started binge-watching every talk I could find:

[https://www.youtube.com/playlist?list=PLo61EKto8ZPHUOld83z0pwpzdlioliu6j](https://www.youtube.com/playlist?list=PLo61EKto8ZPHUOld83z0pwpzdlioliu6j)

I’m not sure if this masterclass has everything I’ll be talking about, but it's a good starting point.

Uncle Bob likes to talk about how a profession means to profess something and to have standards.

He talks about how medicine has its oath and that we, programmers, need one too and offers his version of the Programmer’s Oath (or also, the Coder’s Code):

[https://blog.cleancoder.com/uncle-bob/2015/11/18/TheProgrammersOath.html](https://blog.cleancoder.com/uncle-bob/2015/11/18/TheProgrammersOath.html)

### What makes a professional: Intent

For me, it’s intent.

Anyone can and should code. 
It’s a skill as valuable today as typing was one day and spreadsheets was (still is?) today.
Coding might even come to be as easy as taking a photo today!

So, the thing that makes you jump from someone who codes to a programmer is, and maybe should be, intent.

When I’ve started applying what I’ve learned from Uncle Bob and the Coder’s Code, more and more I’ve started trying to do always better, holding myself and my colleagues to higher standards.

---

For you, what was your “turning point” and what do you think makes a programmer?

---

Cover Photo by [LinkedIn Sales Solutions](https://unsplash.com/@linkedinsalesnavigator?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on [Unsplash](https://unsplash.com/s/photos/suit-computer?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText)


[![buy me a coffee](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3g57csxswutortu6i2oc.png)](https://buymeacoffee.com/noriller)
Dinamik Pop-Up
Tags: uyumsoft
Published: 2022-05-29 21:22:00


`function SetEDespatch5()
{
ClientExecSQL('UPDATE INVT_ITEM_M ITM SET  ITM.E_DESPATCH_STATUS=5 WHERE ITM.ITEM_M_ID=@Id',
function (p) {
alert('İşlem Başarılı.!');location.reload();
},
GetControlValue('Id')
)
}`

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/glu6f5s73b6x1ify6r5b.png)
 


> Ekrandaki bir değeri Set etme

SET M.LOANS_REF_NO = @pLoansRefNo
```
function fn_YeniRefNo() {

var LoansRefNo = GetControlValue('LoansRefNo');

ClientExecSQL('UPDATE FIND_LOANS_M M SET M.LOANS_REF_NO = @pLoansRefNo WHERE M.LOANS_M_ID=@Id',
function (p) {

alert('İşlem Başarılı.!');location.reload();
},
LoansRefNo,
GetControlValue('Id')
)
}
```
O melhor gerenciador de pacotes para Arch Linux
Tags: braziliandevs, trans, archlinux
Published: 2022-05-29 21:07:31

## O quê é um gerenciador de pacotes

Um gerenciador de pacotes é um programa utilizado para manipular os pacotes de um sistema, instalando, removendo e atualizando pacotes.

A principal vantagem de se utilizar um gerenciador de pacotes é centralizar todo o trabalho de gerenciar estes. Não precisando buscar pacote por pacote para atualizar ou remover, podendo fazer isso através de comandos.

## Pacman

O gerenciador de pacotes padrão do [Arch Linux](https://archlinux.org/) é o [Pacman](https://wiki.archlinux.org/title/Pacman). O Pacman é muito bom para gerenciar pacotes dos repositórios oficiais do Arch Linux, mas para manipular os pacotes da [AUR](https://aur.archlinux.org/) utilizando o Pacman é um processo muito mais tortuoso. Por isso, podemos utilizar outros gerenciadores de pacotes para facilitar esse processo.

## Paru

[Paru](https://github.com/morganamilo/paru) é um gerenciador de pacotes criado pela comunidade que busca facilitar o processo de instalação de pacotes da AUR, e dos repositórios oficiais do Pacman.

### Instalação

Para instalar o Paru, você pode utilizar esses comandos abaixo:

```bash
sudo pacman -S --needed base-devel
git clone https://aur.archlinux.org/paru.git
cd paru
makepkg -si
```

## Utilização

Para instalar um pacote utilizando Paru, podemos usar o comando:

`paru [NOME DO PACOTE]`

Como por exemplo:

`paru spotify`

[![GIF do comando funcionando](https://asciinema.org/a/sEh1ZpZZUgXUsgqKxuDdhpdEE.svg)](https://asciinema.org/a/sEh1ZpZZUgXUsgqKxuDdhpdEE)

Como você pode ver, teremos uma lista de pacotes correspondentes, e podemos escolher o pacote que queremos instalar colocando o seu número. Com isso, o pacote será compilado e instalado no sistema.

Também podemos atualizar todos os pacotes do nosso sistema, utilizando o comando `paru` sem nenhum argumento, como no exemplo abaixo:

```
paru
```

## Removendo pacotes

E para remover pacotes, podemos utilizar o próprio Pacman sem problemas, com o comando:

```bash
sudo pacman -R spotify
```

Com isso o pacote será removido inteiramente do nosso sistema.

## Finalização

Nesse artigo aprendemos o quê é o Paru, e como utilizá-lo para gerenciar os pacotes do seu sistema.

Muito obrigada por ler ❤️🏳️‍⚧️ e me segue nas redes, é tudo [@lissatransborda](https://twitter.com/lissatransborda) 👀
Day 51: Tailwind bug fixed!
Published: 2022-05-29 21:00:46

Hi!
So the bug I had with Tailwind is fixed Yay! can't believe I spend the whole day trying tailwind to work properly in my project to find I was adding space in a string I shouldn't. I just got it fixed few hours ago and I then got started writing an article about setting tailwind and currently I'm halfway through and it should be ready by tomorrow before noon. I'm stopping early as I want to watch some movie before I sleep
The plan for tomorrow is to get started with designs implementations, I probably have some meetings to attend and an article to publish. it maybe a long one. we will see how it goes

signing off...
Association in OOP
Tags: oop, java
Published: 2022-05-29 20:38:34



_Association_ in OOP is a connection or relation between two separate #classes that are set up through their #objects. Association relationship indicates how objects know each other and how they are using each other’s functionality. It can be one-to-one, one-to-many, many-to-one, and many-to-many.

For example, a person can have only one passport. That is a “one-to-one” relationship between person class and passport class.
 And so on;

## **_- Two Forms of Association_**
Composition and Aggregation are the two special forms of association, both of them have a "has-a" relationship. let's check them out:

**1- Composition**
It simply means that one large object contains the other smaller object. In other words, it’s part or member of the larger object.
For example, a building (large object) #has rooms (smaller object).

**2- Aggregation** 
Aggregation is also a “has-a” relationship, It is like a composition with Minor logical differences:

## _- **Aggregation vs Composition **_
**1. Dependency:** 
Aggregation implies a relationship where the child can exist independently of the parent. For example, Bank and Employee, delete the Bank and the Employee still exist. whereas Composition implies a relationship where the child cannot exist independent of the parent. For example: if the building is destroyed the room is destroyed but the building will still exist!

**2. Type of association:**
 Composition is a strong Association whereas Aggregation is called a weak Association.
Authentication strategy todos
Tags: help, webdev
Published: 2022-05-29 20:12:28

Hi friends, 
I try to remember myself what is the normal and secure flow of an authenticated vs unauthenticated user. I've been using the web for eternity but I would like to be sure and maybe you guide me through this.

What are authentication rules ? 

For instance, an authenticated user cannot sign-in until he/she sign-out. He cannot sign in while being signed in already. What about redirections after these actions... etcetera. 

Is there any web resource to follow on this ? 

Of course I'm using no library and implementing it myself via JWT. 

All I need is a list to follow. 


Thanks a lot 😀
Confie mais no seu instinto
Tags: sucess, career
Published: 2022-05-29 20:05:21

O ‘sentido-aranha’ adquirido por Peter Parker funciona quase como um sexto sentido, uma espécie de habilidade premonitória, tal como as aranhas, que possuem um dos sistemas sensoriais mais impressionantes da natureza.

Diferentemente do sr. Parker, aqueles sem poderes podem no máximo explorar melhor sua intuição, que é o resultado de vários processamentos que ocorrem no cérebro. Pesquisas sugerem que o cérebro é uma grande máquina de previsões, constantemente comparando a informação sensorial e as experiências atuais com o conhecimento depositado e as memórias de experiências passadas. Cientistas chamam isso de “estrutura de processamento preditivo”.

Já é fato que, organizações que tomam decisões baseadas em dados estão melhores, comparado às empresas cujas decisões são orientadas apenas por instinto.

Mas como citei [neste texto](https://dev.to/belintani/o-caminho-do-sucesso-e-ser-incrivel-12em), “dados são o novo petróleo”, porém, nada ultrapassará o bem mais valioso, o TEMPO. Isso quer dizer que, trabalhar “data driven” é incrível, desde que, isso esteja trazendo ganho de eficiência, e que estamos economizando tempo.

Enquanto os dados não trazem conclusões para todas as decisões, é possível explorar o máximo da intuição das pessoas mais experientes. Se é pra errar, que seja em algo inédito!

Por muitas vezes a solução é óbvia, mas não estamos neurologicamente condicionados a recomeçar, limpar o campo de visão, e procurar o que pode ser removido, nós insistimos apenas em adicionar mais e mais conteúdo. No [artigo apresentado na capa da revista Nature](https://www.nature.com/articles/s41586-021-03380-y) em abril de 2021, pesquisadores da Universidade da Virgínia explicam por que as pessoas raramente olham para uma situação — em todos os tipos de contextos — e pensam em remover algo como solução. Em vez disso, quase sempre adicionamos algum elemento, ajudando ou não.

O simples ato de se comunicar verbalmente, por exemplo, é algo que consideramos “automático”. Porém, comunicar-se fluentemente não é simples, o excesso de domínio que temos em falar, faz parecer fácil. Isso ocorre em mais campos de estudo. Aquilo que mais temos certeza não requer grande esforço para tomada de decisão.

Analisar este comportamento é inclusive um dos fundamentos que classificam o polígrafo como uma “ultrapassada pseudociência”. Um bom mentiroso pode ter muito domínio em mentir, assim como um inocente pode ter pouco domínio em narrar numa situação de interrogatório.

No ambiente corporativo, se você tem afinidade em determinado tema, confiar naquilo que parece “óbvio” pode lhe trazer muito ganho de velocidade. Questionar-se todas a cada passo, e sempre procurar por referência em dados — por mais que traga uma resposta final mais fundamentada e assertiva — pode fazê-lo deixar de economizar tempo, que ainda é o verdadeiro valor almejado.

Por isso o mais sábio, na minha visão, é uma mescla, atuando empiricamente para itens de alto conhecimento, e deixando o campo de pesquisa para itens de baixo domínio.

--

Originally published at https://belintani.com on May 29, 2022.
Improve your iframe UX with React LoadingIframes
Tags: react, webdev, javascript, showdev
Published: 2022-05-29 19:55:14

Iframes can take a long time to load depending on the source. While your user is waiting it's preferable to give feedback on what is happening with their page, and why they are staring at a blank screen.

Using [react-loading-iframe](https://github.com/tea-lover-418/react-loading-iframe) you can show a skeleton that is displayed until the content of the iframe is ready. 

Install using `npm i react-loading-iframe`

Then include on your react components the following way:
```
import LoadingIframe from 'react-loading-iframe';

const Skeleton = () => {
  return <div>Cool loading screen</div>;
};

export const BasicExample = () => {
  return (
    <LoadingIframe
      skeleton={<Skeleton />}
      src="https://google.com"
      className="your-class"
      frameBorder={0}
    />
  );
};
```

Any suggestions on this are welcome as this is my first open source repository! Please give it a try.
Amazing CSS 3D Menu Hover Effect | CSS 3D Navigation Animation
Tags: css, beginners, webdev, programming
Published: 2022-05-29 19:22:20

Click Here for More:  https://www.youtube.com/channel/UCX9gxQCJTnkb0-fw_3SUkhQ

Amazing CSS 3D Menu Hover Effect | CSS 3D  Navigation Animation

In this video, we are going to see how to create an amazing CSS 3D Menu Hover Animation. It's completely made with pure HTML and CSS.  Website Navigation is the first thing that visitors will see and if you can create a navigation menu unique with cool animation then your visitor will love it.

{% youtube Mt7kQG0gj0c %}
Responsive Footer Design by @itsrehanraihan
Tags: codepen, beginners, css, design
Published: 2022-05-29 19:17:48

<p>It is a website footer design using html css. </p>
<p> Hope that you will like too..</p>
<p> You can follow me on youtube for more than that:</p>
[get me on youtube](https://www.youtube.com/c/codeopacity)

{% codepen https://codepen.io/itsrehanraihan/pen/xxYYjOm %}
How to import SVG in React
Tags: react, svg, jsx, javascript
Published: 2022-05-29 19:13:17

## Method 1
using it as a source for img tag
```javascript
import icon from './icon.svg';

const Footer = () => {
  return(
    <Footer>
      {/*... */}
      <a href='#'>
        <img src={icon} alt=""/>
      </a>
    </Footer>
  )
}
```

## Method 2
use it as component. In this way you can style SVG with CSS. change colors or animation with attributes like (storke, fill, stroke-dasharray ...)
```javascript
import { ReactComponent as Icon } from './icon.svg';

const Footer = () => {
  return(
    <Footer>
      {/*... */}
      <a href='#'>
        <Icon />
      </a>
    </Footer>
  )
}
```

## Method 3
Include SVGs directly in JSX. This is like the previous method but it may not be scalable for a large number of SVGs.
```javascript
const Icon = () => {
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
  <path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z"/>
</svg>
}

const Footer = () => {
  return(
    <Footer>
      {/*... */}
      <a href='#'>
        <Icon />
      </a>
    </Footer>
  )
}
```
Introduction to Github Actions - Part 2
Tags: github, ci, cd, workflow
Published: 2022-05-29 18:19:41

## Introduction to Github Actions

1. [Introduction to Github Actions - Part 1](https://dev.to/makendrang/introduction-to-github-actions-part-1-5ep6)
2. [Introduction to Github Actions - Part 2](https://dev.to/makendrang/introduction-to-github-actions-part-2-p79)



## Create an example workflow

1. Create a `.github/workflows` directory in your repository on GitHub.
2. In the `.github/workflows` directory, You can create a file named `github-actions-kcddemo.yml`.
3. YAML contents is in the [github-actions-kcddemo.yml](https://github.com/MakendranG/kcdchennai-github-actions.yml/blob/main/.github/workflows/github-actions-kcddemo.yml) file.
4. To start a pull request, scroll to the bottom of the page and select create a new branch. Click Propose new file to create a pull request.
![demo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tjxakmspoubfwlndnkwx.JPG)
5. The push event occurs when you commit the file to a branch.


## Viewing your workflow Output


- On GitHub.com, go to the main page of the repository.


- Click Actions under your repository name.


![actions](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/77h2ivx9eps08nn5w2tw.JPG)


- In the left sidebar, you can click on the workflows you want to see.



![workflow](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bmh5xnkng8tvdoomvdk4.JPG)




- Click on the name of the run you want to see.



![run](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3105n3vkn73rr7m5iwjz.JPG)



- You can click the Explore-GitHub-Actions job.



![explore](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jvq6rlbvcjkt31d3ak5r.JPG)



- The log shows how the steps were processed. To view its details, expand any of the steps.

![log](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k2gtofwx4tsnegxzjnpl.JPG)



Thanks for reading my article till end. I hope you learned something special today. If you enjoyed this article then please share to your friends and if you have suggestions or thoughts to share with me then please write in the comment box.
Overview of Azure DNS Private Resolver
Tags: azure, dns, fullymanaged, highperformance
Published: 2022-05-29 16:28:59

## Azure DNS Private Resolver

It is a new service that allows you to `query private zones from an on-premises environment` and vice versa.


The private resolver requires an azure virtual network. One or more `inbound endpoints are established` that can be used as the destination for DNS queries when you create an azure private resolver inside a virtual network. The resolver's `outbound endpoint processes queries based on the forwarding ruleset` that you have set. There are networks linked to a ruleset that can be used to send the queries.


The process of using a Azure DNS private resolver is summarized below.

- DNS query will issue if the client is in a virtual network.
- The DNS query is forwarded to the specified addresses if the server for the virtual network is specified as `custom`.
- There are Private DNS zones linked to the same virtual network if Default is configured in the virtual network.
- If the query doesn't match a Private DNS zone linked to the virtual network, then Virtual network links are consulted.
- If there are no ruleset links, then the query can be solved with the help of the azure domain name system.
- The `forwarding rules are evaluated` if the ruleset links are present.
- The query is forwarded to the address if a match is found.
- The `longest suffix is used` if multiple matches are present.
- If no match is found, no forwarding occurs and the query is resolved with the help of the azure domain name system.


The following `benefits` are provided by the Azure DNS private resolver.


- It is `fully managed` and has built-in `high availability and zone redundancy`.
- `Reducing operating costs` and running at a fraction of the price of traditional IaaS solutions.
- You can have private access to your Private DNS Zones.
- `High performance per endpoint` is possible.
- `Terraform, Arm, and Bicep` are friendly to the `DevOps` movement.


Thanks for reading my article till end. I hope you learned something special today. If you enjoyed this article then please share to your friends and if you have suggestions or thoughts to share with me then please write in the comment box.
Testes E2E
Tags: beginners, braziliandevs, todayilearned, testing
Published: 2022-05-29 17:59:05

Apesar de eu ser muito acostumado a fazer testes unitários até hoje não escrevi nenhum teste End to End. Então hoje finalmente decidi aprender como fazer testes E2E

Tudo que eu descrever aqui nesse post foi feito no seguinte [repositório](https://github.com/Yansb/full-cycle-course/tree/master/clean-architecture)

## Escrevendo testes E2E

Primeiro precisei declarar o app usando express, e também a conexão com o banco usando o sequelize 

```js
export const app: Express = express();

app.use(express.json());

export let sequelize: Sequelize;

async function setupDb() {
  sequelize = new Sequelize({
    dialect: 'sqlite',
    storage: ':memory:',
    logging: false
  });

  sequelize.addModels([CustomerModel, ProductModel])
  await sequelize.sync()
}

setupDb();
```

E então no meu arquivo de testes importei ambos junto com a função request do [supertest](https://www.npmjs.com/package/supertest)
e então comecei declarando no beforeEach que o sequelize deve sempre recriar o schema antes de um novo teste e no afterAll fechei a conexão com o banco de dados

```js
import {app, sequelize} from "../express"
import request from "supertest"

describe("E2E test for customer", () => {

  beforeEach(async () => {
    await sequelize.sync({force: true})
  })

  afterAll(async () => {
    await sequelize.close()
  })

  it("should create a customer", async () => {
    const response = await request(app)
      .post("/customer")
      .send({
        name: "John Doe",
        address: {
          street: "123 Main St",
          city: "Anytown",
          number: 123,
          zip: "12345"
        },
      });

    expect(response.status).toBe(201)
    expect(response.body.name).toBe("John Doe")
    expect(response.body.address.street).toBe("123 Main St")
  })

})
```

O teste fica basicamente assim, acabou sendo muito mais fácil do que imaginei que seria, agora basta garantir que meu endpoint `/customer` do tipo `POST` vai retornar os dados no formato esperado
Creating and assigning an issue to someone on GitHub
Tags: github, opensource, prudyopensourceseries, codenewbie
Published: 2022-05-29 17:55:04

Issues are important as they alert a maintainer to issues concerning the repository or codes. Information including bugs found, new ideas, feedback etc can be sent through the issues page.

They can also be created in a number of ways but creating from a GitHub repository could use the following steps.

---

**Step 1↓↓**
Navigate to the main repository and just below the repository name click on issues and create new issues.


![1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rn6dj1b7hch7jxwu4tx0.jpg)

**Step 2↓↓**
When the new issue page opens you can write a title describing the issue, you could also attach files to show these issues clearly.

![2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/i3ij94bbs3oij9yva18s.jpg)

Also, you can have someone assigned to work on the identified issue by using the assign button. 


![3](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9yv4tzmhe8mby5y7w0a6.jpg)

You could have up to 10 people assigned to address the issue.


![4](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0dc7q2ezxv00epiekiu5.jpg)
You can also add a label tag, showing the type of issue for easy explanation.

**Open source secret:** for open source newbies, searching for `good first issue`can bring up easy to fix issues.

Thus, the tag system helps to make this categorization easier for others to find and fix issues.

After Assigning and labeling, you can now submit.

**Step 3↓↓**

![5](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wvoeblg92h2kgzyhay42.jpg)

Your issue becomes open after submitting and the issue count increases. The assigned party is also notified.

And that's one way to create an issue from the GitHub page.

![Tg](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ozjqbngoagopk1s2slxu.gif)
Until later