teleren/devto huggingface dataset:
前辈从业多年的心得分享 - 读《这就是软件工程师》
Published: 2023-09-07 15:14:11


这本书一开始是从左耳朵耗子的推特上看到的出版消息，是耗子叔和郄小虎等几位前辈分享的各自从业多年的经验和心得，在书中得到的启发：

- 看书看文档能让你知道 why，而看代码写代码会让你知道 how。
- 多看牛人代码，多看牛人的解决办法和思路可以发现门道。
- 和身边的人搭伙学习。
- 避免 X-Y 问题：
    - 本想要解决问题 X，私以为可以用 Y 来解决，但又不知道 Y 怎么做，所以去问别人 Y 怎么做，当大家精力全都放到了 Y 上时，回头发现 Y 并不能很好的解决问题 X，造成大量浪费内耗。
    - 避免的方法：要不断拼命追问做这件事的初衷是什么，到底为了解决什么问题。
- 使用知识树或图谱系统学习，从知识点到知识面的扩展。
- 被动学习与主动学习效率差很多，被动学习一般都是输入的，如阅读，视听。主动学习一般都是输出的，如写博客文章实践和教给他人。
What's the Most Enjoyable Part of Your Job?
Tags: discuss, beginners, codenewbie
Published: 2023-09-07 15:11:07

_Get a glimpse into the daily experiences, work routines, and unique perspectives of tech professionals, both novice and experienced alike, in "A Day in the Life."_

> What's the most enjoyable part of your job?

Follow the [CodeNewbie Org](https://dev.to/codenewbieteam) and [#codenewbie](https://dev.to/t/codenewbie) for more discussions and online camaraderie!

*{% embed* https://dev.to/codenewbieteam *%}*
Learning Web Development with HTML To React: The Ultimate Guide
Tags: webdev, beginners, javascript, tutorial
Published: 2023-09-07 15:08:12

### Note
I want tell you that this not my product, i want to write my honest review on it.
## Intro
Web development is an exciting field that requires a combination of technical skills and creativity. HTML, CSS, and JavaScript are the building blocks of web development, and mastering these technologies is essential for creating beautiful and functional websites. If you're looking to learn web development, HTML To React: The Ultimate Guide is a comprehensive resource that can help you get started.
HTML To React: The Ultimate Guide is a book written by sleeplessyogi that teaches you how to build scalable, production-ready web applications using React. The book covers a wide range of topics, including HTML, CSS, JavaScript, React, and more. It is designed for both beginners and experienced developers who want to improve their skills.
### Here are some of the features of HTML To React: The Ultimate Guide:

- Comprehensive coverage of web development technologies
- Step-by-step tutorials and examples
- Practical tips and best practices
- Real-world projects to apply your skills
- Free lessons available online.

If you're wondering whether HTML To React: The Ultimate Guide is worth the investment, you can check out the reviews on Gumroad. Many users have found the book to be helpful and informative. Additionally, sleeplessyogi offers free lessons from the book that can give you a taste of what to expect.
Whether you're a student, a professional, or just someone who wants to learn web development, HTML To React: The Ultimate Guide is a valuable resource that can help you achieve your goals. With its comprehensive coverage and practical approach, you can gain the skills and knowledge you need to create amazing web applications.

{% embed https://ngninja.gumroad.com/l/html2react?a=320960723 %}
Conectando o VS Community ao Azure DevOps
Tags: beginners, devops, git, azuredevops
Published: 2023-09-07 14:48:18

**Primeiros Passos**
<u>Instale o Visual Studio Community</u>: Se você ainda não tem, baixe e instale o Visual Studio Community do site oficial.

**Conectando ao Azure DevOps**
<u>Abra o Visual Studio Community</u>: Inicie o programa e você vai ver a tela inicial.


![vs studio community home screen](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jxn7r0dxn0q5laf4pgec.png)

<u>Vá para "Team Explorer"</u>: Você pode encontrar essa opção no menu "View" e depois em "Team Explorer", ou simplesmente pressionando Ctrl + \, Ctrl + M.

![team explorer tab](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d6qnwykygv8nham2456r.png)

**Conecte-se ao Azure DevOps**:

No "Team Explorer", clique em "Connect to a Project".
Isso abrirá uma janela nova. Clique em "Add Azure DevOps Server".
Digite a URL:

Uma janela vai aparecer pedindo a URL do Azure DevOps.
Digite a URL do seu Azure DevOps. Geralmente é algo como https://dev.azure.com/NomeDaSuaOrganizacao/SeuProjeto.

<u>Faça Login</u>: Você será solicitado a entrar com suas credenciais (usuário e senha ou token).

<u>Escolha o Projeto</u>: Depois de logado, você verá uma lista de projetos. Clique no projeto em que você quer trabalhar.

<u>Clone ou Abra o Projeto</u>: Você terá a opção de clonar o repositório para o seu computador ou abrir um projeto já clonado.

![Cloning project inside of vs comunity](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vrisv25l6d8efbvsasyz.png)

🎉 Pronto! 🎉
Agora você está conectado ao Azure DevOps e pronto para começar a trabalhar no seu projeto direto do Visual Studio Community!

Espero que esse tutorial seja útil e fácil de seguir! 😊
Ways to Fix Connections Game
Tags: game, puzzle
Published: 2023-09-07 07:04:45

[Connections game](https://connectionsgame.io)" is a general word, thus it's difficult to provide a precise response in isolation. However, I'll presume you're referring to a well-known game or puzzle where the object is to link numerous objects, such dots, lines, or routes, in order to complete a task. One example of this kind of game is "Connect the Dots" or "Dots and Boxes." If this isn't the game you're thinking of, give me additional information and I'll be delighted to assist as needed.

Here's a quick explanation and successful method for "Connect the Dots" or "Dots and Boxes," assuming you're talking about them.

Connecting the dots on a grid to form squares is the aim of the game "Connect the Dots" or "Dots and Boxes". The winner is the player who fills up the most squares.

Rules:

By drawing a horizontal or vertical line between two neighboring dots, players alternate turns.
A player claims a square by placing their initial within it after sketching the fourth side of the square.
A player receives an additional turn for completing a square.
The player who has the most claimed squares wins when all the dots are joined.
Strategy:

Go for Immediate Squares: At first, concentrate on finishing squares that are practically finished. With the help of this tactic, you may continue to command the game board and earn more turns.

Force Opponent into Unfavorable Moves: Try to create scenarios where your opponent is compelled to leave a square only half filled, allowing you to finish it on your subsequent turn. This may be accomplished by avoiding making connections between dots that would make it simple for your adversary to complete squares.

Control the Center: When the grid is bigger, it might be beneficial to control the center. Compared to dots close to the edges, the center dots provide more chances to form squares.

Plan Ahead: Consider how your actions may position your adversary to complete squares. Make an effort to predict their maneuvers and thwart any possible successes.

Avoid Giving Your Opponent Free Turns: Be cautious not to give your opponent free turns when they may easily finish squares. Always consider the consequences of your decisions.

Keep in mind that edge dots only need two connecting lines rather than three, making it simpler to convert them into squares. Take advantage of this and, if you can, secure edge squares.

In general, the game calls for a combination of strategy, forethought, and flexibility. You'll become better at seeing patterns and coming up with winning ideas the more you play.

If this is not the game you were thinking of, please elaborate or spell out the specifics, and I'll be happy to help you further.
Como clonar um projeto no Azure DevOps
Tags: webdev, devops, azuredevops, beginners
Published: 2023-09-07 14:31:40

**Primeiros Passos** 
<u>Abra o Azure DevOps</u>: Vá até o site do Azure DevOps e faça login.

<u>Escolha o Projeto</u>: No menu de repositórios do lado esquerdo na barra de menus, clique em **file** e selecione o projeto que você quer copiar para o seu computador.

**Opção 1: Usando Git CLI (Linha de Comando)**

<u>Botão "Clone"</u>: Vai ter um botão chamado "clone repository" no canto superior direito. Clique nele!

<u>Copie o Link</u>: Vai aparecer um link HTTPS. Copie ele.

<u>Abra o Prompt de Comando (Git CLI)</u>: Vá até a pasta onde você quer colocar o projeto e abra o Git CLI.
Se você não tem o Git CLI, baixe aqui.

<u>Cole o Comando</u>: Digite git clone e depois cole o link que você copiou. Vai ficar assim:
`git clone https://www.seurepositorio.com/seuprojeto`

<u>Aperte Enter</u>: Pronto! Seu projeto vai ser copiado para o seu computador.

**Opção 2: Usando Visual Studio Code** 

<u>Botão "Clone in VS Code"</u>: Clique nele, em vez de copiar o link HTTPS.

<u>Siga as Instruções</u>: O Visual Studio Code vai abrir e você só precisa seguir o que ele exibir na tela.

**Opção 3: Usando Visual Studio Community**

<u>Abra o Visual Studio Community</u>: Inicie o programa e vá para a tela inicial.

<u>Clique em "Clone a Repository"</u>: Fica geralmente no canto inferior direito.

<u>Cole o Link HTTPS</u>: No campo "Repository Location", cole o link HTTPS que você copiou do Azure DevOps.

<u>Clique em "Clone"</u>: Seu projeto vai ser baixado e aberto no Visual Studio Community.

**Caso o Projeto Use Token**

<u>Clique em "Generate Git Credentials"</u>: No Azure DevOps, essa opção vai aparecer se você precisar de um token.

<u>Repita o Passo</u>: Escolha uma das três opções acima e tente clonar o projeto de novo.
Lazy Load no Vue
Tags: webdev, vue, javascript, programming
Published: 2023-09-07 14:26:30

Olá dev, hoje o papo vai ser sobre Vue, mais especificamente sobre Vue Router.

Recentemente descobri um que existe duas formas de se fazer o router, a primeira, que carrega todos os módulos "páginas" no primeiro load e a outra que é onde cada módulo carrega conforme você acessa a página.

Vamos aos exemplos…

```
import {createRouter, createWebHistory} from "vue-router";
import LoginView from "../../vue/view/login/LoginView.vue";
import AboutView from "../../vue/view/about/AboutView.vue";

const routes = [
    {
        path: "/sobre",
        name: "about",
        component: AboutView
    },
    {
        path: "/login",
        name: "login",
        component: LoginView
    }
]

const router = createRouter({
    history: createWebHistory(),
    routes
})

export default router
```

Nesse exemplo, assim que carregar a página no primeiro load, vai ser carregado os módulos LoginView e AboutView, junto com todos os seus componentes internos.

A desvantagem dessa forma de utilizar essa forma é que o primeiro load fica com toda a carga dos módulos e componentes que estão sendo utilizados em qualquer rota do arquivo.

Em meus estudos recentes, onde eu estava melhorando o sistema de autenticação da minha aplicação no Vue, e me deparei com uma outra forma de se fazer isso, que basicamente você ira dar o import no atributo component, ficando assim.

```
import {createRouter, createWebHistory} from "vue-router";

const routes = [
    {
        path: "/sobre",
        name: "about",
        component: () => import("../../vue/view/about/AboutView.vue"),
    },
    {
        path: "/login",
        name: "login",
        component: () => import("../../vue/view/login/LoginView.vue"),    
    }
]

const router = createRouter({
    history: createWebHistory(),
    routes
})

export default router
```

Dessa forma, não damos o import no topo do arquivo, e o navegador vai carregar o módulo do LoginView e seus compoentes, somente quando a página de login for acessada.

Hoje o assunto era esse, algo rápido mesmo, até mais dev!
Stripe API: Attaching File (ex PDF) to an Object (ex Customer)?
Published: 2023-09-07 14:26:27

Greetings

Stripe API has a way of uploading files:
https://stripe.com/docs/file-upload

I aim to attach (aka associate, reference) this uploaded file to an object (e.g., customer, product, subscription...).

Could you tell me how this can be done?
Quality Summit 2023
Tags: quali, javascript, tutorial, cypress
Published: 2023-09-07 14:26:18


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

https://www.linkedin.com/posts/kailashpathak_speakerspotlight-cypress-qualityassurance-activity-7105522412963659776-prE0?utm_source=share&utm_medium=member_desktop

Join us in welcoming our international speaker Kailash Pathak, the Senior Quality Lead Manager at 3Pillar Global and Cypress.io Ambassador from India, to Quality Summit 2023.

He'll be unravelling the mysteries of 'Beyond the Surface: Unmasking Cypress's Features for Quality Assurance.'

Get ready to dive deep into the world of Cypress.io with Kailash. Don't miss this enlightening session at Quality Summit 2023!

Register now -  https://lnkd.in/g84FubjD
What makes Go's compiler so FAST?
Tags: go, programming, computerscience
Published: 2023-09-07 14:26:05

One of the best features of Go is its extremely quick compiler.
However, what exactly did the Go team do to achieve this?
Why is the Go compiler so fast?
Here are the reasons.

## Go is simple

- Go only has 20-something keywords in the language.
- Compared to Java in the 60s and close to 100 for C++, for example.
- This helps with shortening the compilation time.

## No unused components

- You can't compile with unused components like variables or imports.
- Your IDE or code editor will also constantly complain during your development.
- This helps reduce unnecessary instructions to compile at the end.

## No symbol table when parsing

- A symbol table is a data structure for storing entities like variable/function names.
- Parsing in languages like C/C++ requires the symbol table.
- Note that the symbol table is still used for full compilation, just not during parsing in Go, which reduces part of compilation time.
No header files.
- C/C++ uses header files to connect the different components together.
- These header files take extra time to load, parse then compile.
- Go, on the other hand, doesn't use header files.

### Prioritisation

- Fast compilation speed has been the priority since the birth of Go.
- As a result, other features of Go have to be designed with fast compilation in mind.
- Such prioritisation makes a difference, especially over time.


Hope this helps you get some ideas on this subject!
JavaScript Arrays - Index Values and Adding to an Array
Tags: webdev, javascript, beginners, arrays
Published: 2023-09-07 14:02:33

# Intro
Arrays are common JavaScript variables which hold more than 1 value rather than just using separate variables. For example, using basic JavaScript, we could list each value independently or we could list them in an array.


const fruit1 = "apple";
const fruit2 = "orange";
const fruit3 = "grape";
const fruit4 = "strawberry";


const fruit = ["apple", "orange", "grape", "strawberry"];

Arrays can be manipulated -added to, subtracted from, or render only certain values. Arrays can also be listed vertically, for clarity, when needed:

const fruit = [
    "apple",
    "orange",
    "grape",
    "strawberry"
];


## Index Values
Each array item has its own index number corresponding to its place in the array.[1] This numbering system starts at 0 and goes up to as many objects are in the array. For example, the index of "apple" is 0, so fruit[0] = "apple". Other values include:

fruit[1] = "orange"
fruit[2] = "grape"
fruit[3] = "strawberry"

So, this array has 4 values but only goes up to the number 3 because the index value of the first item is always 0. 

# Adding to an Array
There are a couple methods for adding items to an array. We can use push() to add something to the end of an array. To add something to the beginning, we would use the unshift method.[2] For our example, this would look like the following:

Adding to the End
const fruit = ["apple", "orange", "grape", "strawberry"];
fruit.push("dragon fruit")
console.log(fruit) would show the value:
["apple", "orange", "grape", "strawberry", "dragon fruit"]


Adding to the beginning
const fruit = ["apple", "orange", "grape", "strawberry"];
fruit.unshift("dragon fruit")
console.log(fruit) would show the value:
["dragon fruit", "apple", "orange", "grape", "strawberry"]

In each of these cases, the original array is being modified, we are not creating new arrays.



-----------------------------------------------------------
Sources Consulted:
1. https://www.w3schools.com/js/js_arrays.asp
2. Fluke, Joshua. '5 Must Know Interview Questions for Javascript!' https://www.youtube.com/watch?v=6Wzj7kxfRdI
Best Graphic Design Company in Chennai | Hubsem Software Solutions
Published: 2023-09-07 14:00:12

Hubsem, the leading graphic design company in Chennai, delivers excellence in every project. Contact us to elevate your brand's visual identity.For More Info Call Us:  +91 63858 51234 or [Visit Our Website](https://hubsem.com/graphic-design-company-in-chennai/)


#graphicdesigncompanychennai  #bestgraphicdesignersinchennai #graphicdesignservicesinchennai #bestgraphicdesignagencyinchennai #motiongraphicscompanyinchennai
Sharing the WWW with a remote host that has no internet connection
Published: 2023-09-07 13:58:12

Recently I had the following issue with my Turtlebots: They are only connected to a local network without a route to an uplink with internet connection. This is okay as I just want them to communicate with other ROS2 devices inside the local network. But sometimes I want to update or install a new package with `apt` or `pip`. Usually the Turtlebot/Pi would need a internet connection for this. But inside this local network only my notebook has internet access through a different network interface. I could use the notebook as a router but I don't want to get into the hassle of doing this, as network stuff with ROS2 is already complex enough.

But there is another way to achieve this communication from the Turtlebot to the WWW via my notebook: the [SOCKS5](https://en.wikipedia.org/wiki/SOCKS) proxy.

### SSH SOCKS5 proxy

When I `ssh` onto the Turtlebot (`remotehost`) I can use the `-R` option to open a SOCKS5 proxy port on the `remotehost` which forwards the communication to my notebook.

With `ssh -R 1080 user@remotehost` I open the connection on the default SOCKS5 port.

We can check if the proxy works with `curl --socks5-hostname localhost http://captive.apple.com` which should return:
```html
<HTML><HEAD><TITLE>Success</TITLE></HEAD><BODY>Success</BODY></HTML>
```
The `--socks5-hostname` is especially important here, as this forwards the DNS resolving on to the notebook, where as `--socks5` would try to resolve it on the `remotehost` (which can't do it because it has no internet connection).

### APT

Now we have to tell `apt` to use this proxy. For this we have to add a config to `/etc/apt/apt.conf.d/` and write `Acquire::http::proxy "socks5h://localhost:1080";` into it.
This one liner does it: 
```bash
echo "Acquire::http::proxy "socks5h://localhost:1080";"  | sudo tee -a /etc/apt/apt.conf.d/12proxy
```
(You can remove the port, as `1080` is the default one, but I like it more explicit as it doesn't hurt inside such config files)
As with `curl` it is important to use `Acquire::http::proxy` and not `Acquire::socks::proxy` with `socks5h` and not `socks5` as only the combination used above forwards the DNS resolving to the notebook.

Now you can happily run `sudo apt update` and you should see something like: 
`0% [Connecting to SOCKS5h proxy (socks5h://localhost:1080)]`

### pip
Out of the box, `pip` can't use SOCKS sockets. We first have to install `pysocks`. We could do this by downloading it with `curl` or `scp` the file from the notebook, but the more convenient way would be to install it with `apt` (this isn't ideal, but bootstrapping never is):
`sudo apt install python3-socks`

Now we can install any python package with `pip`:
`pip install --proxy socks5h://localhost:1080 <package>`

### tsocks for everything else
If I would have other software that I want to connect via the SOCKS5 socket, but doesn't bring support for it, I would try using [`tsocks`](https://linux.die.net/man/8/tsocks).
etcd db cleanup maintenance and automation without downtime
Published: 2023-09-07 13:54:29

---
title: etcd db cleanup maintenance and automation without downtime
published: true
description: 
tags: 
# cover_image: https://direct_url_to_image.jpg
# Use a ratio of 100:42 for best results.
# published_at: 2023-09-07 13:53 +0000
---
Docker Desctop使わずにWSL2でDockerを使う
Tags: wsl, docker
Published: 2023-09-07 13:50:46

[Docker Desktop を利用するには支払いが必要ですか](https://matsuand.github.io/docs.docker.jp.onthefly/desktop/faqs/#do-i-need-to-pay-to-use-docker-desktop)

個人利用なら Docker Desktop は無料で利用できるが、ビジネス目的での利用だと少し制限がある。

別に個人で利用している分には Docker Desctop を使い続ければいいのだが、使わずに WSL 上の Ubuntu にインストールして動かすこともできるらしかったので試してみた。
（いつか個人利用でも有償になった時のために）

---

## 目次

- [さっそくインストールしてみよう](#さっそくインストールしてみよう)
- [起動設定](#起動設定)
- [できあがり](#できあがり)

---

## さっそくインストールしてみよう

[Install Docker Engine on Ubuntu](https://docs.docker.com/engine/install/ubuntu/)
↑ Docker が公式で出している Ubuntu OS に Docker Engine をインストールする方法。
書いてある通りに進めていけば Docker 動くようになるとのこと。めちゃ簡単。

[Install using the Apt repository](https://docs.docker.com/engine/install/ubuntu/#install-using-the-repository)
↑ インストールするための準備コマンドが記載されている項目。

若干ライブラリが足りてなかったりするので、
https://dev.to/felipecrs/simply-run-docker-on-wsl2-3o8
を参考に以下のコマンドを実施。

```
# Add Docker's official GPG key:
$ sudo apt-get update
$ sudo apt-get install ca-certificates curl gnupg lsb-release
$ sudo mkdir -p /etc/apt/keyrings
$ curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /etc/apt/keyrings/docker.gpg

# Add the repository to Apt sources:
$ echo \
"deb [arch=$(dpkg --print-architecture) signed-by=/etc/apt/keyrings/docker.gpg] https://download.docker.com/linux/ubuntu \
$(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null

$ sudo apt-get update
```

---

そして、最新版で問題ないので以下のコマンドでインストール。

```
$ sudo apt-get install docker-ce docker-ce-cli containerd.io docker-buildx-plugin docker-compose-plugin
```

ちなみにバージョン指定してインストールする方法は以下。

```
## バージョン情報の確認
$ apt-cache madison docker-ce | awk '{ print $3 }'
5:24.0.0-1~ubuntu.22.04~jammy
5:23.0.6-1~ubuntu.22.04~jammy
...

## インストールしたいバージョンを指定してインストール
$ VERSION_STRING=5:24.0.0-1~ubuntu.22.04~jammy
$ sudo apt-get install docker-ce=$VERSION_STRING docker-ce-cli=$VERSION_STRING containerd.io docker-buildx-plugin docker-compose-plugin
```

---

## 起動設定

まず Docker のデーモンを立ち上げる上での管理グループ & ユーザーを作成する。
※Docker Desctop をインストールしたことがあるなら既に作成されているはずなのでこの手順は不要。

```
# Ensures docker group exists
$ sudo groupadd docker

# Ensures you are part of it
$ sudo usermod -aG docker $USER
```

---

Ubuntu にログインするとデーモンが立ち上がるように bash に設定を追記

```
$ vi ~/.profile
if service docker status 2>&1 | grep -q "is not running"; then
    wsl.exe -d "${WSL_DISTRO_NAME}" -u root -e /usr/sbin/service docker start >/dev/null 2>&1
fi
```

---

## できあがり

```
$ /usr/sbin/service docker status
 * Docker is running

$ docker --version
Docker version 24.0.6, build ed223bc

$ docker compose version
Docker Compose version v2.21.0
```

Ubuntu にログインして、Docker デーモンが起動していること、バージョン情報が表示されるので正常インストールされていることが確認できた。