teleren/devto huggingface dataset:
Practical DevOps #2: On shaming and blaming
Tags: devops, shaming, blaming, agile
Published: 2019-12-21 21:30:14

As I often state when I do talks or courses on the topic of DevOps, I'm a firm believer that DevOps has very little to do with technology, and a whole lot to do with culture.


We, as developers, are often very good at performing root cause analysis and present a conclusion whenever things go south. Usually, we're also as good at pinning that mistake onto someone, whether it's a colleague or ourselves.

I get it, we're analytically inclined and wont rest until we've found the root cause. This in itself is something positive that we should keep on doing. However, when even our tools use terms as blame (git blame anyone), it's clear that we might need to change how we do this.

Throughout the years, I've been in many organisations where, when someone detected an outage or bug in our production systems, everyone got real busy trying to find out who was "responsible" or "caused" it. This is a super-effective way to make sure that there is:

### Fear of punishment

If every failure is met with punishment, whether it's intended or not, the organisation will quickly become less prone to take risks or experiment. This stands in direct contradiction to the DevOps goal of promoting experimentation and collaboration.

No one wants to be called out as a failure. If the possible outcomes of trying something new ranges between silence or blame, why would anyone ever try to do something differently?

### Missed learning opportunities

Picture yourself learning something new. Maybe a new language, or an instrument. Every time you make a mistake, your friends or partner would call that out and tell you how your mistake ruined the whole song.

Even if they followed that up by giving constructive, actionable feedback on how you could improve. Would you be inclined to listen and learn from it? I know I wouldn't. Likely, I'd even stop trying altogether if it happened frequently.

---

## So what should we do?

A former colleague of mine had such an excellent saying on blame and shame:

> ### Focus on making it easier to succeed, not harder to fail

### Blameless post-mortems

Make sure you take every chance you get to inspect the outcome and make sure to understand *why* it happened and how to improve, not *who* did it and how to punish them.

### Practice acceptance

Things go south and mistakes happen. Until we learn to accept this fact, the expectations we have of ourselves and others won't be reasonable and will only lead to unnecessary stress and disappointment.

### Encourage change

Someone, unfortunately I don't really remember who, told me that they've actually renamed git blame to git praise, as in `finding out who to praise for having the courage to change something`. While it might not be feasible to replace the word in your tools, the sentiment is great. 

---

Thank you for reading. 🙏🏼

If you enjoyed this article, click the ❤️ button and subscribe to make sure you won't miss the next part.
What is your Favorite Browser?
Tags: watercooler, discuss, question, webdev
Published: 2019-12-20 12:18:08

I assume most of the web developers out there have many browsers installed for cross browser testing.

What is your favorite browser for personal use on desktop and mobile? I'm also curious if/how your opinion changed over time and what features you prefer.

*Plus: The one who can first comment the correct names of all browsers of the cover image in the correct order (left to right, top to bottom) gets a little christmas surprise from me...* 🎁🎄
New Year - New Sports Challenges!
Published: 2019-12-26 08:28:44

I usually start to think about my plans for the next year already in September. Big dreams, big plans but as we got closer my ambitions somehow seem to shrink a bit and transform to something more realistic. Sport is usually on top of my list of things I want to improve, each year. 
For 2020 I plan to:
1. Remember to eat healthy foods, and never to exercises soon after a meal 
3. Remember that daily training of a few minutes is better one hour once a month
3. Remember to prioritize my daily exercises
4. Remember that I can improve my results if I follow these simple rules and give my body the attention it deserves.

So many people in the world like to play sport because of the sense of challenge. Actually, some sports allow the players to face front-to-front opponents – a great occasion to show the public specific skills and capabilities, like physical endurance, strength and technical competence of that particular sport discipline rules. The sense of challenge, this strong call to compete against other people, is not the only reason why many people love to play sports of all types:

Sports can improve the physical look and healthy conditions
* Certain sports are excellent to develop better flexibility or muscle power
* Sports are a very good way to use your free time
* You can make friends if you attend a sports club or a gym
* Sports offer the players the opportunity to learn new things
Fighting scope creep / creeping featuritis
Published: 2019-12-27 18:52:07

You know that all too common problem - you keep thinking of new ideas, expanding the scope of your project, and forget that you have to prioritize them and ship the thing first? What do you do to tame this beast?

I've found that creating a simple idea checklist works wonders - GitHub Boards are one of many ways this can be done - and set a periodic reminder to check development against the plan so I don't drift too far.

What works best for you? I'm interested in your methods!
New React Select Box!
Tags: typescript, react, javascript, emotion
Published: 2019-12-28 00:28:06

I've recently implemented a react select box component which is extremely easy to use. Feel free to use it or contribute to make it better!

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/in8y8yj0f8ja3i66ykk8.gif)

Github: https://github.com/sepehr1313/react-select-tile
NPM: https://www.npmjs.com/package/react-select-tile
How to switch from learning one stuff to another while being as flexible as you can?
Tags: productivity, discuss, beginners
Published: 2019-12-28 00:29:52

A new year is approaching, shortlists are coming!

Let's imagine the following scenario: using the Warren Buffett 25/5 rule you came across with a mixed list of 5 things you need/want to learn next year. Technology (i.e. - JavaScript), tool (i.e. - Power Bi) or tech topic (i.e - Agile), whatever... all mixed.

1st Question: How would you switch from one topic to another and how much time would you dedicate on each learning on average? Some not-so-random options:

a) One topic each day?
b) One topic every two-four weeks (Sprint style)?
c) The First 20 Hours method?
d) Other way, your way...?

2nd Question (extra): In terms of learning a language, would you consider converting programs from one language to another as a good approach? Like, following a tutorial of a To-Do List project in C# and coding in Java and/or vice-versa.
Unity UI System ဆိုတာဘာလဲ
Published: 2019-12-29 04:39:28

အခုတခါမှာတော့ Unity မှာ User Interface (UI) ကို ဘယ်လိုဆောက်သလဲ ကြည့်ရအောင်။

UI တစ်ခုဆောက်တော့မယ်ဆို အရင်ဆုံး Canvas တခုလိုအပ်တယ်။ ပုံဆွဲသလိုပဲပေါ့။ Canvas ပေါ်မှာ ကိုယ်လိုချင်တာတွေကို တခုပြီးတခု ဆွဲသွားရတာ။ တကယ်လို့ Button ဖြစ်စေ၊ Text ဖြစ်စေ UI Component တခုခုက Canvas ရဲ့ child အနေနဲ့ ရှိမနေရင် UI ပေါ်မှာ ပေါ်လာမှာ မဟုတ်ပါဘူး။

![UI Components](https://i.ibb.co/QJSy3W1/Screen-Shot-2019-12-29-at-9-52-56-AM.png)

စစချင်း Unity ကိုလုပ်မယ့်သူတွေအတွက်ဆို UI အောက်မှာပါတဲ့ Text တို့၊ Button တို့၊ Dropdown တို့၊ TextInput တို့မှာ နှစ်ခုစီဖြစ်နေတာ နည်းနည်း confusing ဖြစ်တတ်တယ်။ ဘယ်နေရာမှာ ဘယ်ဟာသုံးမလဲပေါ့။

![UI Component Tree](https://i.ibb.co/3BQdBKy/Screen-Shot-2019-12-29-at-10-00-14-AM.png)

နောက်မှာ ဘာမှမပါတဲ့ Text တို့၊ Button တို့ဆိုတာ အရင်ထဲကပါတဲ့ဟာတွေဖြစ်ပြီး TextMeshPro ဆိုတဲ့စာပါတာတွေက နောက်ပိုင်းမှာ အသစ်ထည့်လိုက်တဲ့ဟာတွေပါ။ ဘာကွာသလဲဆိုတော့ TextMeshPro ပါတဲ့ Components တွေကပိုပြီး Customize လုပ်လို့ရလာတယ်၊ Screen မှာပေါ်တဲ့အခါလဲ ဝါးတာမှုန်တာတွေ မဖြစ်အောင် ပိုပြီး လုပ်ရလွယ်သွားတယ်။

UI အောက်မှာ ပါတဲ့ Component တွေကို အကြမ်းဖျင်း ကြည့်ကြည့်ရအောင်...

- Text

စာတွေဖော်ပြချင်တဲ့အခါသုံးတယ်။

- Text - TextMeshPro

စာတွေဖော်ပြချင်တဲ့အခါသုံးတယ်။ ရိုးရိုး Text ထက်ပိုပြီး Customize လုပ်လို့ရတယ်။

- Image

Sprite ပုံတွေ ပြချင်တဲ့အခါသုံးတယ်။ ပြတဲ့အခါ ပုံစံအမျိုးမျိုး လိုအပ်သလို customize လုပ်လို့ရတယ်။

- RawImage

Texture ပုံတွေ ပြချင်တဲ့အခါသုံးတယ်။

- Button

User နှိပ်ဖို့ Button တွေအတွက်သုံးတယ်။

- Button - TextMeshPro

Button မှာပေါ်တဲ့စာကို ပိုပြီး Customize လုပ်နိုင်တယ်။

- Toggle

On/Off အနေနဲ့ သတ်မှတ်တာတွေ လုပ်ချင်တဲ့အခါသုံးတယ်။

- Slider

Value တွေကို Maximum နဲ့ Minimum နှစ်ခုကြားမှာ ရွေးစေချင်တဲ့အခါ သုံးတယ်။

- Scrollbar

တခုထဲသုံးတာထက် ScrollView ထဲမှာ ထည့်သုံးလေ့ရှိတယ်။ ဘယ်ညာ အပေါ်အောက် Scroll လုပ်တာလုပ်ဖို့သုံးတယ်။

- Dropdown

နာမည်မှာပြထားတဲ့အတိုင်းပဲ User တွေကို ရွေးချယ်ဖို့ Option တွေပြချင်တဲ့အခါသုံးတယ်။

- Dropdown - TextMeshPro

နာမည်မှာပြထားတဲ့အတိုင်းပဲ User တွေကို ရွေးချယ်ဖို့ Option တွေပြချင်တဲ့အခါသုံးတယ်။

- InputField

User ဆီက နာမည်တို့၊ emailတို့ စသဖြင့် သူတို့ကို ရိုက်ထည့်စေချင်တဲ့အခါ သုံးတယ်။

- InputField - TextMeshPro

User ဆီက နာမည်တို့၊ emailတို့ စသဖြင့် သူတို့ကို ရိုက်ထည့်စေချင်တဲ့အခါ သုံးတယ်။

- Canvas

UI Components တွေပြဖို့ မရှိမဖြစ်လိုအပ်တဲ့ Component တခုဖြစ်တယ်။

- Panel

UI Components တွေကို သပ်သပ်စီ စုထားချင်တဲ့အခါ သုံးတယ်။​ ဥပမာ Button တခုကိုနှိပ်လိုက်ရင် alert box တပ်လာသလိုပေါ့။

- ScrollView

Contents ပြစရာများတဲ့အခါ Scroll လို့ရတဲ့ View တခုအနေနဲ့ ပြချင်တဲ့အခါသုံးတယ်။

- EventSystem

UI တွေကို နှိပ်လို့ ရွှေ့လို့ရအောင်လုပ်ဖို့ နောက်ကွယ်ကနေ handle လုပ်ပေးနေတဲ့ EventSystem ဖြစ်တယ်။
Elasticsearch Comrade Part #1 - SQL Queries
Tags: elasticsearch, elastic, sql, vue
Published: 2019-12-30 09:47:59

This is the first part of an Elasticsearch Comrade introduction series.
Elasticsearch Comrade is a management UI for common operations within elastic products.
In this post, I will cover the SQL Editor feature.
{% github moshe/elasticsearch-comrade %}

## Starting up Comrade server
You can install comrade with `pip` / `docker` / `source`
Follow the [installation guide](https://moshe-1.gitbook.io/comrade/installation) for more details


## The SQL UI
Once you configured Comrade and started the server, click on the desired server. Next, open the navbar and click on `🔎SQL` nav item
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/p9pb36770s9dfrdkxk4a.png)

## Sending queries and getting results
Now, The SQL editor will show up, and you free to send you queries 🙂
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/p4ot2o7d81bbaoeh7j2k.png)
Some things you need to know before running queries:
- SQL is only supported in ES version 7 and above
- The SQL syntax is quite standard except a few changes
- You can refer several indices at once using elasticsearch index [expansion syntax](https://www.elastic.co/guide/en/elasticsearch/reference/current/multi-index.html), for instance (Notice the second line)
```sql
SELECT count(*), source_node.name
FROM ".monitoring-es-*"
WHERE type = 'index_recovery'
GROUP BY source_node.name
LIMIT 100
```
-  You can apply Elasticsearch query function like match, query, and score by using them as a function
```sql
SELECT source_node.name, SCORE() -- Add score to selected fields
from ".monitoring-es-7-2019.12.22"
where MATCH('type', 'index_recovery') -- Use match query
order by SCORE() -- order by score
LIMIT 100
```

**Found this post useful? Add a ⭐️ to my Github project nor my [twitter profile](https://twitter.com/moshe_zada)🙂**

{% github moshe/elasticsearch-comrade %}
A CLI tool to create universal boilerplates
Tags: productivity, javascript, npm, node
Published: 2019-12-28 17:09:01

As I created new React components over and over again, I noticed that I wrote a lot of boilerplate code and I wanted to stop doing that. Sure, there are existing solutions to that specific problem, but I wanted to use a universal one, which could fit all my needs for boilerplates.

So I came up with this idea and open-sourced it. Any feedback appreciated!

https://github.com/eykrehbein/cook
Cloud: Virtual Machine Monitoring and Security Challenges
Tags: cloud, cloudcomputing, azure, vmm
Published: 2019-12-28 23:34:13


Virtual Machine Monitoring (VMM) is a software program that enables the creation, management and governance of virtual machines (VM) and manages the operation of a virtualized environment on top of a physical host machine. 

When VM Monitoring is enabled, the VM Monitoring service evaluates whether each virtual machine is in the cluster and up and running by checking for regular heartbeats and I/O activity from the processes running inside the guest. If there are no heartbeats or I/O activity received, this is probably because the guest operating system has failed. In this case, VM Monitoring service determines that the virtual machine has failed, and the virtual machine is rebooted to restore service. 

**Security Challenges**

Monitoring of the virtual machines with high security is always important, especially in the environments with hundreds of machines running on dozens of physical servers. There are several security challenges in Virtual Machine Monitoring. 

**SaaS security challenges:**

•	Hypervisor security challenges
•	Cross-side channel attacks between VMs. 

**Security issues in cloud environment:** 

Resources, such as servers, networks, and so on, are provided by IaaS in the form of virtualized systems. These systems are accessed through the Internet. The biggest security threats to cloud are: 
•	Data breaches
•	Data loss with no back up
•	Insider threats
•	DDoS attacks
•	Insecure APIs
•	Exploits
•	Account hijacking


**Cross VM Side channel attacks:**

Attackers can use security gaps to attack any component that may have an effect on other components. Attacks can take place through the major vulnerabilities identified in hypervisors. 
•	*VM Hopping* is an attack that can have an effect on denial of service, which makes resources unavailable to the user. 
•	*VM Escape* is a vulnerability that allows guest-level VM to attack its host.
•	*VM Mobility* is when a VM can move from one physical host to another. 

**Security techniques:**

•	Encryption and key management
•	Encryption of data-at-rest (encrypting the data on desk storage that protects data from illegal usage)
•	Encryption of data-at-transit (encrypting the confidential information such)
•	Encryption of data on backup media (external or internal storage)
•	Access control mechanisms
•	Virtual trusted platform module (vTPM)
•	Each VM has its associated vTPM instance that emulates the TPM functionality to extend the chain of trust from the physical TPM to each vTPM via careful management of signing keys and certificates. 
•	Virtual firewall (VF)
•	It is a service running in virtualized environment which provides usual packet filtering and monitoring services that a physical firewall provides. 
•	Trusted virtual domains
•	It is a security technique that groups the related VMs running on separate physical machine into a single network domain with a unified security policy.
Numba Introduction Video
Tags: python, numpy, numba
Published: 2019-12-29 08:03:27

---
title: Numba Introduction Video
published: true
description: Numba Introduction Video
tags: python, numpy, numba
---

Published a tutorial covering the most important basics of using Numba. You can find it here: https://youtu.be/x58W9A2lnQc

Hope it's useful to someone :)
javascript: DOM (document object model) 
Tags: beginners, dom, javascript, html
Published: 2019-12-29 17:59:52

---
title: javascript: DOM (document object model) 
published: true
description: 
tags: #beginners #dom #javascript #html
---

# What is the DOM?

The DOM is a representation of the html elements in your document as a tree. 

## What does this mean?  


It means that this html gets represented as a tree, so you can manipulate it with javascript.

```html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>DOM</title>
  </head>
  <body>
    <div class="container">
      <p id="pragraph">my paragraph</p>
    </div>
    <section>
      <header>
        <h1>header</h1>
      </header>
      <div class="container">
        <p class="counter">0</p>
      </div>
    </section>
  </body>
</html>
```

### How do I access the DOM through javascript?

Well there are a couple of ways, however you need the global property called document, here is an example:
```js
// By using querySelector or getElementById or getElementsByClassName

// Query selector 
  const paragraph = document.querySelector('#pragraph');
  console.log(paragraph); // this will get the paragraph element. 

// Or get element By id 
const paragraphById = document.getElementById('pragraph');
console.log(paragraphById);
```

To access any element we can just call querySelector:
```js
  const div = document.querySelector('div'); // first div
  const divs = document.querySelectorAll('div'); // all divs
/*
 One thing to notice here is that 
 document.querySelectorAll will get all the divs,
 and document.querySelector will get the first div it encounters. 
*/

```
Also by accessing the DOM with javascript you can manipulate it however you want, for example we can access the counter element and increment it by 1
```js
const counter = document.querySelector('.counter');
counter.textContent = '1';

```

One import thing to say is that js must be inside the script tag or you can import a file 
```html
<!--- no file --->
 <script>
 //  here goes your js  
</script>

<!--- file --->
<script src="./somescriptfile"> </script> 
```

Thank you and please leave some feedback :) I hope you enjoy the reading.
How to create cards on a grid with CSS
Published: 2019-12-30 01:41:43

Recently I've heard people having trouble creating cards on a grid in css, so I decided to make a quick tutorial to show you how to do that.


First you'll want to create a div to be the container for the grid and connect your css file to your html file or react component if you're using react.

```
<div class="cardContainer">



</div>
```

Let's go ahead and add some cards into our container.


```
<div class="cardContainer">
    <div class="card"><h2>Hello I'm a card</h2></div>
    <div class="card"><h2>Hello I'm a card</h2></div>
    <div class="card"><h2>Hello I'm a card</h2></div>
    <div class="card"><h2>Hello I'm a card</h2></div>
    <div class="card"><h2>Hello I'm a card</h2></div>
    <div class="card"><h2>Hello I'm a card</h2></div>
    <div class="card"><h2>Hello I'm a card</h2></div>
    <div class="card"><h2>Hello I'm a card</h2></div>
  </div>
```


Next open your css file and set your display to grid, create margin spacing, and create your grid columns.

```
.cardContainer {
    
    margin: 100px 100px 100px 100px;
    display: grid;

    /* you can change the 4 below to 3 if you only want 3 cards per row */
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 40px;
}
```


Now you'll want to style your cards. You can make them any size you want, heres an example of some cards.

```
.card {
    width: 300px;
    height: 200px;
    color: white;
    background-color: red;
    text-align: center;
 }
```

Cool now we have some cards on a grid. Play around with the sizing and see what you can create!
Learning to Be Noisy - Collab Lab Week 2
Tags: collablab
Published: 2019-12-30 03:12:11

I am one of four developers in [The Collab Lab](https://the-collab-lab.codes/) cohort 3. We are in our second of eight weeks. From the beginning it's been an incredibly valuable experience.

There are so many things about working on a team that just can't be duplicated when working alone. The practice and act of collaborating is a big one.

When I agreed to participate in this cohort, I said I'd "try" to document my experience. We all know how that goes. I'm gonna go ahead and publicly commit to documenting my experience and everything I'm learning.

Because I am kind to myself, I'm not going to try to go back and recall everything I wanted to say about The Collab Lab so far. Today is a start! Tomorrow is an opportunity to build on what I just started.

I'm sharing the two weekly sync videos that exist. It's totally embarrassing because I have a lot of practicing to do in getting comfortable with speaking about my work and verbal communication in general.
{% youtube zkMbD8i4znI %}

{% youtube 75vlSEHHVTA %}

Here are my pair's wiki pages for the first two weeks, too. 

- [Week 1](https://github.com/the-collab-lab/tcl-3-smart-shopping-list/wiki/(Week-1)-Nikema-&-Mike----(As-a-user,-I-want-to-be-able-to-navigate-within-the-app))
- [Week 2](https://github.com/the-collab-lab/tcl-3-smart-shopping-list/wiki/(Week-2)-Monica-&-Nikema-(As-a-user,-I-want-to-set-up-a-new-shopping-list))

I had a lot of fun setting these up and adding to them. I have a goal to improve upon my documentation and communication (through commit messages, slack, reviews) each week.

Good thing yer girl has a growth mindset. I'm okay with being temporarily embarrassed. I'm sure at the end of eight weeks I'll be fine, maybe even comfortable.
Brace matching, it's harder than it sounds!
Tags: javascript
Published: 2019-12-30 07:24:02

When writing a language with braces (I can see why whitespace sensitive languages are a thing now), one vital thing you will need to know is what thing is inside what brace. I am writing a sort of subset of JavaScript in the style of es5 (more like es 5.5 because some es6 features are just good!). I need to know how many braces are within a range of line no's, between L1 and L5 for example.

Given the sample:

```js
const input = `
{
    {
     // Depth 2
    }
}
`;
```

Initially I thought line by line we step through the input, when we encounter the token `{ L_BRACE` we should increment a count by one, when we encounter a `} R_BRACE` we should decrement.
In the sample we should have the following count.

```js
0
1
2
2
2
1
0
```

That looks great doesn't it! Not only do we know block we are in we also know the depth, ideal, but an object literal is not a block scope, so how do we avoid that, what about destructuring? Okay so we could avoid this whole mess with a simple (yet incorrect assumption), what do blocked scoped things have in common?

```
function name(){
function (){
class Foo {
class {
for () {
try {
while {
do {
with {
if {
switch {
{

```

Okay that's all I could remember this time In the morning ☕. In answering my previous question Where should the brace sit? At the End Of Line (EOL), so I could check that the opening brace is preceded by a whitelist of words, or it is not an assignment AND the brace is at EOL. Great sorted yes? No, because some programmers like my brother care not for good formatting and could do this.

``` js
function anoying () { const imATroll = true;
    // I laugh at your feable algorithms
}
```

My brother is such a pain, because now the brace is not at the end of the line, we can't use this algorithm. I'm stumped 🙄, I'm sure I will solve it and that's my goal for this week.

What other problems could I solve?
Well mismatched braces are easier to detect, nievely you could filter the lines containing the braces that fit the above unsolved criteria, then count the length, if the number is odd, we can say stop! This program is broken... But where?

Looping through line by line will not tell you where the program broke because we need the entire program to determine what looks a bit off.

This problem is so simple in theory, anyway wish me luck and add your suggestions in the comments!