teleren/devto huggingface dataset:
PHP - Named Arguments
Tags: php, phptips, phptutorial
Published: 2022-03-28 00:48:49

---
title: PHP - Named Arguments
published: true
description: Aprenda a usar o novo recurso do PHP: Argumentos Nomeados
tags: php,phptips,phptutorial
---

{% embed https://youtu.be/eEzD-cvmSlc %}
CSS - Utilizando variáveis no css
Tags: css, vars, variaveis, front
Published: 2022-03-28 00:45:27

---
title: CSS - Utilizando variáveis no css
published: true
description: Aprenda como criar e utilizar variáveis em css deixando seu códido mais versátil e simples de dar manutenção.
tags: css,vars,variaveis,front
---



{% embed https://youtu.be/oXSo10BKWrQ %}
Why?
Tags: fivewhys, productmarketfit
Published: 2022-09-22 07:26:43

---
title: Why?
published: true
date: 2022-03-28 00:00:00 UTC
tags: fivewhys,productmarketfit
canonical_url: https://jhall.io/archive/2022/03/28/why/
---

Why are you reading this?

Joel Spolsky once gave a humorous presentation about, if memory serves, web browsers, but that’s not really important. One component of his talk was asking “Why?” In particular, why do people use web browsers (or any other piece of software)? Essentially, he demonstrated that the [Five Whys](https://en.wikipedia.org/wiki/Five_whys), taken to the ultimate conclusion, always leads us to “So your selfish DNA can replicate itself.”

Let me demonstrate:

Why is Bob using a web browser? 🠮 He’s shopping for books about Python.  
Why is Bob for books about Python? 🠮 He wants to learn a new skill, so he can earn more money at work.  
Why does Bob want to earn more? 🠮 He wants to afford a larger appartment.  
Why does Bob want to afford a larger appartment? 🠮 He wants his dates to feel more comfortable when they come over for diner.  
Why does Bob want his dates to feel more comfortable? 🠮 So that his selfish DNA can replicate itself.

In theory, practically every decision we make can be ultimately traced back to this concept. Of course, there are exceptions. Some of us have no desire for children, or may be beyond child bearing age, or whatever.

The point is, nobody uses software, drives a car, buys a tool, or does much of anything else (outside of sheer entertainment), for its own sake. The _real_ motivation is often so far removed from their mind as to be comical–like replicating selfish DNA.

So why are you reading this message I’ve written?

Why do you write software for a living (or whatever else you may do)?

Why do the users of your software use that software?

It’s an interesting thought. And it has some profund implications, whether its your own motivations in question, or those of the people you influence through your work.

(I probably watched the Joel Spolsky presentation in the late 2000s or early 2010s, and have since spent hours searching for it to no avail. I suspect it’s no longer online. But if someone knows where to find that talk, please send me the link!)

* * *
_If you enjoyed this message, [subscribe](https://jhall.io/daily) to <u>The Daily Commit</u> to get future messages to your inbox._
Dashboards de Produção Industrial
Published: 2022-03-27 23:46:49

Link para [Download](https://drive.google.com/drive/folders/1Vjh7ZXASZsyi5wKJB6_0gf9TJpZY-27N?usp=sharing) 

## Dashboard de Produção Industrial de Peças
![Dashboard de Produção Industrial de Peças](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lyk8wgian3m4ggxv5vg8.png)
Dashboards de Vendas no PBI
Tags: dashboard, dax, powerbi, datascience
Published: 2022-03-27 23:39:00

Link para [Downloads](https://drive.google.com/drive/folders/1dMGnFBL5QGMWID_ksQoBlrA1YsD_rIzZ?usp=sharing)

## Dashboard de Vendas de Alimentos

![Dashboard de Vendas - Produção e Vendas de Alimentos](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u1uaoeghetzn07yfy3al.png)

link de [acesso](https://app.powerbi.com/view?r=eyJrIjoiM2YzMDk2MGEtM2I3ZC00ZDgzLTgzNmUtM2MzNjczOGM5MWJhIiwidCI6IjM0Yjg3YTQ5LTNiNTUtNDgwYi04MGVkLWU3YjY4NjE0ZWU5OCJ9)

## Dashboard de Vendas de Varejo por continente

![Dashboard de Vendas - Varejo por continente](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qsmjiur8ybmw2o6877cw.png)
Running Tanzu unmanaged cluster on (very) low resources
Tags: kubernetes, opensource, devops, docker
Published: 2022-03-27 23:25:14

## 👉 Intro

We currently are evaluating [VM Ware Tanzu Kubernetes cluster](https://twitter.com/vmwaretanzu ) solution.

Fortunately [VM Ware](https://tanzu.vmware.com/) made the choice to get community driven by :

- Making its cluster available for many flavors through its Community Edition called TCE ([Tanzu Community Edition](https://tanzucommunityedition.io/))
- Creating [Carvel Community](https://carvel.dev/) which : 

> _"[...] provides a set of reliable, single-purpose, composable tools that aid in your application building, configuration, and deployment to Kubernetes."_

## ❔ The `unmanaged` cluster

In TCE, VM Ware introduces [TCE Unmanaged Cluster](https://tanzucommunityedition.io/docs/v0.10/ref-unmanaged-cluster/) which makes possible to run Tanzu on low resources envs or on develop environments great to be destroyed/rebuilt for experimental/learning purposes.

So I wanted to challenge TCE on Katacoda to see **how could use it on our workstations**.

> If you manage to make it run on Katacoda (with default low resources) then you can run it on your system.


## 🎞️ Discover TCE

So you can discover how we achieved to get a live TCE running cluster on Katacoda and on which stack it does rely :

{% embed https://youtu.be/GRipRGxR4QY %}

## 🔖 Resources

Play yourself on the [dedicated Katacoda scenario](https://www.katacoda.com/opt-labs/courses/tanzu-community/tce-playground) and stay tuned for more news on that topic :

{% twitter 1505904668584685569 %}
Top 5 - Temas en modo oscuro para Visual Studio Code
Tags: vscode, javascript, webdev, hebertdev
Published: 2022-03-27 22:35:24

Estos son los 5 temas en modo oscuro que más me gustan para Visual Studio Code.

**1 Palenight Theme**

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


**2 Dracula**

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


**3 Night Owl**

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

**4 Material Theme Palenight**

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

**5 Monokai Pro New**

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


Puedes explorar todos los temas que hay disponible en Visual estudio code
en:
https://vscodethemes.com/
Las imágenes tambien provienen de vscodethemes.com
🚀 Angular 13 + ESLint, Material + Transloco + Jest, TestCafe + Docker + Prettier 🚀
Published: 2022-03-27 22:32:11

This is the Angular 13 Starter project you are looking for!

**GitHub**
https://github.com/wlucha/angular-starter

## Features

✅ [Angular 13](https://angular.io/)
✅ [Angular Material](https://material.angular.io/)
✅ Unit Testing with [Jest](https://jestjs.io/)
✅ End-to-End Testing with [TestCafé](https://testcafe.io/)
✅ Internationalization with [Transloco](https://github.com/ngneat/transloco)
✅ Auto documentation with [Compodoc](https://compodoc.app/) 
✅ Analyse your project with [webpack-bundle-analyzer](https://www.npmjs.com/package/webpack-bundle-analyzer)
✅ [Docker](https://www.docker.com/)
✅ [ESLint](https://eslint.org/)
✅ [Prettier](https://prettier.io/)
✅ [Commit Linting](https://github.com/conventional-changelog/commitlint)

## Demo

[![StackBlitz Demo](https://user-images.githubusercontent.com/7531596/83507657-2424e180-a4c9-11ea-8e4f-b3f8e7d6b4c5.png)](https://stackblitz.com/github/wlucha/angular-starter)

## Install / Development

```bash
# Clone the project
$ git clone https://github.com/wlucha/angular-starter
$ cd angular-starter

# Install dependencies
$ npm install

# Start server
$ npm run start

# Open in browser: http://localhost:4200
```

## Docker Deployment

```bash
# Build Docker image
$ docker build . -t angular-starter

# Run Docker Container
$ docker run -p 3000:80 angular-starter
```

## Docker Hub

https://hub.docker.com/r/wlucha/angular-starter

## Commands

- `npm run start` - start the app
- `npm run lint` - lint the project
- `npm run test` - run unit tests
- `npm run build` - build the project
- `npm run build:prod` - build the project in production mode
- `npm run build:prod:stats` - build the project in product mode with stats
- `npm run analyse` - analyse bundle with [webpack-bundle-analyzer](https://github.com/webpack-contrib/webpack-bundle-analyzer)
- `npm run compodoc` - generate [compodoc](https://github.com/compodoc/compodoc) documentation
- `npm run changelog` - generate changelog
- `npm run prettier` - format the whole project

**GitHub**
https://github.com/wlucha/angular-starter
My SSH Portal WhitePaper
Tags: blockchain, web3, opensource
Published: 2022-03-27 22:29:00

## Abstract
My SunShares (SSH) Portal is world's first platform built on top of blockchain technology and decentralized governance that allows you to join the renewable energy revolution. Running on Elrond Network, Europe's first carbon-negative blockchain, the SSH utility token will make solar energy investment accessible to everyone, delivering extraordinary benefits and returns to ordinary people.

Home owners, land or commercial property owners, in partnership with MySunShares Portal, can start generate electricity for their own immediate use, with world class photovoltaic systems. Benefit of <u>constantly reducing costs</u> or profit from selling produced electricity back to the national power grid.

We provide the end-to-end platform required to start your investment, monitor your system's status and statistics, manage ownership and benefits.

```
Content:
1. Disclaimers
2. Introduction
3. What is $SSH?
4. 

```
Drawing a rectangle in OpenCV Python
Tags: python, opencv, computervision, goooglecolab
Published: 2022-03-27 22:19:37

## How to draw a rectangle in OpenCV Python

A simplistic example for beginners on how to draw a rectangle using OpenCV in Python. Example as a [Google Colaboratory notebook](https://colab.research.google.com/drive/1f5_TTNKFDBmcZvsAUR4QtSJW9AoRL-nk#scrollTo=4A_dfKrzW0Dl).

Part of [my answer](https://www.facebook.com/groups/python/posts/1150573239116572/) to FB post at Python's group.
⚙️ ❮ Zsh-Py3-HTTP ❯ | Auto Spawned service
Tags: zsh, hacktoberfest, contributorswanted, python
Published: 2022-03-27 22:16:33

<div align="center"><h2>
  <a href="https://github.com/z-shell/zi">
  <img src="https://raw.githubusercontent.com/z-shell/zi/main/docs/images/logo.png" alt="Logo" width="60" height="60"><img/></a>

❮ ZI ❯ Service - Py3HTTP
</h2></div>

<div align="center">

[https://z.digitalclouds.dev](https://z.digitalclouds.dev) | [GitHub](https://github.com/z-shell) | [Twitter](https://twitter.com/zshell_zi)

</div>

---

<div align="center">
This **Zsh** service-plugin will serve given directory _(plugin's directory by default)_ using **Python's 3 HTTP server**.
</div>

---

### Install with ❮ [ZI](https://github.com/z-shell/zi/) ❯


The service-plugin supports loading single plugin instance per all active Zsh sessions, in background.


```shell
zi ice service'py3http'
zi light z-shell/zservice-py3http
```

---

### Explanation of Zsh-spawned services

1. First Zsh instance that will gain a lock will spawn the service.
2. Other Zsh instances will wait.
3. When you close the initial Zsh session, another Zsh will gain lock and resume the service.
⚙️ ❮ Gems & Node Modules With ZI ❯
Tags: zsh, gem, node, contributorswanted
Published: 2022-03-27 22:07:30

<div align="center">
  <a href="https://github.com/z-shell/zi">
  <img src="https://raw.githubusercontent.com/z-shell/zi/main/docs/images/logo.png" alt="Logo" width="60" height="60"><img/></a>

[https://z.digitalclouds.dev](https://z.digitalclouds.dev) | [GitHub](https://github.com/z-shell) | [Twitter](https://twitter.com/zshell_zi)

---

With use of the [bin-gem-node](https://github.com/z-shell/z-a-bin-gem-node) annex you can install Ruby Gems and Node modules in an interesting way:

- they'll be installed in the plugin's or snippet's directory,
- an automatic function will be provided to run the binary that's provided by the package.


This has several benefits. For example, no `$PATH` alteration is required in the `.zprofile` file. Also, the package will be automatically updated on `zi update`. Plus, the installation will be isolated from other packages – multiple packages not be put in a single place.

An example ZI invocation that installs the `remark` tool that can be used to convert Markdown documents into man pages:

```shell
zi ice wait'2' lucid id-as'remark' node'remark <- !remark-cli; remark-man'
zi snippet /dev/null
```

It is snippet-based. An example plugin-based invocation:

```shell
zi ice wait'2' lucid id-as'remark' node'remark <- !remark-cli; remark-man'
zi load z-shell/null
```

It has an advantage – it will delete the `remark` function when unloading the plugin.


The exclamation-mark before `!remark-cli` is important – it causes the automatic function invoking the binary to be created.

More information can be found on the [bin-gem-node annex page](https://github.com/z-shell/z-a-bin-gem-node).

The command installs 2 node modules – `remark-cli` and `remark-man` (the backend for the `remark` converter – `remark` can convert also to other formats).

By using the exclamation-mark and the `<-` pointer it also requests the function that will run the `remark` binary to be created. The function has the following body:

```shell
remark () {
	local bindir="/root/.zi/plugins/remark/node_modules/.bin"
        local -x NODE_PATH="/root/.zi/plugins/remark2"/node_modules
        "$bindir"/"remark" "$@"
}
```

As it can be seen it ultimately provides the `remark` tool to the command line.
⚙️ ❮ Nickname a plugin or snippet ❯
Tags: zsh, hacktoberfest, contributorswanted, productivity
Published: 2022-03-27 22:03:32

<div align="center">
  <a href="https://github.com/z-shell/zi">
  <img src="https://raw.githubusercontent.com/z-shell/zi/main/docs/images/logo.png" alt="Logo" width="60" height="60"><img/></a>

[https://z.digitalclouds.dev](https://z.digitalclouds.dev) | [GitHub](https://github.com/z-shell) | [Twitter](https://twitter.com/zshell_zi)

---

ZI supports `loading a plugin or snippet with a NICK-NAME`. Set the nickname through the new `id-as''` ice-mod.

For example, one could try to load `docker/compose` from GitHub **binary releases**:

```shell
zi ice as"program" from"gh-r" mv"docker-compose* -> docker-compose"
zi light "docker/compose"
```

This registers plugin under **ID** `docker/compose`. Now the user could want to load a **completion** from GitHub repository (not the binary release catalog) also called `docker/compose`. The two IDs, both being **docker/compose**, will collide. The user can however resolve the conflict via `id-as''` ice-mod by loading the completion under a **nick-name** `dc-completion`:

```shell
zi ice as"completion" id-as"dc-completion"
zi load docker/compose
```

The completion is now seen under ID `dc-completion`. Issuing `zi report dc-completion` works, so as other ZI commands:

```
 ▲ ~ zi report dc-completion
Plugin report for dc-completion
-------------------------------

Completions:
_docker-compose [enabled]
```

This can be also used to nickname snippets. For example, you can use this to create handlers in place of long urls:

```shell
zi ice as"program" id-as"git-unique"
zi snippet https://github.com/Osse/git-scripts/blob/master/git-unique
```

`zi delete git-unique` will work, `zi times` will show `git-unique` instead of the URL, etc.
Breve resumo dos meus projetos desta semana
Tags: braziliandevs, brasil
Published: 2022-03-27 21:01:48

Bom dia, boa tarde e quem sabe boa noite a quem este post possa interessar. Mais uma vez venho compartilhar o que fiz esta semana relacionado aos meus projetos pessoais. Tentarei ser breve aqui.

Pra quem ainda não sabe na semana passada publiquei um post só dizendo que não estava bem pra estudar, e nem pra nada sinceramente, e só coloquei uma tag famosa (ou brasil ou braziliandev) porque não queria mesmo que muitas pessoas o lessem. E pra quem não lembra estou com praticamente dois projetos pessoais esses dias, um é treinamento de angular que decidi usar o appideas pra fazer os projetos e outro é um projeto de plataforma de blog que criei já o back end e agora estou fazendo o frontend. O que dá angular ou angular.

### Tá continue...

E essa semana voltei a desenvolver o frontend da aplicação de blog com angular. Já havia desenvolvido a tela inicial (que carrega os posts com a barra de menu). E então fiz algumas coisas nele, movi a parte dos posts do blog para um componente (que dei o nome de index-posts) e deixei a barra de menu com o appcomponent.

Para fazer essa transição foi relativamente simples, só copiei e colei a div (container, posts, completa) no componente criado. Copiei também a parte do css relacionado a isso. E colei a lógica do arquivo .ts (que fará carregar os posts).

Criei um componente para registros de usuários onde no html simplesmente adicionei os campos referentes a um usuario (email, senha, nome e bio) e no css só enlargueci eles para ocupar a largura da tela. No arquivo .ts eu simplesmente falei para dar um console.warn e mostrar os dados inseridos no console (depois terei de implementar a lógica de inserir o usuário). Ah e coloquei para que o item do menu que criei na ultima vez (que tinha um item lá para registrar).

A imagem abaixo mostra o item de menu que citei...
![Imagem mostrando o menuitem que criei em uma das semanas passadas](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5iry951gqk84nqkeub2q.png)

E aqui abaixo como está o componente criado.
![Imagem mostrando como está ficando o design do aplicativo e do novo componente criado.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mrpda1knne7i0w8y07b7.png)

### E aí teve alguma dificuldade com o angular??

Minha maior dificuldade foi e está sendo para exibir esse componente. Primeiramente queria que quando abrisse o componente de registro fechasse o index-posts, mas como o angular foi feito para single page ele abre na mesma página que o index-posts (exibindo assim a página de registro e os posts). Se alguém souber como fazer isso eu agradeço imensamente. E o resto (que é chamar o componente quando clicar no menuitem) até que foi tranquilo...

E vamos aí tentando continuar a vida e os projetos pessoais de estudo.

### Agradecimentos

Agradeço a todos que leem estes meus posts (registro de atividades em projetos pessoais) vocês são demais :-) mesmo...

Semana que vem posto o que fizer mais.
[TIL] Cloudflare origin certificate limitation
Tags: ssl, domains, cpanel
Published: 2022-03-27 21:30:18

> This will be a series of issues that I faced and found a solution for, which could help someone or my future self

Cloudflare provides SSL out of the box and also you can generate origin certificate that you can use to add HTTPS to your website and its subdomains via the usage of wildcards

But unfortunately, this had some limitation so it only applies for first level subdomains.

Issues Related:
- ERR_SSL_VERSION_OR_CIPHER_MISMATCH
- ssl3_read_bytes:sslv3 alert handshake failure

References:
- https://support.cloudflare.com/hc/en-us/articles/200170566-Troubleshooting-SSL-errors#h_55e4d315-c60d-4798-9c4c-c75d9baed1b7
- https://stackoverflow.com/questions/70546503/cloudflare-ssl-for-staging-subdomain-sslv3-alert-handshake-failure
object oriented programming in Javascript (part 2)
Tags: javascript, programming, tutorial, beginners
Published: 2022-03-27 21:29:24

in the last post we talked about the basics of oop in Javascript.
in this post we will explain constructor functions in more detail and add some methods to our blueprint that we created

## How constructor functions work
we learned that to create an object from our blueprint we created we do:

``` javascript
const customer = new Customer("Alex", "alex@gmail.com", "12", {});
```
what's strange about this is that **new** keyword used in the function call and it is important to understand why we use it.
the new keyword does 3 things:

- it creates a new empty object
- it calls the function with the this keyword set to that new empty object
- it makes the function return that object after execution

this explains why we attach the props to the this object inside the function

### summary: 
the function is called with the this keyword set to an empty object, it attaches the passed props to that object, it returns that object with all the props without using a return statement

now that you understand how it all works try to make the Food constructor function with a name, description and an image.

## Adding methods to the constructor function
we will add 2 methods to the Customer function, one for changing settings and one for ordering a meal
``` javascript
function Customer(name, email, password, settings, cart) {
  this.name = name;
  this.email = email;
  this.password = password;
  this.settings = settings;
  this.cart = cart;
  this.setSettings = function(newSettings) {
    this.settings = newSettings;
  }
  this.orderFood = function(food) {
    console.log(`ordering ${food}`);
  }
}
```
as you can see adding methods is easy, now let's see them in action

``` javascript
customer.setSettings({ notifications: true });
customer.orderFood('Pizza'); // ordering Pizza
```
however adding methods this way is not the best, if you have few instances this should be ok but if you have a lot of instances it's going to be a problem because it will consume more memory than needed.
in the next post we will discuss a better way of adding methods

**note: feel free to add more information or give feedback in the comments**