teleren/devto huggingface dataset:
Day 80: The Setup
Tags: hiphop, code, coding, lifelongdev
Published: 2020-02-06 23:36:10

_liner notes_:

- Professional : Made it to the hotel. It was too early to check in so I went to the registration room to get my badge and swag bag. In the same room are the tables where the exhibitors will be located. My coworker who's also the organizer of the conference showed me the table we'll be using. All our equipment was already delivered and waiting for us. There was a team meeting that logged into from the meeting room. Got the setup of the table and signage completed. Here's a pic: 

![Table set up for Sunshine PHP 2020 with various Nexmo / Vonage swag](https://dev-to-uploads.s3.amazonaws.com/i/6s552u8t8dppz3gt7qo0.jpg)

- Personal : So around 4pm, it was time to check into my room. Did that and started working on my side project https://doingstuff.in because I noticed that when there are 2 sequential 360 photos, the image doesn't change. I believe it's because I'm using a plugin and the image source probably doesn't change. Hoping to get that worked out soon. I've got an idea.

![Arial view of D'Urville Island, New Zealand with green hills, winding roads and an ocean at the top ](https://dev-to-uploads.s3.amazonaws.com/i/pa45h8oej53ydoao0fgb.png)

Got invited to go to the speaker's dinner tonight. Looking forward to it. I want to try and work out this 360 photo issue before I go. Tomorrow is the first official day of Sunshine PHP. Going to be a pretty good time.

You can check everything out at https://dwane.in/SunshinePHP2020

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube A3_syznHL5Y %}
Why is Kafka so Fast
Tags: kafka, bigdata, eventsourcing, microservices
Published: 2020-02-06 22:04:35

The last few years have brought about immense changes in the software architecture landscape. The notion of a single monolithic application, or even several coarse-grained services sharing a common data store has been all but erased from the hearts and minds of software practitioners world-wide. Autonomous microservices, event-driven architecture, and CQRS are the dominant tools in the construction of contemporary business-centric applications. To top it off, the proliferation of device connectivity — IoT, mobile, wearables — are creating an upward pressure on the number of events a system must handle in near-real-time.

***

Let's start by acknowledging that the term 'fast' is multi-faceted, complex, and highly ambiguous. Latency, throughput, jitter, are metrics that shape and influence one's interpretation of the term. It is also inherently contextual: the industry and application domains in themselves set the norms and expectations around performance. Whether or not something is fast depends largely on one's frame of reference.

**Apache Kafka is optimised for throughput** at the expense of latency and jitter, while preserving other desirable qualities, such as durability, strict record order, and at-least-once delivery semantics. When someone says 'Kafka is fast', and assuming they are at least mildly competent, you can assume they are referring to Kafka's ability to _safely_ accumulate and distribute a very high number of records in a short amount of time.

[Read the rest of the article on Medium.](https://medium.com/swlh/why-kafka-is-so-fast-bde0d987cd03)
Git: globally change GitHub-remotes from git@ to https
Tags: git, github
Published: 2020-02-06 21:40:06

## Setting upstreams

Are you finding yourself using `git remote --add --push`-commands not to actually change the location, but to fix authentication problems with GitHub arising from using ssh instead of https? There is a simple solution. 

The format of the ssh-url is

**git@github.com:{userOrOrg}/{repoName}.git**, while we want it to be
**https://github.com/{userOrOrg}/{repoName}.git**
 
That is very predictable, so you can run the following command:

`git config --global url."https://github.com/".insteadOf git@github.com:`

Note the trailing slash as well as the colon! 

## Yes, that simple!

That's it. You can verify (and change) the setting by inspecting the global configuration:

`git config --global --edit`
Advanced TypeScript Exercises - Question 1
Tags: typescript, javascript
Published: 2020-02-06 21:37:14

--- series: Advanced TypeScript Exercises ---

If we have a type which is wrapped type like `Promise`. How we can get a type which is inside the wrapped type? For example if we have `Promise<ExampleType>` how to get `ExampleType`?

Take a look at below code. Write an utility type `Transform` which will take a generic type argument, and if it is a `Promise` it will evaluate to the type inside it.

```ts
type X = Promise<string>
type Y = Promise<{ field: number }>

type ResultX = Transform<X>; // ResultX type equals string
type ResultY = Transform<Y>; // ResultY type equals { field: number }

type Transform<A> = /** here your answer **/
```

Post your answers in comments. Have fun! Answer will be published soon!

If you are interested in notifications about next articles please follow me on [dev.to](https://dev.to/macsikora) and [twitter](https://twitter.com/macsikora).
Introducing Firefox and Edge Support in Cypress 4.0
Tags: testing, e2e, javascript, opensource
Published: 2020-02-06 21:20:47

Today, we're excited to [release](http://on.cypress.io/changelog#4-0-0) the highly-anticipated support for Firefox and the new Microsoft Edge browsers in [Cypress 4.0](http://on.cypress.io/changelog#4-0-0). Adding the capability to run Cypress tests in Firefox has been one of the most frequently requested features by the community. So our team has been working hard to provide this feature with the same great developer experience users have come to enjoy and expect from Cypress.

With the power of testing in multiple browsers, comes the responsibility of implementing the right CI strategy to achieve an optimal balance of confidence, performance, and cost. To guide these crucial decisions, we're launching a new [Cross Browser Testing Guide](https://on.cypress.io/cross-browser-testing) with various recommendations to help you implement the right CI strategy for your project and team.

Cypress 4.0 marks a significant milestone in the development of Cypress and sets the stage for an exciting pipeline of capabilities that will continue to elevate the testing experience for everyone.

Install or upgrade ([migration guide](https://docs.cypress.io/guides/references/migration-guide.html#Migrating-to-Cypress-4-0)) to version 4.0 today. Get started by checking out the new [Cross Browser Testing Guide](https://on.cypress.io/cross-browser-testing). If you're entirely new to Cypress, check out our [Getting Started Guide](http://on.cypress.io/installing-cypress).
CKAD - Revision - Observability
Tags: kubernetes, linux, devops, docker
Published: 2020-02-06 21:11:26

# Liveness Probes

Many applications running for long periods of time eventually transition to broken states, and cannot recover except by being restarted. Kubernetes provides liveness probes to detect and remedy such situations.

Here is an example of a pod using a liveness probe:

```
apiVersion: v1
kind: Pod
metadata:
  labels:
    test: liveness
  name: liveness-exec
spec:
  containers:
  - name: liveness
    image: k8s.gcr.io/busybox
    args:
    - /bin/sh
    - -c
    - touch /tmp/healthy; sleep 30; rm -rf /tmp/healthy; sleep 600
    livenessProbe:
      exec:
        command:
        - cat
        - /tmp/healthy
      initialDelaySeconds: 5 // how long to wait before performing first probe
      periodSeconds: 5 // how often to run the liveness probe
```

# Readiness Probes

Sometimes, applications are **temporarily unable to serve traffic**. For example, an application might need to load large data or configuration files during startup, or depend on external services after startup. A pod with containers reporting that they are not ready **does not receive traffic through Kubernetes Services.**

Readiness probes are configured similarly to liveness probes. The only difference is that you use the **readinessProbe** field instead of the livenessProbe field.

```
readinessProbe:
  exec:
    command:
    - cat
    - /tmp/healthy
  initialDelaySeconds: 5
  periodSeconds: 5
```
How to build a Machine Learning Model in a single line of code 
Published: 2020-02-06 20:59:34

AutoViMal is a Python library that automatically builds a machine learning model in a single line of code.

In this video, I talked about how we can use AutoViMal to participate in Data ScienceNigeria competition on kaggle 

link: https://t.co/oi8NKN3MK4
CSS Grid Based Responsive Image Gallery
Tags: css, webdev, tutorial
Published: 2020-02-06 20:30:35

Just pushed another CSS tutorial, this one a practical exercise on using the CSS grid to create a fancy responsive web gallery.  The benefits of using the grid here are we can have a 'masonry' style layout, without any javascript.  
___
Please consider subscribing to the [YouTube Channel!](http://www.youtube.com/FollowAndrew?sub_confirmation=1)
___
{% youtube gvPyJ0rc944 %}

Here are a few of the CSS tips & tricks I use in the video to pull off the gallery.

* **CSS Grid Template Columns** - To create a 6 column grid
* **CSS Grid Template Auto Rows** - To create alternating height auto rows for visual interest
* **CSS Animation**s - To create a 'label' that animates down into view on gallery hover
* **CSS Transforms** - To create a 'zoom effect' when hovering on an image thumbnail
* **CSS Grid Spans** - To make it super easy to have images span arbitrary columns and rows
* **CSS Object Fit** - To make the thumbnails stay centered when resizing the viewport
* **CSS Backdrop Filter** - To create some fancy effects (blur & saturation) behind the label when it animates into view (won't work in Firefox)
* **CSS Media Query** - 2 liner to make a mobile view flow into a single column
Looking for feedback - carmanuals.org
Published: 2020-02-06 20:18:58

https://carmanuals.org/

I have been working on getting this site up for the past year. It's the first site that I have worked on that is NOT built on WordPress. It’s built with GatsbyJS and ReactJS.

I am trying to compile the largest and most accurate database of PDF car owner's manuals online.

Obviously, I still have a way to go, but I would love to hear your feedback!
Angular: Component vs Directive
Tags: angular, components, directives
Published: 2020-02-06 20:14:53

Directives


“The mechanism by which we attach behaviour to elements in the DOM, consisting of Structural, Attribute and Component types.”



Angular templates are dynamic. When Angular renders them, it transforms the DOM according to the instructions given by directives. A directive is a class with a @Directive() decorator.



In addition to components, there are two other kinds of directives: structural and attribute. Angular defines a number of directives of both kinds, and you can define your own using the @Directive() decorator.



Just as for components, the metadata for a directive associates the decorated class with a selector element that you use to insert it into HTML. In templates, directives typically appear within an element tag as attributes, either by name or as the target of an assignment or a binding.



Example:



import {Directive} from 'angular2/angular2';

@Directive({
    selector: "[myDirective]",
    hostListeners: {
        'click': 'showMessage()'
    }
})

class Message {

    constructor() {
        // initilization
    }

    showMessage() { console.log('Hello Directive'); }
}

<button myDirective>Click here</button>





Components



“The specific type of directive that allows us to utilize web component functionality - encapsulated, reusable elements available throughout our application.”



Components are basically just a new type of directive that is designed for component-based architecture. In a lot of ways, components are more restricted in their functionality, instead encouraging better conventions and design that actually leads to more maintainable and reusable code.



Components are so distinctive and central to Angular applications that Angular defines the @Component() decorator, which extends the @Directive() decorator with template-oriented features.      

     

  “Component is a directive with a view or template”  





Example:



import {Component, View} from 'angular2/angular2';

@Component({
  selector: 'message'
})

@View({
  template: `
      <h1>Hello Angular {{version}}</h1>
  `
})

class Message {
  constructor(public version: string) {}
}

<message></message>




Differences:

Components

 - For register component we use @Component meta-data annotation.

 - Component is a directive which use shadow DOM to create encapsulate visual behavior called components.  Components are typically used to create UI widgets.

- Component is used to break up the application into smaller components.

- Only one component can be present per DOM element.

- @View decorator or templateurl template are mandatory in the component.

- Component is used to define pipes


Directives

- For register directives we use @Directive meta-data annotation.

- Directives is used to add behavior to an existing DOM element.

- Directive is use to design re-usable components.

- Many directive can be used in a per DOM element

- Directives don’t have View.

- You can’t define Pipes in directive.
Kubernetes and Istio service mesh workshop materials
Tags: beginners, opensource, kubernetes, showdev
Published: 2020-02-06 20:04:07

---
title: Kubernetes and Istio service mesh workshop materials
published: true
description: In the past year, I have done multiple workshops on Kubernetes, Istio and cloud-native development. As part of my workshops, I usually start with theory and explain the concepts using slides, show some demos, but then it's on you, the participant to try out the technology yourself.
tags: beginners,opensource,kubernetes,showdev
---

In the past year, I have done multiple workshops on Kubernetes, Istio, and cloud-native development. As part of my workshops, I usually start with theory and explain the concepts using slides, show some demos, but then it's on you, the participant, to try out the technology yourself. For this purpose, I have created a couple of exercises that guide you through different features and let you see the theory in practice as well.
The workshop is targeted for beginners - you don't need to know Kubernetes nor Istio to go through it. If you are already familiar with Kubernetes, you can go through the service mesh portion only.

## Workshop outline

**Kubernetes basics**

1.  Installing Kubernetes and the CLI (`kubectl`)
1.  Running containers
1.  Accessing services
1.  Scaling up/down
1.  Config maps and secrets
1.  Health checks: liveness, readiness and startup probes
1.  Resource quotas

**Installing Istio**
**Traffic Management**

1. Accessing services through a gateway
1. Splitting traffic
1. Using a service entry

**Service Resiliency**

1. Dashboards (Grafana, Jaeger, Kiali)
1. Slowing down the services
1. Breaking the services

**Security with Istio**

1. Using JWT for authentication
1. Enabling RBAC
1. Service accounts

## Where to get it?

I open-sourced the material I use during my workshops, and you can get the whole thing here:

- [https://github.com/peterj/workshop-material](https://github.com/peterj/workshop-material)

You can ⭐️ star, ⑂ fork, and send pull requests as I am pretty sure there are typos somewhere.


If you are interested in more cloud-native content, you can follow me on [Twitter](https://twitter.com/pjausovec) and sign up for my newsletter at [https://learncloudnative.com](https://learncloudnative.com).
Informational status codes
Tags: webdev, programming, productivity, softwareengineering
Published: 2020-02-06 19:43:20

---
title: Informational status codes
published: true
description: listing of informational status codes and their descriptions
tags: webdev, programming, productivity, softwareengineering
series: HTTP Status Code Cheatsheet
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/9k9h8vue5c3jwf17o7a4.jpg
---


*Preface:* A HTTP status code is issued from the server in response to a client's request made to the server. The five status code response classes are **informational**, **successful**, **redirection**, **client error** and **server error**.

---

---

---

## Informational status codes

Informational status codes indicate that the request initiated by the browser was received and is continuing.

### Table Of Contents
  * [100 Continue](#continue)
  * [101 Switching Protocols](#switching-protocols)
  * [102 Processing](#processing)
  * [103 Early Hints](#early-hints)

---
#### `100  Continue` <a name="continue"></a>

*Definition:* The request has been received and has not yet been rejected by the server. The server intends on sending a final response once the request has been completed meaning that the server has received the request headers and client can now proceed to send the request body. To have a server check the request's headers, a client must send `Expect: 100-continue` as a header in its initial request and receive a `100 Continue` status code in response before sending the body.

`100  Continue` is defined in [RFC 7231](https://tools.ietf.org/html/rfc7231#section-6.2.1).

---
#### `101 Switching Protocols` <a name="switching-protocols"></a>

*Definition:* The request has asked the server to switch protocols. The server response indicates that it is switching protocol as requested. In this response, the server includes an `Upgrade` response header to indicate the protocol it switched to.

`101 Switching Protocols` is defined in [RFC 7231](https://tools.ietf.org/html/rfc7231#section-6.2.2).

---
#### `102 Processing` <a name="processing"></a>

*Definition:* The request has been received and is being processed by the server, but no response is available yet. In the meantime, this response prevents the client from timing out and assuming the request was lost.

`102 Processing` is defined in [RFC 2518](https://tools.ietf.org/html/rfc2518#page-59).

---
#### `103 Early Hints` <a name="early-hints"></a>

*Definition:* The server is likely to send a final response with the header fields included in the informational response. Mainly intended to be used with the `Link` header to allow the user agent to start preloading resources while the server is still preparing a response.

`103 Early Hints` is defined in [RFC 8297](https://tools.ietf.org/html/rfc8297).

---

---

---

Unofficial and customized non-standard responses defined by server softwares are not included in the list above. 

Resources:
- [Hypertext Transfer Protocol (HTTP) Status Code Registry](https://www.iana.org/assignments/http-status-codes/http-status-codes.xhtml)
- [Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/Web/HTTP/Status)
What is this style?
Published: 2020-02-11 16:28:44

---
title: What is this style?
published: true
date: 2020-02-06 19:35:55 UTC
tags: 
canonical_url: https://www.gilcreque.blog/2020/02/06/what-is-this.html
---

Design and Dev friends, what is this style called?

- [planetary.social](https://planetary.social/)
- [wetransfer.com/about](https://wetransfer.com/about)
- [mailchimp.com](https://mailchimp.com/)

To me the common thread is the fonts used, the big color areas, the illustrations.

![mailchimp.com](https://www.gilcreque.blog/uploads/2020/c69bc5f087.jpg)

![wetransfer.com](https://www.gilcreque.blog/uploads/2020/8c34f0e559.png)

![planetary.social](https://www.gilcreque.blog/uploads/2020/33f288ac81.png)
WhatsApp latest updates roll out
Tags: whatsaapplatest
Published: 2020-02-06 17:58:11

डिलीट मैसेज फीचर ग्रुप चैट्स के लिए उपलब्ध होगा और केवल ऐडमिनिस्ट्रेटर्स के लिए उपलब्ध होगा
जाहिर है, यह फीचर ग्रुप चैट के लिए 'क्लीनिंग टूल' के रूप में काम करेगा

<a href=https://www.whatsapp.com/android>Whatsapp(s)</a> अपने उपयोगकर्ताओं को सुगम संदेश प्रदान करने और कॉल अनुभव प्रदान करने के लिए सुविधाओं की एक बीवी को शामिल करने के लिए लगातार अपने सॉफ़्टवेयर को अपडेट करता रहता है।

इस सूची में जोड़कर, फेसबुक के स्वामित्व वाला मैसेजिंग ऐप, व्हाट्सएप के विकास को ट्रैक करने वाले एक ब्लॉग WABetaInfo के अनुसार, अपने बहुप्रतीक्षित गायब संदेश सुविधा के iOS बीटा संस्करण को धीरे-धीरे बाहर निकाल रहा है।

ब्लॉग ने पहले भी एंड्रॉइड के बीटा संस्करण में उसी सुविधा को देखा था। यह भी पुष्टि की कि यह सुविधा समूह चैट के लिए उपलब्ध होगी और केवल प्रशासकों के लिए सुलभ होगी।  <a href=https://whatsappvideostatus.in/love-status-video/>Love Status Video</a> एक बार उपलब्ध होने के बाद, सुविधा उपयोगकर्ता द्वारा निर्धारित एक विशेष समयावधि के बाद संदेशों को स्वचालित रूप से हटा देगी और ऐसा लगेगा कि संदेश कभी मौजूद नहीं था।

एक दिलचस्प विशेषता यह भी है कि ऐप के नवीनतम बीटा संस्करण में देखा गया था। जाहिर है, नया डिलीट मैसेज फीचर ग्रुप चैट के लिए "क्लीनिंग टूल" के रूप में काम करेगा। यह अनिवार्य रूप से इसका मतलब है कि सुविधा विशेष रूप से समय के बाद समूह संदेशों को हटाने और स्वचालित रूप से भंडारण स्थान को प्रबंधित या प्रबंधित करने में मदद करेगी।

ब्लॉग में कहा गया है, "समूहों में आमतौर पर बहुत सारे संदेश होते हैं और यह सुविधा आपके फोन के भंडारण को बचाने में मदद कर सकती है, पुराने संदेशों को स्वचालित रूप से हटा सकती है (केवल प्रशासक ही इसे सक्षम अक्षम कर पाएंगे)"।
Edge Side Includes, ESI Lang and Micro Front Ends
Tags: esi, microfrontends, javascript, react
Published: 2020-02-06 19:23:38

I seem to 'discover' I know less and less every week ! 

This week I 'discovered' Edge Side Includes and Micro Front Ends

Resources
* https://www.w3.org/TR/esi-lang
* https://github.com/dunglas/react-esi

DEV articles
{% link https://dev.to/florianrappl/microfrontends-from-zero-to-hero-3be7 %}
{% link https://dev.to/florianrappl/11-popular-misconceptions-about-micro-frontends-463p %}
{% link https://dev.to/silarhi/divisez-le-temps-de-reponse-de-votre-site-web-par-100-avec-varnish-et-les-fragments-esi-46kd %}
How to list buckets by name and size to measure Billing and other analyzes.
Tags: devops, linux, aws, bash
Published: 2020-02-06 19:12:16



```sh
#!/bin/bash
aws_profile=('profile1' 'profile2');

#loop AWS profiles
for i in "${aws_profile[@]}"; do
  echo "${i}"
  buckets=($(aws --profile "${i}" --region <region> s3 ls s3:// --recursive | awk '{print $3}'))

  #loop S3 buckets
  for j in "${buckets[@]}"; do
  echo "${j}"
  aws --profile "${i}" --region <region> s3 ls s3://"${j}" --recursive --human-readable --summarize | awk END'{print}'
  done

done
```
Negotiate a Raise // the Truth About Leverage (video)
Tags: career, salary, raise, tips
Published: 2020-02-06 19:09:20

A no-BS guide to asking your manager for a raise with and without an external offer.

VIDEO LINKS:
☆ How to Negotiate Salary After Receiving a Job Offer: https://www.youtube.com/watch?v=FiDcUaoODJE
☆ Two Numbers You Need to Know Before Negotiating: https://www.youtube.com/watch?v=vHklSyK4LyM

CANDIDATE PLANET:
Advice for candidates applying to tech companies. We answer questions from engineers, developer advocates, designers, marketers, all kinds of managers and many more.

Email ask@CandidatePlanet.com with questions. Adam and I will email you personal advice, and anonymize your question for the show so that other candidates can benefit, too.

SUBSCRIBE:
☆ Youtube ☆ https://youtube.com/channel/UCdvny6qs8e4VUJIG01puw2Q
☆ Newsletter ☆ https://dangoormendel.com/newsletter

MORE ABOUT US:
☆ Website ☆ https://dangoormendel.com
☆ Speaking Inquiries ☆ lusen@candidateplanet.com
☆ Client Inquiries ☆ hello@dangoormendel.com
☆ LinkedIn Lusen ☆ https://linkedin.com/in/lus
☆ LinkedIn Adam ☆ https://linkedin.com/in/adamdangoor
☆ Twitter Lusen ☆ https://twitter.com/staycalmcomic
☆ Twitter Adam ☆ https://twitter.com/AdamDangoor

{% youtube gjqDE2ZYMik %}