teleren/devto huggingface dataset:
Master Enum (metaphors galore)
Tags: elixir, learning, programming, beginners
Published: 2022-09-30 06:26:59

This is a tool that is aiding my brain in the Elixir journey: metaphors.

I find much of the documentation out there is rich in details for the initiated, though it may be a challenge for those of us who read through them as one would read through Sanskrit.

As I learn new functions every day, my brain needs mental shelves where to place these new concepts, and metaphors are providing those mental shelves.

Mastering enum seems to be akin to mastering the light saber for a Jedi. My superhero mentor insists that, if I get Enum.map, Enum.reduce, and Enum.filter, I have a good foundation to move forward.

These are the metaphors that are helping me as a starting point to understanding those three functions.

Enum.map is akin to going through all the beads of a rosary.

Enum.filter is akin to looking for a specific book in the library.

Enum.reduce is akin to placing your shopping into the bag.


They do not represent a perfect description. We have the technical documentation for perfection. Alas, when I am learning, they do the work. When I need to decide which function to use, those visuals help me decide which function has the best shot.

```
Git add .
Git commit -m "Whatever gets the job done..."
```


BigSpaces
Identity Access Management Series
Tags: iam, cyber, pam, identity
Published: 2022-09-30 06:20:59

[Click Here](https://blog.cloudnloud.com/identity-access-management-series-1)

- Learn how IAM works
- Why do you need IAM?
- How Does IAM Work?
- Examples of IAM at your daily works:
- Core functions of Identity Access Management
- What is the Difference Between Identity Management and Access Management?
- Community and Social Footprints
The treacherous tale of real world data: Our lessons
Published: 2022-09-30 06:15:33

This post is a bit of a technical ramble, I’ve no doubt some developers will love reading it, but it might not be the most interesting for others, in that case, feel free to check out other posts on the NextSketch blog!

Now, for the horror story. It all started in June…

An interesting issue that we faced when testing and deploying NextSketch to the field, was the concept of data validation, sanitation and Serialization.

That's a lot of "-tions", so let's break it down.

In the field, once data has been created in a particular format, users expect your app to be able to parse it, no matter how many revisions into the future your app is.

This was quite a problem given that we used Java's ubiquitous Serialization mechanism. The thing that makes Serialization different from just reading and writing something like XML is that Serialization forces you to eventually bind the contents of the file to a real life object. 

And if said real life object has changed, then you run into all sorts of errors. In reality, something like serialVersionUID can only take you so far, which limits the flexibility of the overall code base, turning it into a rigid mess and limiting extensibility.

Also, sometimes it’s necessary to clean said data and patch it where holes exist. Serialization made this a nightmare because of its rigid rules. In NextSketch 2 (coming soon!), we're exploring the concept of Validation Passes. A series of checks that patches incorrect data in older data sets.



Overall, while Serialization is no doubt easy, it’s a real pain to work with in cases like these. I would recommend some sort of text based format like XML because you don’t have to bind an object to it and because it doesn’t hamper extensibility. 



Thanks for reading!

_NextSketch helps developers work with ideas in new ways by integrating simple diagramming into their IDE. Available for all IntelliJ IDEs, check it out at www.NextSketch.ca_
How To Create Middleware For XSS Protection In Laravel 8
Tags: laravel, laravel8, middleware, xss
Published: 2022-09-30 06:02:47

In this article, we will see how to create middleware for XSS protection in laravel 8. 

Cross-site scripting is a type of security vulnerability that can be found in some web applications. 

XSS attacks enable attackers to inject client-side scripts into web pages viewed by other users. 

XSS attacks occur when an attacker uses a web application to send malicious code, generally in the form of a browser side script, to a different end user.

In laravel 8 we use middleware to prevent XSS attacks on website security. It's very necessary protection from XSS attacks or any other cyber attack on websites. With the XSS filter through, we can remove the HTML tag from our input value and also it's very important to remove the HTML tag for security. 

Input sanitization is a security protocol for checking, filtering, and cleaning data inputs from app users.

So, let's see laravel 8 XSS protection using middleware.

What are the types of XSS attacks?

There are three main types of XSS attacks. These are:

- Reflected XSS, where the malicious script comes from the current HTTP request.
- Stored XSS, where the malicious script comes from the website's database.
- DOM-based XSS, where the vulnerability exists in client-side code rather than server-side code.
What is Natural Language Processing API and How You Can Use It?
Tags: aws
Published: 2022-09-30 05:47:49


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cqseuqzt78x7elqfq2qa.png)Did you know that you can now use artificial intelligence to help you process and make sense of text data? This is made possible by [Natural Language Processing API](https://apilayer.com/marketplace/nlp-api) or NLP for short.

NLP is a method of teaching computers to understand human language. It is used to process and analyze large amounts of natural language data. NLP can be used to create chatbots, voice recognition systems, and other text-based applications.

NLP can be used to help process and make sense of text data

If you're working with text data, whether it's for sentiment analysis, content classification, or something else entirely, you'll need to use natural language processing (NLP). NLP is a field of computer science and artificial intelligence that deals with the interaction between humans and computers using natural language. And while there are many different NLP approaches, one of the most popular ways to get started is with an [NLP API](https://apilayer.com/marketplace/nlp-api
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eqoyeq4w6cylsvztqqd8.png)).

NLP is helpful in many different ways, such as improving search engines, automatic summarization, and machine translation

NLP, or natural language processing, is a branch of artificial intelligence that deals with analyzing, understanding, and generating human language. NLP is helpful in many different ways, such as improving search engines, automatic summarization, and machine translation. The use of NLP can help improve search engine results by determining the user's intent behind their query. It can also be used to automatically summarize text by extracting key phrases and creating a condensed version of the original text. Additionally, machine translation can be greatly improved using NLP techniques; for example,.
Getting Started in Developing Chrome Extensions
Tags: javascript, webdev, programming, tutorial
Published: 2022-09-30 05:30:37

> `Favourite qoute for the week: 👉 Programming is more about the logic than typing the codes`.

I read a post discussing why a web developer should develop chrome extensions.  It was intriguing to me as developing a chrome extension is no more than the tech stacks which I am so conversant with; HTML CSS and JavaScript.

## Introduction

Many who would be reading this article may already have used chrome extensions in one or two ways but may have no idea of it being a chrome extension. A popular chrome extension, for instance, is the adBlocker extension available on the chrome browser.

## What is a Chrome extension?

A chrome extension is a small single-purpose software program that runs on the browser to customize the browsing experience.

Chrome extensions are built on web technologies such as HTML,  CSS, and JavaScript.

## References

- 11 Reasons to Build a Chrome Extension: https://betterprogramming.pub/11-reasons-to-build-a-chrome-extension-c6e27bb73a72

- What are extensions: https://developer.chrome.com/docs/extensions/mv2/overview/#:~:text=Extensions%20are%20small%20software%20programs,HTML%2C%20JavaScript%2C%20and%20CSS. 

- Chrome Web Store: https://chrome.google.com/webstore/category/extensions

</br>
#### P.S.: Updates would be coming in on this article until it is full-fledged and also guidance reading.

Don't forget to drop a comment and share yout thouhts.

### Thanks to all for sharing your knowledge too on [this](https://dev.to/mrpaulishaili/heres-how-i-increased-a-website-performance-by-21-7di)
forEach() or map() ? When to use?
Tags: javascript, programming, tutorial, beginners
Published: 2022-09-30 05:17:14

In this article we'll discuss about `forEach` and `map` method in javascript. Which one best and when to use each one.

In JavaScript, `forEach` and `map` are two of the most popular methods to work with arrays. Primarily both use to iterate array. So this make a little bit confusion which one we should use.

## `forEach` Method:

`forEach` is used to run a function on each element without changing the array. Note, `forEach` method doesn’t return anything, if you try to get the return value of the `forEach` method, you will get undefined. Since it allows you to modify the source array itself, it’s a mutator method.

Code Example:
```js
// given array
let arr = [1, 2, 3, 4, 5];

//output the square of each number
let returnVal= arr.forEach(num => 
  console.log(`${num} x ${num} = ${num * num}`)
);

//the array hasn't changed
console.log(arr); 
console.log(returnVal);
```
```js
// Output
// 1 x 1 = 1
// 2 x 2 = 4
// 3 x 3 = 9
// 4 x 4 = 16
// 5 x 5 = 25
// [1,2,3,4,5]
// undefined
```
forEach not returning any new array. The return value of this method is ignored, and the original array doesn't change. The return value of forEach is always undefined.


## `map` Method

Similar to forEach method but return NEW ARRAY. It's create new array with return value, but forEach give us undefined. But map doesn't change the given array, so we can say that it’s an immutable method.

Code example:
```js
// given array
let arr = [1, 2, 3, 4, 5];

//output the square of each number
let returnVal= arr.map((num) => num * num)

//the array hasn't changed
console.log(arr); 
console.log(returnVal);
```
```js
// Output
 [1,2,3,4,5]
 [1,4,9,16,25]
```

So, as you see, map method return a new array with the returning value but doesn't change the given array. Given array remains unchanged

## So what is the differences between forEach and map?

As I said, map returns a new array but forEach return nothing. So, the main difference between map and forEach is that the map method returns a new array by applying the callback function on each element of an array, while the forEach method doesn’t return anything.
`forEach` method can be use to mutate the source array. Instead, it's **great** for when you need to do some action with **each** element of the array.

## Which one to use? 

If you’re planning to alter the array elements by applying a function, you should use the map method, since it doesn’t modify the original array and returns a new array. In this way, the original array is kept intact. On the other hand, if you want to loop through all the elements of an array and don’t need a returned array,  use the forEach method.
How can AR Art be used by artists and creators?
Tags: augmentedreality, art, metaverse, creators
Published: 2022-09-30 05:13:03

Do you know how Augmented Reality Art Opens Up New Ways?

Know How the Augmented Reality - AR artworks give you creative inventions, exact replicas of classics, or renovated classics given new significance.

## **For more information:**
 [https://bit.ly/3LEmkeZ](https://bit.ly/3LEmkeZ)
Capturar dato seleccionado desde un CarouselView en Xamarin Forms con MVVM
Published: 2022-09-30 04:32:06


## **Usamos un evento Command**

```xml
<StackLayout.GestureRecognizers>
<TapGestureRecognizer Command="{Binding
Path=BindingContext.CategoriaCommand,Source={x:Reference currentPage}}"
CommandParameter="{Binding .}"/>
</StackLayout.GestureRecognizers>
```

## Le asignamos un ID al CarouselView

```xml
x:Name="currentPage"
```

## Dentro del constructor del MVVM obtenemos el objeto

```csharp
CategoriaCommand=new Command(async (selectItem) => await CategoriaSelecionada(selectItem));
```

## Creamos un medoto asincrono, yo lo he llamado “CategoriaSeleccionada” para pasarle el parametro de tipo Object  y luego hacemos la conversion al modelo de datos que queramos

```csharp
public async Task CategoriaSelecionada(Object data)
{       
 _Categoria = (Categoria)data;
        if (_Categoria != null)
        {
            Categoria = _Categoria;
            IdCategoria =  _Categoria.idCategoria;
            await ListaProductos();
        }
    }

```
Importance Of Landmarks
Tags: a11y, webdev, api
Published: 2022-09-30 04:08:24

_Semantic structure is the foundation for accessible markup, as they properly convey information to the user through the accessibility API via screen readers._

This article is about the correct use of **landmarks**.

**Landmarks** allow screen reader users to navigate through sections of your website by skipping to content that interests them.

**Landmarks** could be seen as the logical layout of the website's UI, which is divided into e.g. header, navigation, main content, and footer. So the usage makes sense in any case.

For all the above areas, since the introduction of HTML 5, there are default **HTML tags** that provide screen reader users with the necessary semantic information, `<header>`, `<nav>`, `<main>`, `<footer>`.

To support older browsers or to preserve legacy code, there are ARIA roles as an alternative, which can be added to the respective HTML element, `role="banner"`,  `role="navigation"`,  `role="main"`  and  `role="contentinfo"`.

## Best practices
- Used landmarks to designate pre-defined parts of the layout
- Use HTML 5 tags over ARIA roles when possible
- Make sure that all text is withing a landmark

Read more about the [usage of ARIA landmarks](https://www.w3.org/TR/WCAG20-TECHS/ARIA11.html) in **ARIA11: Using ARIA landmarks to identify regions of a page**.
Auto copy a file to the newly created folder with a specific name in Linux
Tags: inotifywait, automation
Published: 2022-09-30 03:46:05

We have a file **readme.txt** in `/home/` and want it to be copied over to all new folders created within `/home/johndoe/` with names **junk** or **secret**

## Requirement
Have **inotifywait** installed: `sudo apt install inotify-tools`

## Script
1. Create a bash file **copier.sh** with the contents below
    ```sh
    #!/bin/bash
  
    inotifywait -m -r -e create,move ~/johndoe |
    while read dir op file
    do if [[ $op == "CREATE,ISDIR" && $file == 'junk' || $file == 'secret' ]]
    then cp ~/readme.txt "${dir}/${file}/readme.txt"
    elif [[ $op == "MOVED_TO,ISDIR" && $file == 'junk' || $file == 'secret' ]]
    then cp ~/readme.txt "${dir}/${file}/readme.txt"
    else :
    fi
    done
    ```
2. Make the script runnable with `chmod +x copier.sh`
3. Keep the script running by using deamon and supervisor

## Code Explanation
1. `inotifywait -m -r -e create,move ~/johndoe`
  - `-m`: keep the script running after 1 time
  - `-r`: recursively watch all folders
  - `-e`: events to watch for
  - `create,move` create is when the file/folder is created, move is used when renaming a folder
  - `~/johndoe`: folder being watched
2. `do if [[ $op == "CREATE,ISDIR" && $file == 'junk' || $file == 'secret' ]]`
  - Only do it when a **directory** is **created** and when the directory names are either **junk** or **secret**
3. `elif [[ $op == "MOVED_TO,ISDIR" && $file == 'junk' || $file == 'secret' ]]`
  - Only do it when a **directory** is **renamed** and when the directory names are either **junk** or **secret**
4. `cp ~/readme.txt "${dir}/${file}/readme.txt"`
  - Copy the **readme.txt** from home directory to the newly created directory

## Notes
The default maximum is **8192**; it can be increased by writing to `/proc/sys/fs/inotify/max_user_watches`. 

Learn more from https://linux.die.net/man/1/inotifywait
End of Phase 1 at Flatiron
Published: 2022-09-09 20:23:46

When I Started learning the basics of JavaScript I thought it was going to be pretty straight forward and not require too much practicing but wow I was wrong. The hardest thing for me to learn by far was array iterations. For example I thought the .filter() method was as simple as someConst.filter(isPrime) and whatever else you wanted filtered, but no its like:
const array= [1,2,3,4,5,6,]
function isPrime(num) {
   for (let i = 2;num > i; i++) {
      if(num % i === 0){
          return false;
      }
   }
}
console.log(array.filter(isPrime)); // [1,3,5]
when I first saw this I was so lost and didn't really understand what was going on but now after really going back and re-reading the documents from my class and looking things up all over the internet I now know that it is basically creating a new variable then seeing if there is a remainder if there isn't, it does not get logged. 

well I guess that's all for my first blog about how I was completely wrong about how much work is needed to truly understand what you are coding and how to make it work the way its intended.
Javascript: Higher-order functions
Tags: javascript, webdev, beginners, programming
Published: 2022-09-30 03:27:47

A function can take a function as an argument or can return a function as a value is called an higher-order function.

1. A function that returns a function

```javascript
const higherOrderFunc = function() {
    return function() {
        return 12;
    }
}

// which returns below function hence it is higher order function.
higherOrderFunc(); 
> ƒ () {
        return 12;
    }

higherOrderFunc()();
> 12
```

2. A function that takes a function as an argument

```javascript
const testFunc = function(x) {
    return x + 12;
}

//which takes function as an argument.
const higherOrderFunc = function(testFunc) {
    return testFunc(8);
}

higherOrderFunc(testFunc);
> 20
```

**Example: 1**

```javascript
function calculate(operation, numbers) {
    return operation(numbers);
}

function addition(numbers) {
    let sum = 0;
    for (const number of numbers) {
        sum+=number;
    }
    return sum;
}

function multiply(numbers) {
    let sum = 1;
    for (const number of numbers) {
        sum*=number;
    }
    return sum;
}

const numbers = [1,2,3,4,5];
console.log(calculate(addition, numbers));
> 15

console.log(calculate(multiply, numbers));
> 120
```
> calculate(multiply, numbers) - Don't append parenthesis while sending function as an argument.


**Benefits of higher-order functions:**

1. Reduces code duplication
2. Single responsibility 

In Javascript, functions can take arguments as primitives or objects and return the same called `first-order functions`. 

JS built-in higher order functions are:

`arr.reduce(), arr.forEach(), arr.filter(), arr.map()`

Thanks.

You can follow me here: https://twitter.com/urstrulyvishwak
mobx and application properties
Tags: mobx, javascript
Published: 2022-09-30 03:18:26

I'm building a web application to make music, a 'Modular Audio Workstation' (More Info: https://maw.earthytonez.com/) and there are two types of data being stored in this application.  

The first is "application data".  This is the synthesizers and sequencers users can create to make music.  The second are all of the parameters you can tweak for each of the modules, or components.  The synthesizers and sequencers are built  using a TOML formatted config, and loaded from static code in the application, so when loading a users workspace the only thing we need to know about them is the name or slug of the synthesizer and sequencer and what track they're on.  I store this data in a Track Store, and I store it as a nested JSON.  The model I use for this is based on this [gist](https://gist.github.com/du5rte/dbd18a1a6dc72d866737a5e95ca1e663). I just autosave the contexts of the stores.   Nested JSON makes sense here, since it's a relatively simple confiugration.

```
[{"id":0,"slug":"track-0","sequencer":{"name":"Four on the Floor","slug":"four_on_the_floor","type":"step"},"synthesizer":{"name":"Kick","slug":"kick"}},{"id":1,"slug":"track-1","sequencer":{"name":"Simple Arpeggiator","slug":"simple_arpeggiator","type":"arpeggiator"},"synthesizer":{"name":"Bell","slug":"bell"}},
```

Inside the stores are dozens, which will likely become hundreds of deeply nested classes to manage the code for increasingly complex sequencers and synthesizers that a user can use in their music.  Each of these classes likely has parameters that can be configured by the user.  

At first, I was storing these parameters as properties on the class itself.  But this became very difficult to Marshall the JSON when saving to local storage.  For one, if I changed the schema, it would break the song, in ways that may require guards against undefined values everywhere to figure out.  Additionally, I wanted each property to have some shared characteristics.  For instance, some properties pend their changes until the end of a measure or segment of the music.  Other properties I want to be able to add an [LFO](https://en.wikipedia.org/wiki/Low-frequency_oscillation#:~:text=Low%2Dfrequency%20oscillation%20(LFO),as%20vibrato%2C%20tremolo%20and%20phasing) or other modulation to, in fact almost every parameter I wanted to be able to do this with.  

Creating a Parameter class to subclass was an easy way to make every parameter modulatable, but I still needed a way to easily save the parameter.  I ended up storing them with hierarchical names in a flat key-value store.  (Just a javascript map as a top level Mobx store). The data is still hierarchical.  We need to know which track or synth the parameter applies to.  So now each parameter is stored in that flat Map with a key like:

track.1.synthesizer.cutoff_frequency
or 
global.bpm

I could have saved each parameter as a different key in local storage, but storing them in one location will make it easier to keep track of to allow for offline saving down the road.