teleren/devto huggingface dataset:
What Does a SOC Team Members Do?
Tags: cybersecurity, security, webdev
Published: 2021-10-09 16:17:30

A security operations center, known as a SOC – pronounced “sock” 🧦 - is a team of experts that proactively monitor an organization’s ability to operate securely.

Members of a SOC team are responsible for a variety of activities, including proactive monitoring, incident response and recovery, remediation activities, compliance, and coordination and context.

**Proactive Monitoring**
Proactive Monitoring includes log file analysis. Logs can come from end points (e.g., a notebook computer, mobile phone or an IOT device) or from network resources, such as routers, firwalls, intrusion detection system (IDS) applications and email appliances. Another term for proactive monitoring is the threat monitoring. SOC team members work with various resources, which can include other IT workers (e.g., help desk technicians), as well as artificial intelligence tools and log files.

**Incident Response and Recovery**
A SOC coordinates an organisation's ability to take the necessary steps to mitigate damage and communicate properly to keep the organisation running after an incident. It's not enough to just view logs and issue alerts. A major part of incident response is helping organisations recover from incidents. 

For example, that recovery can include activities such as handling acute malware or ransomware incidents. 

**Remediation Activities** 
SOC team members provide data-driven analysis that helps an organisation address vulnerabilities and adjust  security monitoring and alerting tools.
 
For Example, using information obtained from log files and other sources, a SOC member can recommend a better network segmentation strategy or a better system patching regimen. Improving existing CyberSecurity is a major responsibility of a SOC. 

**Compliance**

Organisation secure themselves through conformity to a security policy, as well as external security standards, such as ISO 27001x, the NIST CyberSecurity Framework(CSF) and the General Data Protection Regulation (GDPR). Organisations need a SOC to help ensure that they are compliant with an important security standards and best practices. 

**Coordination and Context**

Above all, a SOC team member helps an organisation coordinate desperate elements and services and provide visualized, useful information. Part of this coordination is the ability to provide a helpful, useful set of narratives for activities on the network. These narratives help shape a company's [CyberSecurity](https://logicalidea.co) policy and posture for the future.
reinhart1010.id Site Update, 20th birthday edition.
Tags: showdev
Published: 2021-10-12 15:02:26

---
title: reinhart1010.id Site Update, 20th birthday edition.
published: true
date: 2021-10-10 01:43:00 UTC
tags: showdev
canonical_url: https://reinhart1010.id/2021/10/10/reinhart1010-id-site-update-20th-birthday-edition/
---

Hey, it’s me again. **TL;DR: We has just change our site theme (again),** but it won’t be too much different than the previous one.

Now we use a newer shade of blue and green on to make colored text more contrast than the background pattern.

 ![](https://reinhart1010.id/wp-content/uploads/2021/10/0CDE41E1-64F3-43C6-971A-FDB6587ADCB4.png) ![](https://reinhart1010.id/wp-content/uploads/2021/10/8EE34053-DAFA-4F7D-ABC4-3C586C6CE8FC.png)

 ![](https://reinhart1010.id/wp-content/uploads/2021/10/A3B7BC04-FB76-491E-A242-3E865F9A7747.png) ![](https://reinhart1010.id/wp-content/uploads/2021/10/BCF4CD44-7B5C-4007-BFEC-64A95B19819B.png)

As you can see above, **root** articles now always appear green while **SYSTEM** always appear blue. And the best part of it? **Post date and authors can be seen on the top** so you can finally see who wrote that thing, **like this one:**

![](https://reinhart1010.id/wp-content/uploads/2021/10/BC06433C-E9EF-41FD-8537-B8F4FB48AD99-660x1024.jpeg)

* * *

This new theme is based on [Autonomie](https://notiz.blog/projects/autonomie/), one of the (rare) WordPress themes which is compatible with [microformats2](http://microformats.org/) semantic HTML markup. One major disadvantage, though, is that dark mode is now only can be enabled through system-wide settings since we’re using [prefers-color-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme) instead of custom JavaScript-based solution.

That’s all for now, back to work and **scanf()** some presents!

The post [reinhart1010.id Site Update, 20th birthday edition.](https://reinhart1010.id/2021/10/10/reinhart1010-id-site-update-20th-birthday-edition/) appeared first on [Reinhart Previano Koentjoro](https://reinhart1010.id).
Architecting React Applications
Tags: react, architecture
Published: 2021-10-10 01:11:41

React is easy to learn, hard to master. It give you all the freedom you need (or not) to organize your proyects. It have amazing stuff like hooks, contexts, Suspense, and more (and more in React 18). But now it´s time to do some real world large proyects where thing like maintainability, separation of concerns and reusability REALLY matter. So, what to do? You need to architect your codebase to resist both the test of the time and changes in requirements. How to do that? I prefer 2 ways to organize my code: domain-driven or based on the type of feature a framework or library provide. 
Now i will share with you a approach that take the best of the two worlds:
![Architecture for react applications](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fxrbw5tthja7pwh8mzho.png)
Here we have:
* components: Here we will place our Components, and then we will divide they based on domain, the page that use it or parts of one more complex component
![components organization](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sxyiasmb8zo2qyslhe40.png)
* constants: enums, route paths, static select models..
* contexts: Context who are domain-agnostic. For example UserContext or configuration to use libraries based on context like @apollo/client or use-http.
* hooks: Hooks who are domain-agnostic. For example useWindowSize, useDocumentTitle
* pages: All pages of the application. Nested routes are places inside a folder with the same name as the root route.
![pages organization](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fc16nr8f9ob8w4ldu6jj.png)
* routing: Configuration of the routes. Logic related to public/private routes are placed here too.
* services: Here we have functions || classes || hooks to comunicate to the API. Business logic lives here.
* util: Utilities that don´t match any category.

Thanks for reading. I will appreciate all the feedback. Keep learing...
Regex clave de elector de México
Published: 2021-10-10 00:47:31

Sin más preámbulo:

```javascript
[BCDFGHJKLMNPQRSTVWXYZ]{6}[0-9]{2}[0-1]{1}[0-9]{1}[0-3]{1}[0-9]{1}[0-3]{1}[0-9]{1}[HM]{1}[0-9]{3}
```

La clave de elector se compone de 18 caracteres, y se conforma con las primeras consonantes de los apellidos y primer nombre, año, mes, día y clave del estado en que su titular nació, su sexo y una homoclave interna de registro.

Por partes:
- `[BCDFGHJKLMNPQRSTVWXYZ]{6}` Captura 6 consonantes.
- `[0-9]{2}` Captura dos dígitos entre 0 y 9, para el año de nacimiento.
- `[0-1]{1}[0-9]{1}` Captura el mes de nacimiento, la primera parte espera un dígito entre 0 y 1 y la segunda entre 0 y 9. Esto porque los meses los numeran 01, 02, ..., 12. 
- `[0-3]{1}[0-9]{1}` El día de nacimiento, de 01, 02, ..., 31
- `[0-3]{1}[0-9]{1}` Clave de la entidad federativa, muy parecida al día, porque se espera un número entre 01 y 31.
- `[HM]{1}` El sexo del titular. Actualmente limitado a dos opciones, H o M.
- `[0-9]{3}` Homoclave


Defectos:
- El año, mes, día y clave del estado pueden ser 00
- El día y estado pueden llegar hasta 39
- El mes puede llegar hasta 19
Como escrever códigos mais padronizados?
Tags: codequality, braziliandevs, beginners
Published: 2021-10-10 00:13:32

Capa por <a href="https://unsplash.com/@timgraf99?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Tim Graf</a> no <a href="https://unsplash.com/s/photos/guide?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>

## Sumário

- [Introdução](#introducao)
- [O que é Style Guide?](#o-que-e-style-guide)
- [Quem define um guia de estilo?](#quem-define-um-guia-de-estilo)
- [No que isso vai me ajudar?](#no-que-isso-vai-me-ajudar)
- [Exemplos](#exemplos)
  
## Introdução

Quem me acompanha nas redes sociais sabe que, recentemente(junho de 2019), eu mudei o rumo da minha carreira. Estava trabalhando com Data Science e decidi focar no desenvolvimento mobile iOS. A partir disso, tive que me dedicar a aprender Swift, linguagem lançada pela Apple em 2014.

Para aprender novas linguagens, é necessário conhecer padrões: sintaxe, comandos, paradigmas e por aí vai. Um detalhe muito importante é: Qual o padrão para se escrever códigos na linguagem que estou aprendendo? Para isso existem os style guides.

## O que é Style Guide?

Em português, Guia de Estilo, é um conjunto de regras que definem como devem ser escritas as mais variadas instruções em uma determinada linguagem. Essas regras envolvem preferências sobre, por exemplo, iniciar ou não uma nova linha antes de das chaves de um comando `if`. Um exemplo de regra a seguir: 

```js
// Preferido
if(condition) {
   //code
}
// Não preferido (lógico, um crime)
if(condition)
{
   //code
}
```
Os style guides são criados para (tentar) garantir que o código terá um mesmo formato, independentemente de quem escreveu, tornando mais fácil sua leitura por qualquer pessoa.

## Quem define um guia de estilo?

Os guias de estilo podem ser definidos por um projeto, empresa, comunidade, etc. Por exemplo, dentro de uma empresa, é possível que diferentes projetos sigam diferentes guias, cada um adequado às suas necessidades.

## No que isso vai me ajudar?

Conhecer um guia de estilo pode tirar muitas dúvidas sobre como um "bom código" deve ser escrito. Você irá conhecer e entender como formatar determinados comandos, como escrever expressões, onde colocar ou não espaços, etc.

## Exemplos

Abaixo estão listados alguns exemplos de guias de estilo para você conhecer:

- [PEP-8: Style Guide oficial de Python](https://www.python.org/dev/peps/pep-0008/)
- [PSR-12: Coding Style Guide de PHP](https://www.php-fig.org/psr/psr-12/)
- [Java Style Guide da Google](https://google.github.io/styleguide/javaguide.html)
- [C# Style Guide da Google](https://google.github.io/styleguide/csharp-style.html)
- [Javascript Style Guide da AirBnb](https://github.com/airbnb/javascript)
- [Dart Style Guide](https://dart.dev/guides/language/effective-dart/style)
- [Swift Style Guide da comunidade Ray wenderlich](https://github.com/raywenderlich/swift-style-guide)
String.indexOf() and .lastIndexOf() | Javascript
Tags: beginners, javascript, tutorial
Published: 2021-10-10 00:12:12

#String.indexOf()
The `String.indexOf()` method returns the index inside the object `String` of the value you pass inside the parentheses `()`. The value can either be a string or a number, as long as they exist inside the `String` object.

##Example: 
```javascript
let myString = "December 11th"

console.log(myString.indexOf("c"))
console.log(myString.indexOf(1))

//output:
2
9  
```

>If you pass in multiple letters or numbers, the index of the **first** letter/number is returned

```javascript
let myString = "Friday April 4th 2044"

console.log(myString.indexOf("r"))
console.log(myString.indexOf("April"))
console.log(myString.indexOf(4))
console.log(myString.indexOf(2044))

//output:
1
7
13
17
```
#String.lastIndexOf()
The `String.lastIndexOf()` method basically does the same thing, but here's how they differ from each other :

`String.indexOf()` returns the index of the **first appearance** of the value. In other words, it starts looking from the beginning to the end of the string.

`String.lastIndexOf()` returns the index of the **last appearance** of the value. Simply put, it starts looking from the end to the beginning of the string.
>**_Note: The index will always be counted from the beginning_**

##Example:
```javascript
let myString = "Friday April 4th 2044"

console.log(myString.lastIndexOf(4))
console.log(myString.lastIndexOf("r"))

//output:
20
9
```
Notice how the index of `4` and `r` is now different from the previous example, it is because `.lastIndexof()` starts looking from the end.

>The rule also applies if you pass in multiple letters/numbers 
```javascript
let myString = "EMMA'S DILEMMA"

console.log(myString.indexOf("EMMA"))
console.log(myString.lastIndexOf("EMMA"))

//output:
0
10
```

**So what if you pass in a value that doesn't exist inside the string?**
```javascript
let myString = "December 11th"

console.log(myString.indexOf("X"))
console.log(myString.lastIndexOf("october"))

//output:
-1
-1
```
>If the value doesn't exist, `-1` is returned

#Reference Material
If you still have any questions about `.indexOf()` and `lastIndexOf()`, I recommend checking out this awesome video:

{% youtube eqPYvrxLm4c %}
Should we use RICE to prioritize our agile backlog?
Tags: agile, rice, prioritization, backlog
Published: 2021-10-20 13:45:40

---
title: Should we use RICE to prioritize our agile backlog?
published: true
date: 2021-10-10 00:00:00 UTC
tags: agile,rice,prioritization,backlog
canonical_url: https://jhall.io/archive/2021/10/10/should-we-use-rice-to-prioritize-our-agile-backlog/
---

If you’ve ever prioritized a large backlog, you may have seen the [RICE](https://roadmunk.com/guides/rice-score-prioritization-framework-product-management/) framework in action. The acronym stands for **R** each, **I** mpact, **C** onfidence, **E** ffort, and it’s a simple formula for determining the weighted score of a backlog item.

![](https://jhall.io/archive/images/rice-formula.png)

So is RICE a good tool for agile backlog prioritization?

In my view: **No**

Why?

Well, it’s not an inherently bad tool. It’s just too heavy for truly agile work.

If your team’s goal is agility, then you should generally be prioritizing the minimum number of tasks possible. That usually means just enough tasks for everyone to have work for the day, or if you’re using Scrum, for the sprint, and nothing more. The reason not to prioritize more is that, if your goal is agility, by the time you’re ready for a new task, you’ll have new information and new priorities anyway, so any prioritizaion you had done a day or a week or a month ago will be irrelevant now.

With this in mind, it’s _usually_ pretty clear what the single most important thing is to work on for the day or for the week. You don’t need a 4-variable framework to make such a decision.

If you do find yourself in a situation where you have two tasks of seemingly equal urgency, select the faster one. If they seem to be of the same size, pick an arbitrary one.

If you find yourself in a situation where you have a whole pile of tasks of equal urgency and size, this probably means you’re just looking at a big bag of bugs, and none of them are really very urgent at all. If you must, start on an arbitrary one. Better yet: Determine if your team could/should be working on something more urgent.

All this to say: If your goal is agility, you _should_ be changing priorities frequently enough that planning more than one or two tasks ahead is a complete waste of time. In such a scenario, RICE, or practically any other prioritization framework, is just wasted effort.

* * *
_If you enjoyed this message, [subscribe](https://jhall.io/daily) to <u>The Daily Commit</u> to get future messages to your inbox._
What is an Example of a Quality React App?
Tags: help, discuss, react, javascript
Published: 2021-10-09 21:34:22

---
title: What is an Example of a Quality React App?
published: true
description: Gathering examples of what experienced React specialists feel are representative quality React applications.
tags: help,discuss,react,javascript
//cover_image: https://direct_url_to_image.jpg
---

Hey all! Hope you all are having a good day and week!

I am curious if the experienced React developers out there have some open source examples of what they would consider a "quality" React application. More specifically I am looking for examples that are non-trivial (To-Do lists are trivial), and data/business logic driven. 

The reason I ask is that I have had a limited exposure to a variety of React applications and React is the most free form of the big three frameworks (Angular, Vue, React). I am optimistic that with your help that some of my existing opinions of React are invalidated by seeing more examples!

When I say quality there are a few things I am looking for. The first is well structured code, something that is coherent and easy to reason about. The second point I am looking for is that the app utilizes reusable components, ones that improve both developer experience and time to develop features. And lastly I am looking for effective use of a state management which clearly connects the data to the view.
JS practice: day1 password generator
Tags: javascript, learning, password, cryptography
Published: 2021-10-09 21:31:35

---
title: JS practice: day1 password generator
published: true
description: Learning by doing is the best way to learn, so this is what I will be doing for the next 40 days. 1 simple script a day.
tags: JS, learning, password, cryptography
//cover_image: https://direct_url_to_image.jpg
---

There are plenty of ways to generate secure passwords, but why not use your own password-generating algorithm? It will be better than using the same password everywhere, and you'll have some fun in the process. Let's get to coding!

First some html

```html
<h1>password generator</h1>
<label>write a word</label>
<input type="text" id="word" value="">
<input type="button" value="generate"><br>
<strong>generated password:</strong>
<input type="text" id="pw" value="">
```

next let's write a function that takes in a priming word and returns a password.

```JS
let vowels = 'aeiouyw';
let vowelRegex = new RegExp(`[${vowels}]`,'gi'); // List of vowels (Global and Insensitive)
let consonantRegex = new RegExp(`(?![${vowels}])[a-z]`, 'gi'); // List of consonants (Global and Insensitive)
let allRegex = new RegExp(`[a-z]`, 'gi'); // List of consonants (Global and Insensitive)


const encodePW = (c) => {
  
  // turn the string into an array
  arrayed = c.match(allRegex)
  // create an empty array that will hold your strings
  newArr = []
  // add the index next to each el
  arrayed.map((a, index)  => { newArr.push(a + index); });
  
  // create two empty arrays
  g1 = []; g2 = []
  
  // add elements inside this empty array
  newArr.map(el => {
    el.match(vowelRegex) ? g1.push(el) : g2.push(el)
  })
  
  let vowelStr = g1.join('').toUpperCase(),
      consonantStr = g2.join('').toLowerCase();
      // the compose algo
      pwCompose = '#' + c.length + vowelStr + g1.length + g2.length + consonantStr + (c.length * g1.length + g2.length + '1903')
  
  console.log(pwCompose)
  
  let vowels = c.match(vowelRegex).join('').toUpperCase();
  let consonant = c.match(consonantRegex).join('').toLowerCase();
  let pw = '#' + c.length + vowels + vowels.length + consonant.length + consonant + (vowels.length + consonant.length + c.length) + '5475'
  
  return pw;
};

```

Now let's hook all this up with the HTML

```JS
const primedInput = document.getElementById('word')
const genBtn = document.querySelector('[type="button"]');
const primedWord = primedInput.value || ''
const pwField = document.getElementById('pw');

genBtn.addEventListener("click", e => {
  pwField.value = encodePW(primedWord);
});
```
And voila, you have your own password generator with a badass encryption algorithm. The next step will be to write a script that decrypts the password.

what do you think ?

The [decoder script is in the next post](https://dev.to/nedzen/js-practice-day2-password-decoder-f2e).
A fresh-looking, neon theme for your preferred IDE. Almost radioactive.
Published: 2021-10-09 21:04:49

Just recently wrote a very clean, theme for VSCode called "radium". It mostly consists of green and neon type colors to match our name "radium". Feedback is much appreciated! We are updating it as we go to perfect the theme.

https://radium-theme.github.io/
https://github.com/radium-theme/vsc
https://marketplace.visualstudio.com/items?itemName=AndrewNijmeh.radium
🌈 VS-Code / Active Bracket pair colorization easily 🌈
Tags: vscode, tutorial
Published: 2021-10-09 20:29:32

This is an easy tutorial to show how to active the new feature in vscode.

0 - Open VS Code (it was necessary to indicate)

![VS-Code-landing](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/if0c77sunivq10ox7jv4.png)

1 - Open Editor Settings (use the shortcut or do this 👇)


![Open-VS-Code-Settings](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/95nt770jy7xwwyefwa95.png)

![Open-VS-Code-Settings-2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hrl5rzjvlg380ri7w111.png)

Then this tab will open

![VS-Code-Settings-Tab](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ufgqqxivrdaq8ifyqr7k.png)

2 - Search "Bracket Pair"

![VS-Code-Bracket-Pair](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5l43uftajbjkdhj23rka.png)

3 - Select both of the options 

![VS-Code-Bracket-Pair-Selected](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vpc5zll0etty0p2oxt7g.png)

- Code view with colored bracket(HackTheBox Theme)

![code-view](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9gdlnv4rw2c991mzvnmw.png)
🍓Choosing the right headless Raspberry Pi
Tags: watercooler, computerscience
Published: 2021-10-09 19:55:30

Headless is a blanket term for anything without a GUI.

In that sense you intend to not use a monitor, mouse and keyboard and just have an SSH server running. I'm not going to go into that specially - but I will talk a little about hardware.

If you are here you probably like JavaScript so I'm gonna assume that you want to do a little nodejs on your pi? How about saving some money too?

There are a few options I personally think that fit the above criteria pi 3rd generation is great choice. Not as pokey as the gen 4 but still great. 512mb ram and quad core ARM something something - it will run nice and quickly. But it's still quite pricey if you get the default model B plus so here's the money saving tip.

The model A plus is actually pretty much the same as the model B plus but with less stuff. Less USB (use a hub), no ethernet (use a hat) it's also smaller in a nice square foot print which will make you laugh every time you look at it, "that's a computer! No way..." And although that's true for the model B plus it's even more so for the model A plus.
The best bit, the model A plus is a fraction of the price.
It might struggle to run a desktop but you can always use raspberry pi OS lite which fixes that because it's shell only.

Lastly for my application I will be sticking a battery onto it and running a TCP server to run an RC car with pi onboard, the a plus's size is what sold it to me but I have to say this is a brilliant little computer worth your time.

Regards, there is no raspberry emoji 🍓