teleren/devto huggingface dataset:
Chaos Engineering as a Service
Tags: aws, chaosengineering, fis
Published: 2021-05-28 20:04:29

The goal of chaos engineering is to understand how your application responds to issues by injecting failures into your application, usually running these experiments against production systems. 

AWS Fault Injection Simulator is a fully managed service for running fault injection experiments on AWS that makes it easier to improve an application’s performance, observability, and resiliency.

- Improve application performance, resiliency, and observability.
- Validate how your application performs on AWS.
- Safeguard fault injection experiments.
- A fast and easy way to get started with fault injection experiments.
- Get superior insights by generating real-world failure conditions

**How it works**

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y1tnt9ty926p289bju1g.png)

With a few clicks in the console, teams can run complex scenarios with common distributed system failures happening in parallel or building sequentially over time, enabling them to create the real world conditions necessary to find hidden weaknesses.
console.assert has a point
Tags: javascript, discuss
Published: 2021-05-28 20:03:30

You know about assert? It's that strange thing we don't talk about in JavaScript, historically, assert is a non standard feature which checks if a condition is true and if not, it throws. Modern browsers (and node module, "assert") actually contain console.assert, which I guess is a nice way of unwrapping an error in an if statement 🤷‍♂️, I'm sure gonna try it...

Now those of you who unit test, and I hope that's everyone (not always true), you understand the concept, perhaps console.assert could offer a way to write tests without a framework... Perhaps, but lets think about tests as they stand. In JavaScript, tests require much tooling to exercise code, they are kept in isolation and this means we can make suites, nice... It's not broken, don't fix it right?

Not exactly, it's important to know what or friends in the Rust community, are doing. In Rust, tests are wrote in the same file as the source, this makes testing feel not like an aside task, but a core part of the work.
Could it be that we could use the same way of working, adopt inline testing?

"But Adam, that's dumb! We would ship tests with our code..." Wait wait hang on, your neglecting the fact that our source is hardly ever shipped as is, we could be compiling and cutting out our tests, we could be using native assertion and some tool to just snip around this and cut it out of a deployment. Not such a heavy tooling approach?

Imagine, tests with the same source maps?

Cool idea Huh?
NexClipper - Have you heard about?
Tags: observability, prometheus, nexclipper
Published: 2021-05-28 19:49:19



Observability is one of hot topics in DevOps community but can't see that many managed Prometheus solutions available. Open source projects from NexClipper enables developers to have an observability solutions based on Prometheus in your cloud or laptop. 

**- ExporterHub**[Link](https://github.com/NexClipper/exporterhub.io)
Front-end application for the Prometheus Exporters community. ExporterHub.io is not just a curated list, but also provides exporter installation guide, alert rule configuration, and dashboard configuration

**- Webstork**[Link](https://github.com/NexClipper/webstork)
Web tunnel for Cloud-native application monitoring.

**- Klevr**[Link](https://github.com/klevry/klevr)
Hyper-connected Cloud-native delivery solution for SaaS

**- ProvBee**[Link](https://github.com/nexclipper/provbee)
Provisioning All the platforms for Cloud-native(includes terraform, virsh, kubectl, helm with all configurations)

**- MetrcArk**[Link](https://github.com/nexclipper/metricark)
Prometheus based status(State/Event/Metric) gather & exposer

Please evaluate these and let me know if you have any feedback!
Is it possible to have ssl certificate for ip address 
not domain name? Answer is YES :)
Tags: devops, linux, security
Published: 2021-05-28 19:21:38

"To be concise, here is how to generate an individual self signed SAN certificate with IP addresses. Expand the IP list to include your entire subnet and use one cert for everything."
######As said by https://stackoverflow.com/users/3421482/josiah-dewitt

```
#!/bin/bash
#using: OpenSSL 1.1.1c FIPS  28 May 2019 / CentOS Linux release 8.2.2004

C=US ; ST=Confusion ; L=Anywhere ; O=Private\ Subnet ; EMAIL=admin@company.com
BITS=2048
CN=RFC1918
DOM=company.com
SUBJ="/C=$C/ST=$ST/L=$L/O=$O/CN=$CN.$DOM"

openssl genrsa -out ip.key $BITS

SAN='\n[SAN]\nsubjectAltName=IP:192.168.1.0,IP:192.168.1.1,IP:192.168.1.2,IP:192.168.1.3,IP:192.168.1.4,IP:192.168.1.5,IP:192.168.1.6,IP:192.168.1.7,IP:192.168.1.8,IP:192.168.1.9,IP:192.168.1.10'

cp /etc/pki/tls/openssl.cnf /tmp/openssl.cnf
echo -e "$SAN" >> /tmp/openssl.cnf

openssl req -subj "$SUBJ" -new -x509 -days 10950 \
    -key ip.key -out ip.crt -batch \
    -set_serial 168933982 \
    -config /tmp/openssl.cnf \
    -extensions SAN

openssl x509 -in ip.crt -noout -text
```
$DOM is Domain (Incase you need)
Refer to https://stackoverflow.com/questions/2043617/is-it-possible-to-have-ssl-certificate-for-ip-address-not-domain-name#:~:text=An%20SSL%20certificate%20is%20typically,Certificate%20Signing%20Request%20(CSR).

#THE END
Solve Problem of Favicon
Tags: devbugsmash
Published: 2021-05-28 19:12:50

Hello Everyone, My name is Arbaz Hussain. I am a Undergraduate Student and currently staying in Jaipur(Raj). I have completed my intern as a role of frontend Engineer from Seventh Square Company. Basically It is a startup. I have contribution many open source Projects like Hacktoberfest, IIT Kharagpur, and many more. I have seen a post about DEV Community Bug Smash And I think it is best platform to contribution and Increase our Skills sets and gain knowledge. 


I am changing the old favicon to new forem favicon. A favicon, also known as a shortcut icon, website icon, tab icon, URL icon, or bookmark icon. It is a file containing one or more small icons, associated with a particular website or web page.

Link to solve the issue
{% github https://github.com/forem/forem/issues/12494 %}

Below link of approved PR!

{% github https://github.com/forem/forem/issues/13872 %}

I like this types of Contribution. It was a good Issues and easily tackle. This type of contribution is very helpful for increase knowledge and Experience.

Thank You!
Day 95
Tags: 100daysofcode, programming
Published: 2021-05-28 18:29:03

Day 95/200 of #200DaysOfCode #100DaysOfCode

- Solved three problems on Codewars.

1 - Chinese Zodiac (7 kyu)
2 - Date formatter (7 kyu)
3 - Pretty Time Formatter (7 kyu)
Mouse-Tracker, in just 10 lines of JavaScript;
Published: 2021-05-28 18:28:51

<a href="https://www.buymeacoffee.com/areeburrub" target="_blank"><img src="https://www.buymeacoffee.com/assets/img/custom_images/orange_img.png" alt="Buy Me A Coffee" style="height: 41px !important;width: 174px !important;box-shadow: 0px 3px 2px 0px rgba(190, 190, 190, 0.5) !important;-webkit-box-shadow: 0px 3px 2px 0px rgba(190, 190, 190, 0.5) !important;" ></a>

When I say mouse-tracker I mean it will track the position of cursor on the page, cursor position can be used to add some attractive features in your websites.

{% codepen https://codepen.io/areeburrub/pen/RwpLQrW %}

### Making of Layout
In the above example I am tracking the cursor over whole document you can also track the cursor inside a div, using this feature totally depends on your creativity.
And accordingly you can design the lay out

>Example: Tracking inside a `<div>`
{% codepen https://codepen.io/areeburrub/pen/gOmGvzW %}

### How it's working
In JavaScript there is one event called `.onmousemove` it is called whenever the cursor make movement.
We can select a element to detect the mouse movement in it `element.onmousemove`.So whenever this event is called it *calculates* the position and change the `style.top` and `style.left` of desired element.

### The calculation part
* Full Document Calculation
<pre>

    var x = event.clientX * 100 / window.innerWidth + "%";
    var y = event.clientY * 100 / window.innerHeight + "%";

</pre>
for full document tracking we simply take the windows height and width and find it's ratio with the mouse position which is also given in pixel by `event.clientX` and `event.clientY` then change it into percentage;

* `<div>` Calculation
<pre>

    var x = (event.clientX - container.offsetLeft) * 100 / container.offsetWidth  + "%";
    var y = (event.clientY - container.offsetTop) * 100 / container.offsetHeight + "%";

</pre>

for  div calculation we just subtract the offset position of div and use the offset height and width instead of window height and width.
The `offsetLeft`,`offsetLTop`,`offsetHeight`, `offsetWidth` tells us about the position and dimension of `<div>` including the padding also.

_*Note:using `transform:transalate(x,y);` to align or change position make the offset position inaccurate*_

<hr>
> ### Follow me for more like this
Read this also:
{% post https://dev.to/areeburrub/have-the-frost-glass-effect-on-your-website-see-how-hok %}
{% user areeburrub %}
Proxy 404 to different site with same host
Tags: nextjs
Published: 2021-05-28 18:26:49

Hi all, I would like to proxy my 404s to a different site. In this case I'd like to use my wordpress' sites ip address. I'm using a custom server to serve my static files, however, I don't know how to catch the 404 error with the handler and there seems to be no documentation about this. Any help would be much appreciated.![Capture22322](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uac8a4nwkisa4nehi6od.PNG)
Ruby TIL: Bubble babble encoding algorithm
Tags: ruby, algorithms
Published: 2021-05-28 18:12:10


---
title: Ruby TIL: Bubble babble encoding algorithm
published: true
tags: ruby, algorithms
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g8ffzicm49l6637kipov.jpeg
---

Today I'd like to share an interesting finding from Ruby's standard library. The method is called `bubblebabble` and lives in the [Digest module](https://ruby-doc.org/stdlib-2.6.2/libdoc/digest/rdoc/Digest.html#method-c-bubblebabble).

The main point of this method is to create digests that look and sound similarly to human words, so that they can be recognized and visually compared more easily than hexadecimal digests.

You can either use the method directly on `Digest` module (it'll run the encoding algorithm directly on the provided string) or on a specific digest class, like `Digest::SHA1` (it'll then run the algorithm on a SHA1 digest of the input string):
```ruby
irb(main):001:0> require 'digest/bubblebabble'
=> true
irb(main):002:0> Digest.bubblebabble('a')
=> "ximex"
irb(main):003:0> Digest::SHA1.bubblebabble('a')
=> "xociz-lynaf-livip-huniz-samah-tolat-sivov-pipiv-petel-kynyr-mexix"
```

### Some history

The bubble babble encoding was invented in 2000 by Atti Huima. You can find the original document with algorithm's description at http://web.mit.edu/kenta/www/one/bubblebabble/spec/jrtrjwzi/draft-huima-01.txt.

According to the author, the name combines the name of a video game classic [Bubble Bobble](https://en.wikipedia.org/wiki/Bubble_Bobble) and the fact that the generated strings can be pronounced but sound like babbling.

### Is this used anywhere for real?
Yes, this funny encoding method is used by the SSH2 suite to display easy-to-remember key fingerprints. The key is converted into a textual form, digested using SHA1, and run through bubble babble to create the key fingerprint.

You can test it out yourself by running  `ssh-keygen` with `-B` option (http://man.openbsd.org/ssh-keygen.1#B).
RASA - OR statements
Tags: rasa, chatbot, nlp, ai
Published: 2021-05-28 18:02:12

Another way to write shorter stories, or to handle multiple intents the same way, is to use an **or** statement.

For example, if you ask the user to confirm something, and you want to treat the **affirm** and **thankyou** intents in the same way. The story below will be converted into two stories at the training time:

```yml
# stories.yml
# ... previous content ...
  - story: confirm by affirm or thankyou
    steps:
      - intent: confirm
      - action: utter_ask_confirm
      - or:
          - intent: affirm
          - intent: thankyou
      - action: utter_confirmed
```

For this example to work, apart from the code we have from the previous chapters, I have created two new intents:
```yml
# data/nlu.yml
# ... previous content ...
  - intent: confirm
    examples: |
      - can I confirm
      - I want to confirm
      - I would like to confirm that
  - intent: thankyou
    examples: |
      - thank you
      - thanks
      - thanks a lot
      - thank you so much!
```

and added them to `domain.yml`:
```yml
# domain.yml
# ... previous content ...
intents:
  # ... previous intents ...
  - confirm
  - thankyou
```

We need the chatbot's responses as well:
```yml
# domain.yml
# ... previous content ...
  utter_ask_confirm:
    - text: Do you really want to confirm that?
  utter_confirmed:
    - text: Confirmed.
```

Let's see this in action:

![Conversation with OR first](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pp9gmctb3d86d76q8ttv.png)

![Conversation with OR second](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gt3su9r3smzegdlghcqm.png)

You can learn more about OR statements in the [documentation](https://rasa.com/docs/rasa/stories#or-statements).

In the next chapter, we will look at slots in detail.

Repository for this tutorial:
{% github petr7555/rasa-dev-tutorial no-readme %}

You can checkout the state of the repository at the end of this tutorial by running:
```bash
git clone --branch 14-or-statements git@github.com:petr7555/rasa-dev-tutorial.git
```
A WebComponent journey
Tags: javascript, webcomponents, frontend
Published: 2021-05-28 17:56:45

**TL:DR**; This is the [multi-select-webcomponent](https://www.npmjs.com/package/@honatas/multi-select-webcomponent) this post is about. MIT license, feel free to do whatever you want with it.

---

Have you ever heard of [WebComponents](https://www.webcomponents.org)? This is a standard specification which all major browsers implement, and it allows for an application to provide its own html tags. Of course you can pack those tag definitions in modules, and here lies the beauty of WebComponents: standardized components that can be reutilized in any application, in any modern browser.

But are they that beautiful in the real world? I'll talk about some things I found out while developing my own WebComponent:

### Shadow DOM

This is a feature of the specification that consists in encapsulating the component's DOM from the DOM where it is being included, so no styling rule applied to the component's parent will take effect in the component itself. It allows for your component to preserve its appearance and functionality regardless of whatever happens to the rest of the page.

The big problem I see here is that by doing this you are locking the style of your component, making it hard to fit in any application other than the one where the component was designed to fit.

When developing my component I chose to do not use Shadow DOM, ship it completely "naked" and give many tools for whoever is using the component to style it according to its own needs.

### Templating

The specification allows for using chunks of HTML as the template for your components, but these chunks must be present at the DOM. If you are thinking about modularity and intend to use the component in many projects, you'll have to come up with a way of hacking into the DOM where the component is being inserted to add your own HTML to it, so you can retrieve it later to use inside the component.

This can lead to disaster, so I chose to do not use any templating and create all the component's structure in javascript, which isn't very nice. Maybe I can come up with a way to use string literals but that's for another update.

### Modularity

You can create your components in UMD modules and ship them like that, but this would not allow for straightforward usage, so I chose to create an iife module everybody is more familiar with. This allows for anyone to just pick it up from a CDN and include in their page, or with a bit more knowledge add it to a SPA bundle (that's what I did in my project, using [Gulp](https://gulpjs.com)).

### Summing Up

At the end I was very satisfied with the results. Even though the code has gotten a bit complex because of no templating, the component itself has got a lot of functionality and can be easily used in any other future application.

So, what do you think of WebComponents? Are you considering making one of your own after reading this? I hope so. ;)
3 very cool projects (with demos) released at Microsoft Build
Tags: programming, productivity, beginners, csharp
Published: 2021-05-28 17:56:03

---
title: 3 very cool projects (with demos) released at Microsoft Build  
published: true
description: We'll investigate how to enable Quake Mode on Windows Terminal, Azure Bicep and .NET Hot Reload
tags: programming, productivity, beginner, csharp
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o0efxurlok0k87uv7snm.png
---

Hello everyone, 

As Microsoft Build was happening, I was playing with the new bits as they were released. While checking them out, I created a series of videos that covered some of my favorites which includes: 

* Quake Mode on Windows Terminal
* Azure Bicep
* .NET Hot Reload

Let's jump in!

**Quake Mode on Windows Terminal**

"Quake Mode" allows you to open a new terminal instance from anywhere in Windows by pressing the Win + ` key. 

You must be using the latest version of Windows Terminal Preview.  

Just place this code in your "actions" section: 
{
   "command":{
      "action":"globalSummon",
      "name":"_quake",
      "dropdownDuration":200,
      "toggleVisibility":true,
      "monitor":"any",
      "desktop":"toCurrent"
   },
   "keys":"win+`"
}

Supporting Materials:
https://devblogs.microsoft.com/commandline/windows-terminal-preview-1-9-release/
https://docs.microsoft.com/en-us/windows/terminal/customize-settings/actions#global-commands

Video (6 mins)
{% youtube vVy8XnDnslU%} 

**Azure Bicep**

Bicep is a Domain Specific Language (DSL) for deploying Azure resources declaratively without having to navigate the complexities of ARM templates. There are several benefits to this as it allows for a cleaner syntax, improved type safety, and better support for modularity and code re-use. 

Supporting Materials:
https://github.com/Azure/bicep

Video (9 mins)
{% youtube MYVMmXFV478%} 

**.NET Hot Reload**

.NET Hot Reload which shipped in the latest Visual Studio 2019 preview allows you to modify your apps source code while the application is running, without the need to manually pause or hit a breakpoint. Just make a change and click the "apply code changes" button and the magic happens.

Supporting Materials:

https://visualstudio.microsoft.com/vs/preview/
https://devblogs.microsoft.com/dotnet/introducing-net-hot-reload/
https://www.microsoft.com/en-us/p/esheep-64bit/9mx2v0tqt6rm#activetab=pivot:overviewtab

Video (6 mins)
{% youtube 3y5ACfQbsHk%} 

BONUS!

{% twitter 1397592607375585287 %}

Conclusion

Feel free to checkout my [Twitch streams](https://twitch.tv/mbcrump) as we learn about security and app development or you can watch the condensed version of all of my streams by subscribing to my [YouTube](https://youtube.com/mbcrump). 

Stay connected with me on social platforms for daily software development news.

-[Twitter](https://twitter.com/intent/follow?screen_name=mbcrump) | [Twitch](https://twitch.tv/mbcrump) | [Instagram](https://instagram.com/mbcrump) | [YouTube](https://youtube.com/mbcrump) | [GitHub](https://github.com/mbcrump) | [Website](https://www.michaelcrump.net)
What was your win this week?
Tags: discuss, weeklyretro
Published: 2021-05-28 17:49:47

---
title: What was your win this week?
published: true
description: Got to all your meetings on time? Started a new project? Fixed a tricky bug?
tags: discuss, weeklyretro
cover_image: https://cl.ly/188e843c2985/download/Image%202019-02-15%20at%202.36.37%20PM.png
---

Hey there!


**Looking back on your week, what was something you're proud of?**

All wins count — big or small 🎉

Examples of 'wins' include:

- Starting a new project
- Fixing a tricky bug
- Going on a walk with a friend... or whatever else might spark joy ❤️ 

---

Happy Friday!

![Happy Sun Running](https://media.giphy.com/media/26hisNbqTHrCduoWQ/giphy.gif)
loop skipping parts,break ,continue 
Tags: beginners, javascript
Published: 2021-05-28 17:49:00

**for loop skipping part:**
any part of for loop can be skipped

we can omit begin if we don’t need to do anything at the loop start.

Like here:
let i = 0; // we have i already declared and assigned
for (; i < 3; i++) { // no need for "begin"
  alert( i ); // 0, 1, 2
}

We can also remove the step part:
let i = 0;
for (; i < 3;) {
  alert( i++)
}

We can actually remove everything, creating an infinite loop:
for (;;) {
  // repeats without limits
} );
}

*Note*
the two for semicolons ; must be present. Otherwise, there would be a syntax error.

**Break**
we can break loop any time using the special break directive.

e.g.

let sum = 0;
while (true) {
  let value = +prompt("Enter a number", '');
  if (!value) break; // (*)
  sum += value;
}
alert( 'Sum: ' + sum );

In the above example  if none of value is entered or cancled The break directive is activated at the line (*) . It stops the loop immediately, passing control to the first line after the loop. Namely, alert.


**continue**
The continue directive is a “lighter version” of break. It doesn’t stop the whole loop. Instead, it stops the current iteration and forces the loop to start a new one (if the condition allows).

We can use it if we’re done with the current iteration and would like to move on to the next one.

e.g.
loop  uses continue to output only odd values:

for (let i = 0; i < 10; i++) {
  // if true, skip the remaining part of the body
  if (i % 2 == 0) continue;
  alert(i); // 1, then 3, 5, 7, 9
}
For even values of i, the continue directive stops executing the body and passes control to the next iteration of for (with the next number). So the alert is only called for odd values.
Locality Sensing Hashing
Tags: machinelearning, searchalgorithms
Published: 2021-05-28 17:30:32

Locality Sensitive Hashing (LSH) is a computationally efficient approach for finding nearest neighbors in large datasets. 
The main idea in LSH is to avoid having to compare every pair of data samples in a large dataset in order to find the nearest similar neighbors for the different data samples. 
With LSH, one can expect a data sample and its closest similar neighbors to be hashed into the same bucket with a high probability. 
By treating the data samples placed in the same bucket as candidates for similarity checking, we significantly reduce the computational burden associated with similarity detection in large datasets.

While LSH algorithms have traditionally been used for finding nearest neighbors, this module goes a step further and explores using LSH for clustering the data. 
Strictly speaking, this violates the basic mandate of LSH, which is to return just the nearest neighbors. 
(A data sample X being Y’s nearest neighbor and Y being Z’s nearest neighbor, in the sense neighbors are commonly defined with the Cosine metric in LSH, does not imply that X and Z will always be sufficiently close to be considered each other’s nearest neighbors.) 
Nonetheless, if you believe that your datafile consists of non-overlapping data clusters, this module may do a decent job of finding those clusters.

Reference:
https://pypi.org/project/LocalitySensitiveHashing/#:~:text=Locality%20Sensitive%20Hashing%20(LSH)%20is,for%20the%20different%20data%20samples.