teleren/devto huggingface dataset:
Performance no REDIS com Pipelining
Tags: redis, performance, backend, database
Published: 2023-05-23 20:33:46

## O que é o Redis Pipelining? 
É uma técnica para melhorar o desempenho que permite enviar vários comandos de uma só vez sem esperar pela resposta de cada comando individual. 

> Fonte: https://redis.io/docs/manual/pipelining/

Através dessa imagem é possível ver a diferença que o pipelining faz na execução: 

![Performance do Redis com e sem o Pipelining](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z7hwm9dhewdtkex7fiu3.png) 
> Fonte: https://kn100.me/redis-pipelining/

## Quando ele é útil? 
O Pipeline é muito útil em situações em que há muitas operações de leitura/escrita no Redis. Ao usar um pipeline, é possível reduzir significativamente o custo de latência associado ao tempo de ida e volta, além disso, ele melhora muito o número de operações que você pode executar por segundo.

Outro uso interessante para o Pipeline, é para implementar transações atômicas, garantindo que um conjunto de operações seja executado como uma única unidade. Isso é possível porque o Redis Pipeline permite que os comandos sejam agrupados em uma transação que só será executada quando todos os comandos no pipeline forem enviados e retornarem com sucesso.

#Caso de uso
No trabalho, passei por uma situação a qual precisava melhorar a performance de uma Lambda (Python) que consumia de uma fila SQS e em seguida realizava várias operações de leitura e escrita no REDIS. 

**PROBLEMA**
Devido a quantidade de operações realizadas a cada mensagem recebida, algumas acabavam não sendo processadas devido o timeout de 30 segundos configurado na lambda. 
![Gráfico de duração da Lambda](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w3o1rkke1phoicobf9c1.png)
Gráfico de duração da execução (em milissegundos) da lambda antes de aplicar as técnicas de performance, chegando a picos de 27 segundos de duração: 

A fila a qual a lambda consumia as mensagens, recebia cargas com até 2.500 mensagens para processar:

![Dados da fila](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tps0ln9bwz81j4iltsz2.png)

**RESULTADOS APÓS PERFORMANCE**

Após aplicar o Redis pipelining, alguns dos resultados que obtivemos na Lambda: 

![Desempenho da Lambda](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c0a0ueyuoawz5sz70s1t.png) 
> O maior pico de duração foi de 12,6 segundos. 

#Conclusão

O resultado foi bem positivo, tendo em vista que na maioria dos casos chegaram a reduzir pela metade o tempo de duração, além disto, em cenários de processamento com o mesmo número de mensagem não tivemos mais nenhum caso de timeout. 

Após o uso do Redis Pipelining, também foram feitas algumas refatorações e mudanças na forma de processar a mensagem para melhorar ainda mais o tempo de execução da lambda.
Getting Started with Tailwind CSS
Tags: javascript, api, frontend, bash
Published: 2023-05-23 20:23:10

[Tailwind](https://tailwindcss.com/) CSS is a Utility-first CSS Framework for building modern, user-friendly UI components. By Utility first, I mean Tailwind focuses on the singularity of CSS classes, ensuring a single class does exactly one thing.

Want to give Tailwind CSS a spin, but you’re not sure where to start? Let me show you.

---
**Requirements**

- Node.js v12 and above setup.
- Basic HTML and CSS knowledge.

The installation guide has detailed descriptions on how to get started with integrating tailwind CSS with Javascript Frontend Frameworks.


![Frontend frameworks](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5oy0ora1dz4w6ygjmgye.png)

If you, only have basic experience with HTML and CSS and want to get started with Tailwind, first, ensure you run Node version v12.16 or above. Next, you’ll want first to install NPX globally. If you are running NPM version 5 and above, npx should already come pre-bundled with npm.

```bash
npm i -g npx
```
Once it’s installed, create a basic web project. I’ll keep it as simple as possible. Our project structure would look something like this:

![Project folder](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/er869fjwozrwtsdcka8x.png)

Now from your terminal, change to the styles directory and run this command to generate a compiled tailwind.css file within that directory:

```bash
npx tailwindcss-cli@latest build -o tailwind.css
```
Once that’s successfully installed, you should see a prompt in your terminal like this.

![Terminal prompt](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gjqe1jb2ght5qskj06yd.png)

A new file, “tailwind.css” should now live in your styles directory.

![Styles directory](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hvghm87iabz3rfhjxmrh.png)
You can now link this CSS file in your index.html file like you normally would any stylesheet.

![CSS file](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v4uh6f6qngm3p479y746.png)
You’re good to go from here on. Open the HTML file in your browser and start hacking. You’d only need to read the [documentation](https://tailwindcss.com/)to find whatever utility class you need. Check out a [demo here](http://tailwind-basic.surge.sh/).


![CUJ image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ca3oka519jtpi5oz8avp.png)

You can also find the source code for the demo here:
{% embed https://github.com/MartinsOnuoha/tailwind-basic %}

---
Cheers ☕️
How do you say... "jwt"
Tags: discuss, webdev, frontend, coding
Published: 2023-05-23 20:21:44

Have you heard of a "jwt" before ([JSON web token](https://auth0.com/docs/secure/tokens/json-web-tokens))?

It's a word we often read and write but rarely say.  

### So how do you pronounce it? 

I asked over 30 software engineers and technical operators exactly that question.  Here are a handful of their responses.

{% youtube D2D9umQMKhA %}

Turns out - there is an official pronunciation for "jwt" on the [creators's (Auth0) website.](https://auth0.com/docs/secure/tokens/json-web-tokens#:~:text=JSON%20web%20token%20(JWT)%2C,parties%20as%20a%20JSON%20object.)

```JSON web token (JWT), pronounced "jot", is an open standard (RFC 7519) that defines a compact and self-contained way for securely transmitting information between parties as a JSON object.```

But it's NOT the same way to pronounce "JWt ([Java web toolkit](https://en.wikipedia.org/wiki/JWt_(Java_web_toolkit)))". 

![JWt](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l3sq65b2yzw5ugn6fa0s.png)

```JWt (pronounced "jay-witty") is an open-source widget-centric web application framework for the Java programming language developed by Emweb.```

Want to see more tech word pronunciations by tech professionals?  Find them on [Youtube](https://www.youtube.com/@appmap/shorts).  New videos ship every Friday.
Validating age in Rails
Tags: ruby, rails, programming, webdev
Published: 2023-05-23 20:04:52

Let's say you need to add a validation for the `birthdate` column so that the User's age is between 1 and 3 (must be a toddler).


In your User model:
```ruby
validate :toddler_age

def toddler_age
  birthdate_within_range = ((4.years.ago - 1.day)..1.year.ago).cover?(birthdate)
  errors.add(:birthdate, 'must be 1-3 years old') unless birthdate_within_range
end
```
Why I havent been as active this year
Tags: webdev, frontend, productivity, career
Published: 2023-05-23 20:03:06

Why haven't you heard from me much this year? Well there are a few reasons. One, me and my family had to move fairly suddenly. Packing and unpacking as well as finding a place during a housing crisis took a lot of my time. Second, as I learned more about blogging and setting up my site I realized I had no idea what I was doing. Yes blogging about the stuff you learn is a good idea but hard to get noticed or have much impact let alone make any money. I didn't have a plan or much direction and my topic choices were too broad. I have been recently re-evaluating what it is I want to do. Starting to get a plan and put it into action. Because one of the main things I learned is if I don't have a deadline. I can work on my project forever and no one will ever see it. 


## So what do I want to do?


I want to make websites for people and businesses that help represent them and their brand. I know a big surprise huh? My plan is to go the freelance route and start my own business. I have decided to focus mainly on front end web development, Mostly design but all the other bits that go along with front end code. While I identify as a full stack developer, my main focus will be building a great UI that the client can identify with. I want to focus on profile sites and landing pages for artists/working professionals or small to medium businesses. As I feel this is a great place to start.

## time for a change


This will be a big change for me( I currently work in a factory as a laborer) so starting my own business will be exciting and new. This is a change I am very ready for. I have spent too long now where my interest in web dev is a hobby and not a "career".

My main plan for growth is to make 10 sites for friends and family free of charge and have them leave me a review. This will give me a decent portfolio with reviews to attract new clients.

The other strategy is content marketing using the blog section of my site to gain organic traffic with SEO. I Am currently trying to consult with other boutique designers in my area and see how they run their business.


Anyways that's what I have been up to. How has 2023 treated you so far?
Do you know the patterns?
Tags: flutter, dart, mobile, programming
Published: 2023-05-23 20:01:35

Hello fellow Dartisans! I hope you're ready for an exciting journey into the heart of Dart 3.0. Released on 10th May 2023, this version introduced a flock of major language features: Patterns, Records, and Class Modifiers​​. So buckle up, because we're about to dive in and explore these features with some fun examples.



## **Patterns**

Patterns, in Dart, serve as a new category of grammar. They allow you to match and destructure values, enabling the extraction of parts of an object's data in an easy and intuitive way. Let's see some of the examples I have been trying out since my B'day.

- **Extracting Information from a List**

```dart
var numList = [1, 2, 3];
var [a, b, c] = numList;
print(a + b + c); // Prints 6
```

Here we're using a list pattern to destructure the three elements from `numList` and assign them to new variables `a`, `b`, and `c`.

- **Swapping Variables**

```dart
var (a, b) = ('left', 'right');
(b, a) = (a, b); // Swap.
print('$a $b'); // Prints "right left"
```

In this case, a pattern is used to swap the values of two variables without declaring a third temporary one.

- **Destructuring Map Entries**

```dart
Map<String, int> hist = {
  'a': 23,
  'b': 100,
};

for (var MapEntry(:key, value: count) in hist.entries) {
  print('$key occurred $count times');
}
```

Here, an object pattern is used in a for-in loop to destructure the `MapEntry` objects that a `<Map>.entries` call returns, effectively iterating over the entries of a map.

- **Validating and Extracting JSON Data**

```dart
var json = {
  'user': ['Lily', 13]
};
if (json case {'user': [String name, int age]}) {
  print('User $name is $age years old');
}
```

In this example, a case pattern is used to validate and destructure a JSON object. If the object has the expected structure, the pattern destructures it into local variables, providing a declarative and less verbose way of handling JSON data.
React Emoji Picker
Published: 2023-05-23 19:48:19

Sure! Here are some more details about the react-emoji-picker library:

react-emoji-picker is a lightweight and customizable emoji picker for React. It provides a simple and intuitive interface for users to select emojis, and it's easy to integrate into your React project.

The library provides a single EmojiPicker component that you can use to add an emoji picker to your project. The EmojiPicker component accepts several props to customize its appearance and behavior, including:

**_onEmojiSelect_**: A callback function that is called when an emoji is selected. The function receives the selected emoji's Unicode representation as a parameter.
rows: The number of rows of emojis to display in the picker. Default is 6.
**_perRow_**: The number of emojis to display per row. Default is 8.
**_emojiSize_**: The size of the emojis in pixels. Default is 24.
**_pickerStyle_**: An object containing CSS styles to apply to the picker container.
In addition, the library provides a getEmojiData function that you can use to get information about all the available emojis, including their Unicode representations, names, and images.

Overall, react-emoji-picker is a simple and effective solution for adding an emoji picker to your React project. It's easy to use and customize, and it provides all the basic features you need to allow your users to express themselves with emojis.

 First, install the library using npm or yarn:
```
npm install react-emoji-picker
yarn add react-emoji-picker
```

 Import the EmojiPicker component from react-emoji-picker:

```
import React, { useState } from 'react';
import EmojiPicker from 'react-emoji-picker';
```
Add the EmojiPicker component to your component's render method:

```
function EmojiPickerExample() {
  const [selectedEmoji, setSelectedEmoji] = useState(null);

  function handleEmojiSelect(emoji) {
    setSelectedEmoji(emoji);
  }

  return (
    <div>
      <h1>Selected Emoji: {selectedEmoji}</h1>
      <EmojiPicker onEmojiSelect={handleEmojiSelect} />
    </div>
  );
}

export default EmojiPickerExample;
```
In this example, the `EmojiPicker` component is wrapped in a `div`, and the `onEmojiSelect` prop is set to a function that will be called when an emoji is selected. The `handleEmojiSelect` function updates the `selectedEmoji` state with the selected emoji's Unicode representation. Finally, the selected emoji is displayed in an `h1` tag.

Customize the EmojiPicker by passing props to it. For example, you can set the size of the emojis, the number of columns, the style of the picker, and more:

```
<EmojiPicker
  onEmojiSelect={handleEmojiSelect}
  rows={4}
  perRow={8}
  emojiSize={32}
  pickerStyle={{ position: 'absolute', bottom: '20px', right: '20px' }}
/>
```

In this example, the `rows` prop sets the number of rows to 4, the `perRow` prop sets the number of columns to 8, the `emojiSize` prop sets the size of the emojis to 32 pixels, and the `pickerStyle` prop positions the picker at the bottom right corner of the screen.
AWS VPC Flow Logs
Tags: cloud, security, devops, aws
Published: 2023-05-19 14:01:27

**Anotações sobre o AWS VPC Flow Logs para ajudar na preparação das certificações AWS.**

Até o momento as anotações são para as certificações abaixo:

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

- [Link oficial](https://docs.aws.amazon.com/pt_br/vpc/latest/userguide/flow-logs.html)

---

##**Definição do fornecedor**
_O VPC Flow Logs é um recurso que possibilita que você capture informações sobre o tráfego de IP para e proveniente de interfaces de rede da VPC._ 

---

##**Anotações gerais**

- Captura trafego da vpc, subnet e armazena no cloudwatch logs
- **Logs do trafego da VPC a nível da interface de rede da EC2 (eni)**
- Não é real-time
- **Não inspeciona os pacotes**
- Grava toda a informação que chega na EC2 e toda informação que sai a nível de rede
- Max aggregation - 1 min ou 10 min
- **Destination - Bucket S3 ou CloudWatch Logs**
- Tem como escolher no filtro - **ALL**, **Accept **or **Deny**
- **Pode-se utilizar o Athena para analisar os logs**

---

##**Formato do Log padrão**
[Documentação oficial](https://docs.aws.amazon.com/pt_br/vpc/latest/userguide/flow-logs-records-examples.html)


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

1 - _version_  -> Versão do VPC flow Logs
2 - _Account ID_ -> Account Id da AWS
3 - _Interface ID_ -> Id da interface de rede (eni)
4 - _srcaddr _ -> O endereço de IP de origem 
5 - _dstaddr _ -> Endereço de IP de destino
6 - _srcport _ -> Porta de origem
7 - _dstport _ -> Porta de destino
8 - _Protoloco_ -> Numero do protocolo
9 - _Packets_ -> Numero de pacotes transferidos
10 - _Bytes_ -> Numero de bytes transferidos
11 - _Start_ -> Inicio
12 - _end_ -> Fim
13 - _Action_-> REJECT ou ACCEPT
14 - _log status_ -> Status do Flow Log

---

##**Os logs de fluxo podem ajudar em diversas tarefas**

- Diagnosticar regras de grupo de segurança excessivamente restritivas
- Monitorar o tráfego que chega à sua instância
- Determinar a direção de entrada e saída do tráfego das interfaces de rede

---

##**Flow log data can be published to the following**

- Amazon CloudWatch Logs
- Amazon S3
- Amazon Kinesis Data Firehose

---

##**Não captura esses logs**

- DNS
- Ativação da licença do Windows
- Metadata - 169.254.169.254
- DHCP

---

##**Levels**

- VPC
- Subnet
- Network Interface

---

##**Formato do Log personalizado**

- Os campos adicionais incluem uma variedade de informações, como região, az-id, tcp-flags (conjunto), caminho de tráfego, direção de fluxo e muito mais. 
- Os logs de fluxo de VPC não fornecem visibilidade de carga útil no tráfego
The risk of using Open Source libraries - do you have the source code?
Tags: opensource, programming, discuss, devops
Published: 2023-05-23 19:31:37

---
title: The risk of using Open Source libraries - do you have the source code?
published: true
description: Having an open source license on a package does not mean that you really receive the source code of the project.
tags: opensource, programming, discuss, devops
series: opensource
# cover_image: https://direct_url_to_image.jpg
# Use a ratio of 100:42 for best results.
# published_at: 2023-05-23 19:06 +0000
---

I think most people writing code who are using 3rd party libraries blindly assume that what is installed with the appropriate package installer is indeed Open Source.

Some might check the license on the code, but even if it says it is licensed under some Open Source license, you don't know if you really get the source code.

Every popular programming language has a [registry for 3rd party libraries](https://code-maven.com/package-registry) (e.g. CPAN, npm, RubyGems, PyPI, PEAR, ...) but as far as I know, none of those systems require the authors to put an open source license on their distributions.

Neither do they require that the uploaded distributions contain the source code of the project.

* The code in the distributed package might be obfuscated.
* It might be some (partially) compiled code. (eg. PyPI packages might only contain the `pyc` files)
* The code might be generated, making it effectively impossible to make changes in a reasonable manner.

Actually I think all 3 of the items I listed would make the project violate [the Open Source Definition](https://opensource.org/osd/) unless there are other, clearly publicized ways to obtain the source code of the project.

## How do you verify that all your dependencies are open source?

* Do you check the license on the project?
* Do you look at the source code of the files that are installed?
* Do you hope that the rest of the users around the world checked it?

Let me know, how do you personally and at your employer make sure that all the packages you use are really open source and come with their source code?
ESLinter - for all JavaScript projects
Tags: githubhack23, webdev, javascript, devops
Published: 2023-05-23 19:25:42

## What I built 
I built a Github workflow that lints every pull request and checks for errors using the rules set up in the project's `.eslintrc.json` file. This is very useful for maintainer's as contributor's may not follow the rules setup by the project which can lead to a messy codebase that can become difficult to maintain as it scales.

### Category Submission: Maintainer Must-Haves

### App Link
[Github repository](https://github.com/byt3h3ad/eslinter)

### Description 

```
name: eslinter

on:
  pull_request:
    branches:
      - "**"
    types: [opened]

jobs:
  linter:
    name: eslint runner
    runs-on: ubuntu-latest
    permissions:
      contents: read
      pull-requests: write
    steps:
      - uses: actions/checkout@v2
      - uses: reviewdog/action-eslint@v1
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          reporter: github-pr-review
          eslint_flags: "src/"

```
This is the simple workflow. The `eslint_flags:` can be changed to the specific directory required.

### Link to Source Code 
[Github Repo](https://github.com/byt3h3ad/eslinter)

### Permissive License
MIT 

## Background (What made you decide to build this particular app? What inspired you?) 
Working on team projects where eslint is not used by someone can make the whole project messy. Implementing this action will make the lives of maintainers easier as they can rest assured that no unlinted code will be pushed to the codebase.

### How I built it (How did you utilize GitHub Actions or GitHub Codespaces? Did you learn something new along the way? Pick up a new skill?) 
I finally made a CI tool that will be helpful for people. This is certainly a first for me. I took help of the official docs for Github Actions and [reviewdog](https://github.com/reviewdog) and cooked it up in a few hours, as I only got to know about the hackathon on it's last day. A huge thank you to the awesome actions by reviewdog!
 Testing it was a bit of a problem with new PRs everytime something broke. I hope there will be a way of testing actions offline in the future.

### Additional Resources/Info
- [reviewdog](https://github.com/reviewdog/action-eslint)
Switching from Linux Mint to an Arch-based Distro - Part 1: Why?
Tags: linux, archlinux, linuxmint
Published: 2023-05-23 19:24:28

I've been using [Linux Mint](https://www.linuxmint.com/) for many years now on my notebook for my day-to-day work environment. I think, I started using it also on the desktop, when Windows 7 had reached end of lifetime and I did not want to switch to Windows 10. Mint proved to be very reliable in all these years. In fact, I only had problems a couple of years ago when I bought a new notebook with a i7 10. Gen and this was a bit too new for the Ubuntu kernel included with Mint, and the drivers for WiFi and display were not working. This got better after a while and I discovered the [Hardware Enablement (HWE) kernel](https://wiki.ubuntu.com/Kernel/LTSEnablementStack), which also did help. And recently, there was a bug introduced in the ALSA part of the kernel which caused my audio to be crashing. Quite annoying during web meetings 😊. But here, I could simply rollback to the previous kernel, until the next one did fix the issue again.

So, why should I change?

In fact, there is one main reason: I experienced the distribution upgrades for major version as really painful.

Linux Mint 21 is now out for a while, and I'm still running the 20.3. There is a [blog post from April 2022](https://blog.linuxmint.com/?p=4293) that claims that the upgrade tool got improved. However, when I tried, it did complain about many custom repositories and PPAs and reports that they are not supported by the target release. So I aborted the process after 1-2 hours of trying. And decided to go for some distro that doesn't require system upgrades.

A minor reason is: A while ago I switched from Cinnamon to KDE. I really liked Cinnamon and Nemo, but there are a few minor things that work better for me in KDE. One aspect is the way that multiple monitors are handled. KDE seems to be better in detected and remembering monitor setups. In our office we don't have fixed desks, so I tend to use different monitors there and at home as well. Also, Dolphin works a wee bit more intuitive for me and I need some key strokes less. And I have the impression that GTK apps look better running under KDE than the other way around. But there is no official KDE version of Mint and the integration of e.g. the very nice system update tool is not as good as in Cinnamon.

So I started looking for something else.

The obvious candidates appear to be Arch-based distros, so I decided to have a look at some of those, instead of investing more time in the Mind upgrade.

Or are there other distros, you can recommend? Let me know in the comments!

_To be continued in the next post..._