teleren/devto huggingface dataset:
CloudWatch Logs Pricing - FinOps
Tags: aws, finops, cloudwatch
Published: 2022-10-27 06:00:11

I would like to share graphical content about some FinOps topics and what you need to know about AWS Bills. I am starting with a CloudWatch log animation, let me know if you are interested in this content.

You will find some explanations about my recommendations below.

## Configure retention policy on your log groups.

You can directly configure your log group retention policy on your CloudWatch agent configuration file.

Concerning the archiving of your oldest logs, for the moment, you can periodically copy them to s3 but not schedule the copy.

## Avoid selecting a long period of time when using Logs Insights queries.

You can use CloudWatch Logs Insights to do some queries and build some dashboards based on them. On dashboards or queries, do not select a large period of time when you have a lot of data in your log groups.

## Think about using throttling/WAF on your internet facing workloads to avoid a high log volume ingestion.

For this recommendation, we can take API gateway for example.
Suppose that your company can’t have the time to invest on security for the moment, there aren’t any WAF rules or throttling in place.

What happens if your API Gateway gets attacked and logging is enable on it ?
The result will be a high volume of log. The most expensive part is logs ingestion (cf:animation below). In the cloud, other than causing some performance troubles, an attack will lead to an additional cost on logs and metrics.


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


{% youtube 5JlvTSesl7Y %}
Understanding Data Structure: Chapter 01 - Introduction to Data
Published: 2022-10-27 11:03:00

## Introduction to Data


>   "A binary number system, in mathematics, positional numeral system employing 2 as the base and so requiring only 
>   two different symbols for its digits, 0 and 1."
>         Encyclopaedia Britannica



An computer logical system are made of commutators called "transistors" theses devices can be in one of two possible states, enable or disable. An computer its a machine that can manipulate binary numbers, its logical values are storage in units called "bit".
Binary number system, in mathematics, its positional numeral system employing 2 as the base and so requiring only two different symbols for its digits, 0 and 1.


**Bit** - The smallest unit of information in a computer, that can storage one binary value.

But a bit is too small to storage more complex data than 0 or 1. So the bits are grouped in 8, this groups are called of byte.

![image](https://user-images.githubusercontent.com/50127863/196301827-f854129f-dcdb-4363-a153-df330b913663.png)
How to make a request within a loop
Tags: javascript, programming, tutorial
Published: 2022-10-27 10:51:00

Hey! This is my first blog here, so I hope you enjoy it :p

## Let's go
There are two ways to make a request within a loop: we have the **sequence** way or the **parallel** way.

I made a small example in codesandbox to show a practical case.

Here is the link: [Example](https://codesandbox.io/s/fast-glitter-ce6yk9)

- **_Sequence method_**:
```
const sequence = async () => {
  try {
    for (const color of colors) {
      const response = await save(color);
      console.log("response sequence", response);
    }
  } catch (error) {
    console.error(error);
  }
};
```

In this way we have to use a `for...of` to loop every item of the array and to execute the method save within the loop.
In this case the code will be executed line by line, which means first the method save and then the `console.log`.

And this is the result:

```
saved it {id: 1, color: "red"}
response sequence {id: 1, color: "red"}
saved it {id: 2, color: "green"}
response sequence {id: 2, color: "green"}
```

This way is a little bit slow, but if you are waiting for a response from the server, such as an id, it is useful.

- **_Parallel method_**

```
const parallel = async () => {
  try {
    await Promise.all(
      colors.map(async (color) => {
        const response = await save(color);
        console.log("response parallel", response);
      })
    );
  } catch (error) {
    console.error(error);
  }
};
```

In this case we are using a `Promise.all` within a `.map`. This is **important** because this method returns an array of promises and the `Promise.all` will execute all the promises together.

Looping the array, every element in it will enter the save method and, after this, the next line will be executed, in this case the `console.log`.

This is the result:

```
saved it {id: 1, color: "red"}
saved it {id: 2, color: "green"}
response parallel {id: 1, color: "red"}
response parallel {id: 2, color: "green"}
```

You can appreciate better from the link that I attached or maybe creating a file.js and debugging step by step.

This is all for today.
I hope you can find this useful and I will be expecting your comments.
Dos maneras de hacer una request dentro de un loop
Tags: javascript, programming, tutorial, spanish
Published: 2022-10-27 10:50:52

¡Hola! Primera vez creando un post aquí, vamos a ver cómo sale :p

## ¡Empecemos!
Existen dos maneras de hacer una request dentro de un loop y estas son de manera **paralela** o **secuencial**.

Armé un pequeño ejemplo dentro de un codesandbox para que el ejemplo sea mas práctico.

[Ejemplo](https://codesandbox.io/s/fast-glitter-ce6yk9)

- **_Método secuencial:_**

```
const sequence = async () => {
  try {
    for (const color of colors) {
      const response = await save(color);
      console.log("response sequence", response);
    }
  } catch (error) {
    console.error(error);
  }
};
```
Para realizar una request de manera secuencial lo que tenemos que usar es un `for...of` que recorra el objeto en cuestión y, dentro del loop, la petición al backend.
En este caso el código se va a ejecutar línea por línea.
Primero ingresará al método save, nos mostrará el objeto guardado y retornará la promesa para luego (en la siguiente línea dentro del for) mostrarnos la response.

Este es el resultado:
```
saved it {id: 1, color: "red"}
response sequence {id: 1, color: "red"}
saved it {id: 2, color: "green"}
response sequence {id: 2, color: "green"}
```

Es un método un poco lento, pero si necesitamos utilizar los datos que nos trae del servidor luego de ejecutar la petición, como por ejemplo un id, es bastante útil.

- **_Método Paralelo:_**

```
const parallel = async () => {
  try {
    await Promise.all(
      colors.map(async (color) => {
        const response = await save(color);
        console.log("response parallel", response);
      })
    );
  } catch (error) {
    console.error(error);
  }
};
```

 En este caso estamos utilizando un `Promise.all` y dentro un `.map`, esto es **importante** debido a que este método **retorna un array**, por lo que en este caso retornará las responses (en forma de promises) y el `Promise.all` las ejecutará de manera inmediata todas juntas.

Recorriendo el array cada elemento ingresará al método save y una vez que todos los elementos del array realizaron la petición, en ese momento se va a ejecutar a la siguiente línea de la misma manera que la anterior, por lo tanto cada elemento del array ejecutará el `console.log`

Y este es el resultado:

```
saved it {id: 1, color: "red"}
saved it {id: 2, color: "green"}
response parallel {id: 1, color: "red"}
response parallel {id: 2, color: "green"}
```

Esto se puede apreciar mejor desde el link que adjunté o pueden pasar el código a un file.js y debuggearlo paso por paso.

¡Eso es todo por hoy!
Espero que les haya gustado y leo sus comentarios.
What is a voice SDK?
Tags: voicesdk, developer, sdk, webdev
Published: 2022-10-27 10:45:31

Voice SDK refers to a collection of software modules that allow developers to integrate and build real-time voice call features into their own apps or platforms. There are many great voice call SDK vendors on the market for your choice, including [ZEGOCLOUD voice SDK](https://www.zegocloud.com/product/voice-call) and Twilio voice SDK.

Most companies opt for voice call SDK from top vendors, avoiding high costs in building real-time voice call features from scratch. The real-time voice SDK that vendors like ZEGOCLOUD offer have encapsulated the whole technology into their cloud-based system and exposed a few simple voice APIs for your development team to integrate and call. Furthermore, companies don’t have to worry about investment in development and maintenance.

## The Common Use Cases of Voice SDK
There are various use cases of voice call SDK. The most common ones include: 

**Social Scenarios**
This category is very broad, it refers to internet-based online entertainment and social networking scenarios. One example of this kind would be online stranger social networking. Social platforms set up voice chat rooms of various schemes, and users join rooms according to their own interests. 

## Gaming Scenarios
Real-time voice has been a must-have for games. Gaming platforms can integrate voice SDK into their game app to bring a better user experience to users. A common practice in the gaming industry is to build social channels for gamers to share their thoughts and experiences through comments or even voice chat rooms. 

## Education Scenarios
There have been some innovations in online educational apps where there is no video. With the aids of screen sharing, document sharing, and whiteboard, teachers use real-time voice to interact with students. These online educational apps integrated voice call SDK offered by RTC vendors like ZEGOCLOUD and delivered online courses effectively.

## The Typical Features of Voice Call SDK

**One-on-one, Multiple, or Live Streaming Show**
Real-time voice SDK allows your users to conduct one-on-one voice calls or many-to-many group voice chats, or even live voice streaming shows. The fundamental feature of a voice call SDK is to allow users to make real-time voice communication with the best voice quality. 

**High Fidelity Voice Quality**
ZEGOCLOUD’s voice SDK supports full-band voice ranging from 8kHz to 48kHz. The bandwidth of voice stream ranges from tens of kbps to more than 100 kbps. The voice quality can replicate the quality in offline situations. 

**Acoustic Voice Pre-processing**
Noise refers to environmental noise that degrades voice quality. Echo refers to the situation where the far end’s voice is picked up and transmitted back to the far end, and the far end user is disturbed by the lagging and repetitive voice. There are some acoustic processing that are carried out before coding, and we call them pre-processing, which includes ANS(Acoustic Noise Suppression), AEC( Acoustic Echo Cancellation), and AGC ( Acoustic Gain Control). They are must-have features for a voice call SDK.
A Feature with an F-string that I Found out about by Accident
Published: 2022-10-27 10:34:41

##From author
You can find many interesting articles on my website, please visit it [Happy Python Website](https://happypython.ru/)

Look, here is the usual f-string

```
text = 'JUPI'
print(f'{text}') 
JUPI
```

If I add to it
* colon, 
* placeholder char, 
* and I will specify the required string length using the <

```
print(f'{text:-<15}') 
```

Then the rest of the line that is not occupied by the text will be filled with the selected character:

JUPI-----------

If you specify the length of the string via >, then you can fill in the line on the left side: 

```
print(f'{text:->15}') 
```
-----------JUPI

Write in the comments how to fill in the line on both sides so that it turns out 

-----JUPI------
How do you solve a bug upon data selection?
Published: 2022-10-27 10:33:41

In my webpage, there is a list of data shown upon search. However, if one clicks on a data to view the description then search/click on another, the data description doesn't update automatically. It still shows the previous data description on current data selection. The users need to click refresh button if he/she detects the unchanged description to solve this issue. Original command in reactjs is as follows.

{ fetchData(); deleteLocalData();}} className="btn otjs-button otjs-button-orange p-2">Refresh
check the return code in an if clause
Tags: bash, shell, cli, git
Published: 2022-10-27 10:32:55

I'm working on a bash script that uses git to clone all of our git repositories (only the necessary stuff). We have a mixture of master (old projects, and yes we have a task to migrate this) and main as the repo main branches.

I want the script to first try to clone the branch named master and if this fails try to clone the branch named main.

[git docs](https://git-scm.com/docs/git-clone)

My first try
```shell
 git clone --depth 1 --branch main "$repoUrl" "$targetFolder"
 if [[ "$?" != "0" ]]; then
   git clone --depth 1 --branch master "$repoUrl" "$targetFolder"
 fi
```

The first statement tries to clone the master branch of the repository with a url contained within the var repoUrl. And it clones it into a directory contained in the var targetFolder.
Only the latest commit is cloned because of the --depth 1.  

So far so good. But i have started using [shellcheck](https://github.com/koalaman/shellcheck) a while ago (blog post coming) and it alerted me to slightly better solution.

Turns out it's possible to write it like this:
```shell
if ! git clone --depth 1 --branch main "$repoUrl" "$targetFolder"; then
    git clone --depth 1 --branch master "$repoUrl" "$targetFolder"
fi
```
You are able to run the command whose return code you want to check directly in the if clause. I'm doing this here and checking for a return code that says the execution was not successful.

Still some repetition. We could pull this into a function.

```shell
gitclone() {
  git clone --depth 1 --branch "$1" "$2" "$3"
}
if ! gitclone "main" "$repoUrl" "$targetFolder"; then
    gitclone "master" "$repoUrl" "$targetFolder"
fi

```
Company Diafimis provides services in the field of information technology, Internet marketing and business development
Tags: marketing, seo, digitalmarketing, websitecreation
Published: 2022-10-27 10:29:36


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

**History**

In the spring of 2007, [our company](https://diafimis.com/), engaged in the design of manufacturing enterprises, showed interest in advertising on the Internet, which was still gaining popularity. The only thing that the company's management knew about advertising on the Internet at that time was that it was the most actively developing among all other types of advertising. Due to the fact that industry exhibitions from year to year brought less and less benefit in matters of business promotion, it was decided to start using modern methods of advertising on the Internet. The task of choosing an advertising agency was assigned to the leading manager of the company. After two weeks at the meeting, the manager reported to the management about the work done, according to the results of which none of the agencies worked out and known at that time was selected for further cooperation. The reasons for the refusal were completely different, starting with the absence of legal entities from people providing services privately, and ending with the complete incompetence of agency managers. The task remained relevant, even despite the unsuccessful search for a reliable partner in this area. As a result, the company's management decided to organize its own advertising agency. Already at the next meeting, the same manager was assigned to manage a new project. A month later, we successfully launched a new line of activity, which we are actively developing today.

**Concept**

The concept was formulated in one phrase: “The company must provide high-quality services in the field of online advertising.” At the end of the month, the first employees were recruited, who began working on their own project of the company's owners. At the end of the summer of the same year, when it became clear that the benefits of advertising on the Internet were quite tangible, it was decided to start providing services in this area to third-party companies. At the same time, the service was offered to long-time business partners in the field of design, who became 
the first customers of Diafimis.

**Development**

Having felt the real benefits of placing their advertising on the Internet, the first customers advised their partners to use our services, and those, in turn, their own. The number of customers grew rapidly. It has become possible to analyze the process of advertising on the Internet more deeply in order to make investments in this area more predictable.

**Currently**

At the moment, Diafimis is an active developer of analytical systems that allow calculating the effectiveness of the upcoming advertising campaign with high accuracy. Clients who started working with us a few years ago still use our services and attract Diafimis to cooperate when launching new projects.
esbuild: creiamo un'applicazione React / TypeScript e analizziamo le principali features 🇮🇹
Tags: esbuild, react, bundler
Published: 2022-10-27 10:25:58

> I'm sorry. This post and the long video tutorial are in italian only but all slides are in english and there are live coding sessions so you should understand all steps : )

ESBuild nasce con l'obiettivo di velocizzare la generazione dei bundle di progetti JavaScript ed è alla base di strumenti ormai diffusissimi come ViteJS.

Scritto in GO, garantisce performance 10-100 volte superiori a quelle di WebPack, RollUp e Parcel!

Dopo un'introduzione su ESBuild creeremo da zero un progetto con il supporto di React e TypeScript, analizzeremo le API per generare bundle da CLI e JavaScript, gestiremo build su file system e in memoria, compileremo file JSX e TSX, gestiremo assets, plugin, web server molto altro.


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

TOPICS
00:00 Introduction 
03:57 TypeScript compiler
04:52 Compile with ESBuild
06:03 React: Server Side rendering
09:30 React: Client Side rendering
11:50 Build API
13:00 Multiple Components
13:57 CSS
17:40 Source Map
18:30 Exclude Deps
19:25 Tree Shaking & Minify
22:22 Watch
24:25 Bundle Analyse
26:40 Images & ESBUILD loaders
27:30 Serve
29:20 3rd party plugins
30:40 Write Plugins
40:15 Final Thoughts
Career Page build with ILLA
Tags: webdev, opensource, startup, github
Published: 2022-10-27 10:24:55

ILLA is a low-code platform that lets developers build internal tools in minutes and spend less time on website design and integrations.

ILLA is like Figma for the developers. You can Drag and place to build functions with our built-in Components. ILLA is perfectly suitable for automation and data management. Integrating with third-party APIs allows you to implement more functions for your tool. Many friends online still asked us what job I could do with ILLA. To answer that question our team came up with a lot of ideas. We are making them into different showcases.

Here is one of the showcases of using ILLA to build a career page

![Jobposting2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6z02ia6a2wwz8weq6g7r.png)<center style={{whiteSpace: 'break-spaces'}}><figcaption>ILLA supports third-party APIs so that you can link your internal tools with databases and other websites. This gives you more freedom to build internal tools and implement more functions. For the Career Page, we can integrate with Linkedin and other job-posing websites. You can post it once on your career page, and automatically post the information to other platforms.</figcaption></center>
![Jobposting3](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yvduvo00l63g3lsh43eo.png)<center style={{whiteSpace: 'break-spaces'}}><figcaption>
    You can build your customized career page without limitations and in a remarkably short time. ILLA has a well-designed pre-built-in UI components library ready for the engineer to use so that engineers can set up a specific tool by only dragging and placing the components. Programmers can also alternate some code to customize the tool.  </figcaption></center>
![jobposting4](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rhfcqb0zecd0znvhd8lh.png)<center style={{whiteSpace: 'break-spaces'}}><figcaption>Here is a big picture of the career page. ILLA can do more than this！</figcaption>
</center>
>### About ILLA: 
>##### ILLA’s team members are open-source enthusiasts, and so is their strategy to pivot with Open Source communities, projects, and contributors. Since ILLA believes open source is a great way to pass knowledge to the next generation, all open-source projects are welcome to collaborate with ILLA. ILLA supports many other open-source projects, such as PingCAP and MindsDB, in their “Action” features. APIs support is another critical feature of ILLA. Integrating third-party APIs smoothly into ILLA’s “component” can improve the user experience significantly.

You can check ILLA’s website here at https://illacloud.com

GitHub page: https://github.com/illa-family

Join Discord community: https://discord.com/invite/illafamily
Job READY Manual Testing Course with API Testing, SQL, Agile, Scrum,JIRA & Real LIVE Projects
Tags: testing, qa, tutorial, manual
Published: 2022-10-27 10:24:36

✅ 45+ hrs of online LIVE Classes (with Recordings)
✅ Real Time LIVE Project (Manually Tested).
✅ Best for Freshers, Non IT to IT people want to switch to QA roles.
✅ LIVE Projects in Manual Testing with API Testing Postman.
✅ Learn Agile, Scrum Framework, JIRA Live Demo + SQL Masterclass
✅ Mobile Testing Basics & Certifications ISTQB dumps discussion.
✅ Batch Starts, Nov 2022, Weekdays (MWF) Morning Classes.
✅ Customized Resume building & Job Assistance.
✅ Interview Prep & Mock Interviews, Private Telegram group

{%embed https://www.youtube.com/watch?v=Y0yQBp1sZq8 %}
Astro Build: how to use React, Vue and Svelte in the same page using "islands"
Tags: astro, react, vue, svelte
Published: 2022-10-27 10:23:03

[Astro](https://astro.build/) is a new web framework that is very different from the others.

It's not a replacement of React, Angular or VueJs because it allows to build fast web sites focused on content using a new concept called island.
An island, by default, is a static template with no javascript so it loads very quickly but it can also be an interactive UI built with React, Svelte, Vue or most of the modern front-end frameworks.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4d82k4m32qhe8j8hix4x.jpg)

Astro supports several other interesting features but in this video I wanna show you how you can mix several frameworks onto the same page.

{% embed https://youtu.be/hBzlb5ZxsKo %}
How To Increase Your Salary Exponentially as QA
Tags: testing, qa, software
Published: 2022-10-27 10:21:54

How To Increase Your Salary.: In this video, we will learn How you can increase or 2x your Salary with the Tips. 🚀 Download Notes – https://sdet.live/notes 

{% embed https://www.youtube.com/watch?v=CPVjNKfwQAQ %}

🚀 Enroll in Courses : https://sdet.live/courses We are going to how to become an automation tester in 2022 ...

Read more

The post How To Increase Your Salary Exponentially as QA appeared first on Software Testing & Automation.