teleren/devto huggingface dataset:
Solving React Problems: When to use UseMemo 
Tags: react, javascript
Published: 2022-01-20 22:55:33

I always see this question, and for some reason, it could be hard to find a good reason.

I can imagine if you are from Angular framework it can be a problem to find a similar concept or example.

Although, if you are from Vue.js, it can be easier to understand if you compare userMemo with a computed value.

React.js and Vue.js are oriented to functional programming styles and focused on reducing the number of render cycles. 

In the case of React.js , you must execute setState in the old days before hooks, and now you must use useState. In that way, you can centralize and control when the render cycle job is executed

In Vue.js you can find a similar strategy. Vue.js provides reactive properties by implementing setter and getter under the hood. You can control when to re-render based on small changes. and this is how Vue.js can provide double-binding like angular 

While Angular has a big problem, Angular is still rendering all the component trees and has a change detector that tries to intercept DOM events, but this gives it a poor performance and is hard to improve.


Let's go with some examples 
react.js
```
const weekDaySelected = useMemo(() => {
    const { day, month, year } = props.selectedDay || {};
    return getDayLabel(day, month, year);
  }, [props.selectedDay]);

render (
 <CalendarHeaderDay day="sun" active={weekDaySelected === "Sun"} />
)
```

In this example, `weekDaySelected` is a primitive variable , which depends of prop, and must be reactive at any change to 
`props.selectedDay` and in this way also allow avoiding unneeded renders in the component

On the other side, we have Vue.js

```
<template>
  <CalendarHeaderDay day="sun" :active="weekDaySelected === 'Sun'" />
</template>
...
export default {
  props: {
    selectedDay: {
      type: Object
    }
  },
 computed: {
    weekDaySelected() {
      const { day, month, year } = this.selectedDay || {};
      return getDayLabel(day, month, year);
    }
  },

```
In the case of Vue.js while you define new properties in the `computed: {}` section, this will intercept any change in the variables you are using into the method, in this case, `weekDaySelected` for free.

Memoize values are one of the most important strategies to have in mind for Frontend developers due to modifying DOM being very expensive.

More examples are coming ...
Python Reverse Sluggify
Tags: python
Published: 2022-01-20 22:53:52

---
canonical_url: https://waylonwalker.com/til/python-reverse-sluggify/
published: true
tags:
- python
title: Python Reverse Sluggify
---

In order to make an auto title plugin for markata I needed to come up with a way to reverse the slug of a post to create a title for one that does not explicitly have a title.


> a slug is generally all lowercase and free of spaces, and is a way to make website routes (urls)


Here I have  a `path` available that gives me the articles path, ex.
`python-reverse-sluggify.md`.  An easy way to get rid of the file
extension, is to pass it into pathlib.Path and ask for the stem, which returns `python-reverse-sluggify`.  Then from There I chose to replace
`-` and `_` with a space.

``` python
article["title"] = (
    Path(article["path"]).stem.replace("-", " ").replace("_", " ").title()
)
```



To turn this into a markata plugin I put it into a pre_render hook.

``` python
from pathlib import Path

from markata.hookspec import hook_impl, register_attr


@hook_impl
@register_attr("articles")
def pre_render(markata) -> None:
    for article in markata.filter('title==""'):
        article["title"] = (
            Path(article["path"]).stem.replace("-", " ").replace("_", " ").title()
        )
```
Kafka da Neden Partition Oluştururuz? 💫 🌌 ✨
Tags: kafka, partition, pubsub, apache
Published: 2022-01-20 22:52:47

**Aggrigation yapabiliriz**: Producer'lerin verilerinin belirlenen özelliklerine göre toplanmasıdır.

Daha hızlı okumak (parallelism)
Verileri daha verimli saklamak (efficiency)
Verilerin sıralı bir şekilde toplanması (sorting - event sourcing)

**Round robin:** Gelen mesajları sırasıyla partitionlara bölüştürmek

**Aggregation:** Örneğin key değerini category olarak verirsek mesajlar kategoriye göre gruplandırılıp öyle gönderilir.

**Sorting- event sourcing:** Örneğin customerId'yi key olarak verirsek login, add to cart, purchase (giriş yap, sepete ekle, satın alma) gibi kullanıcıların yaptığı işlemleri arka arkaya sıralar.

Bir partition olsaydı okuma ve yazma performansı çok kötü olurdu yani paralelizm yapamazdık.
 
Bir partition'dan aynı anda aynı kimliğe sahip sadece bir consumer okuyabilir.
Partition kullanarak büyük boyutlu mesajları istediğimiz şekilde yönlendirebiliriz.
Mesela büyük mesajları belli bir partition'a küçük mesajları belli bir partition'a yönlendirebiliriz.

Leader partition : her partitionun replication kopyalarından biri lider olarak atanır bizde bu lider partitiona yazarız. Bu yazdığımız partition da diğer replication kopyalarına bu bilgiyi gönderip senkronize eder.
Eğer bir nedenden dolayı lider olan partition çökerse kafka hemen yeni bir partition'u lider olarak seçer.

**Kafkaya veri yazımı üç safhadan oluşur:**
1. Kafkaya veri göndermek
2. Verinin lider olan partition'a gönderilip saklanması
3. Lider olan partition'un bu veriyi diğer kopya olan partition'lara aktarması

**Producer Acknowledgement:** 

Kafkaya veri gönderdiğimizde bu üç safhanın hangilerinin bitmesini veya tastik etmesi gerektiğini belirleyebiliyoruz buna **acknowledgement** deniliyor.

**Acks=0** (en hızlı ve riskli olan mesaj kaybolma şansı yüksek)
Kafkaya gönder ve cevabı beklemeden devam et
	
**Acks=1** (orta derece hızlı ve güvenli, Mesaj kaybolma şansı çok az)
Kafkaya gönder ve sadece leader yazana kadar bekle

**Acks= all, -1** (en yavaşı ve en güvenlisi , mesaj kaybolma şansı yok)
Kafkaya gönder, leader yazmasını ve leader'in diğer partition'lara yazmasını bekle
Multiple user routing in react as per user type. 
Published: 2022-01-20 22:51:17

Hi i have project in which there are multiple users like admin, teachers, students etc. I am getting token and user type from api. I want to redirect user to their dashboard after login as per their user type every user has their different routes and dashboard how can i make the different routes for different users and redirect to their dashboard so that every user can work with their routes. 
Please help...
Looking for PHP, Laravel, & Vue Engineers - Fully Remote
Tags: laravel, php, vue
Published: 2022-01-20 22:44:45

**Company Name:** GRIN Technologies Inc.

**Location:** 100% Remote - Coorporate Office in Sacramento, CA

**Technologies:** PHP/Laravel/Vue/Symfony

**Position Details:**
We are a Creator Management Software company based in Sacramento, CA but will always have a “remote-first” work policy.
We are currently looking for experienced and professional Software Engineers (frontend and fullstack; mid-senior) to build great, user friendly products for our Creator Management Platform. You’ll be part of a cross-functional team that’s responsible for the full software development life cycle, from conception to deployment. Experience with Laravel/PHP and Vue is needed. Experience with Symfony is also a plus.

**A Few Highlights & Perks!:**
* W2 - Full time - Remote (US Only)
* Annual Employee Career Development Reimbursement offered
* Home Office set up offered
* Employee Stock Option Program and more!

If interested, please email your resume to nyra.johnson@grin.co
Angular 13 + NestJS 8 Starter Project
Published: 2022-01-20 22:36:58

This project is a Angular 13 + NestJS 8 starter to build your new frontend & backend project (by [@wlucha](https://github.com/wlucha))


## Features    
✅ Angular 13+   
✅ NestJS 8+  
✅ Jest Unit Testing  

## GitHub Project
[https://github.com/wlucha/angular-nest](https://github.com/wlucha/angular-nest)

## Demo
- [StackBlitz Demo](https://stackblitz.com/github/wlucha/angular-nest)


## Installation

```bash
# Install dependencies
$ npm install
```

## Running Nest.js

```bash
# development
$ npm run start-nest

# watch mode
$ npm run start-nest:dev

# production mode
$ npm run start-nest:prod
```

## Running Angular

```bash
# development
$ npm run start-angular

# production mode
$ npm run start-angular:prod
```

## Test

```bash
# unit tests
$ npm run test

# e2e tests
$ npm run test:e2e

# test coverage
$ npm run test:cov
```


## License
MIT License

Copyright (c) 2022 Wilfried Lucha
Kafkadan veriler nasıl okunur? 💫 🌌 ✨
Tags: kafka, apache, consumer, zookeeper
Published: 2022-01-20 22:35:51

Hangi ofsetten okunmaya başlanacağı kafka'nın ilk belirlediği şeydir. 
Bu okuyucumuz eğer daha önce okumuş ve okuması yarım kalmışsa  zaten zookeeper içerisinde kaldığı ofset pozisyonu belirlidir. Oradan okumaya devam eder.

Okuyucumuz yeni ise en baştan ofset 0 dan okumaya başlar

```
1. Event oku (ofset 0)
2. İşlemi yap
3. Commit et (ofset 0)
4. Bir sonraki okunacak offset 1 oluyor.
5. Event oku (ofset 1)
6. Commit et (ofset 1)
7. Bir sonraki okunacak offset 2 oluyor.
```


## Kafkadan veri okuma seçenekleri: 


**At most once:** En fazla bir kere

**At least once:** En az bir kere, en çok kullanılan yöntem

**Exactly once:** Tam bir kere ,  performansa büyük etkisi olur


**Consumer groups:** Consumerlar yani okuyucular her zaman bir consumer grup'a bağlıdır.
Böylelikle kafka hangi okuyucu olduğunu bilir ve ofset pozisyonunu ona göre belirler.
Selenium WebDriver Giriş 💫 🌌 ✨
Tags: selenium, webdriver, testing, testdev
Published: 2022-01-20 22:24:15

## Web Driver (Web Sürücüsü)

WebDriver, bir kullanıcının yerel olarak veya Selenium sunucusunu kullanan uzak bir makinede yapacağı gibi bir tarayıcıyı yerel olarak çalıştırır.

• WebDriver, basit ve daha özlü bir programlama arayüzü olarak tasarlanmıştır.

• WebDriver, kompakt bir nesne yönelimli API'dir.

## Başlarken

Selenium, WebDriver'ı kullanarak piyasadaki tüm büyük tarayıcıların otomasyonunu destekler. WebDriver, web tarayıcılarının davranışını kontrol etmek için dilden bağımsız bir ara yüz tanımlayan bir API ve protokoldür. Her tarayıcı, sürücü adı verilen belirli bir WebDriver uygulaması tarafından desteklenir. Sürücü, tarayıcıya yetki vermekten sorumlu bileşendir ve Selenium ile tarayıcı arasındaki iletişimi yönetir.

Selenium kurulumu, diğer ticari araçların kurulumundan oldukça farklıdır. Selenium'u otomasyon projenizde kullanmak için, seçtiğiniz dil için o dilin kitaplıklarını yüklemeniz gerekir. Ek olarak, otomatikleştirmek ve üzerinde test çalıştırmak istediğiniz tarayıcılar için WebDriver ikili dosyalarına ihtiyacınız olacak.

## Selenium kurulumu üç adıma ayrılabilir:

• İstediğiniz programlama dili için Selenium kitaplığını yükleyin
• Tarayıcınızı otomatikleştirmek için tarayıcı sürücüsünü ayarlayın (örn. Firefox için GeckoDriver)
• (İsteğe bağlı) Testlerinizi büyütmek istiyorsanız Selenium Grid'i kurun ve yapılandırın

## Bileşenleri anlama:

WebDriver kullanarak bir test takımı oluşturmak, bir dizi farklı bileşeni anlamanızı ve etkili bir şekilde kullanmanızı gerektirir. Yazılımdaki her şeyde olduğu gibi, farklı insanlar aynı fikir için farklı terimler kullanır. Aşağıda, bu açıklamada terimlerin nasıl kullanıldığının bir dökümü bulunmaktadır.

## terminoloji:

•API: Uygulama Programlama Arayüzü. Bu, WebDriver'ı değiştirmek için kullandığınız "komutlar" kümesidir.

•Library (Kütüphane): API'leri ve bunları uygulamak için gerekli kodu içeren bir kod modülü.
Kitaplıklar her dile özeldir, örneğin Java için .jar dosyaları, .NET için .dll dosyaları vb.

•Driver (Sürücü): Gerçek tarayıcının kontrolünden sorumludur. Sürücüler genellikle, test paketini yürüten sistemde değil, tarayıcının kendisiyle birlikte sistemde çalışan yürütülebilir modüllerdir. (Bunlar aynı sistem olabilir.) NOT: Bazı kişiler sürücülerden proxy olarak bahseder.

•Framework (Çerçeve): WebDriver paketleri için destek olarak kullanılan ek bir kitaplık. Bu çerçeveler, JUnit veya NUnit gibi test çerçeveleri olabilir. Cucumber veya Robotium gibi doğal dil özelliklerini destekleyen çerçeveler de olabilirler. Çerçeveler ayrıca test edilen sistemi manipüle etme veya yapılandırma, veri oluşturma, test kahinleri vb. gibi şeyler için de yazılabilir ve kullanılabilir.

WebDriver bir sürücü aracılığıyla bir tarayıcıyla konuşur. İletişim iki yönlüdür: WebDriver, komutları sürücü aracılığıyla tarayıcıya iletir ve bilgileri aynı yoldan geri alır.
Day 513 : Hard Work
Tags: hiphop, code, coding, lifelongdev
Published: 2022-01-20 22:18:41

_liner notes_:
- Professional : So many meetings today! haha I think I rather have one day full of meetings and nothing for the rest of the week. That way I can focus to get some coding done. Speaking of coding, between and after meetings, I was able to knock out another component for this demo application we are building. It's rough, but will do for now. Got a demo in the afternoon tomorrow of what we've been working on, so I'll be moving some elements around on the page before we present.

- Personal : Worked on my side project. Getting closer to finishing up the audio chat on the dashboard side. Got it to where I can get the credentials needed to join the chat. Next thing is to get joining the chat working and then broadcasting it. I also went through some tracks for the radio show.

![A forest in Harz, Germany with moss on the ground and sunlight shining through the trees from a setting sun](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yz5qxgl0jddkbyuhgrg6.jpg)

Going to see if I can get joining the audio chat and broadcasting working from the dashboard. Once I get that working, going to go through more tracks for the radio show. Going to eat some dinner and get started and put in the hard work.

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube bgA1ac-Z5HY %}
Detangling Ansible, loop and json_query

Tags: ansible, jsonquery, jmespath, automation
Published: 2022-01-20 22:11:35

Ansible comes pretty handy when aiming to automate your infrastructure.
However, in my experience over 2+ years, combining Ansible with loops can easily reach brain-wracking complexity.

Following from my playbook demonstrates how [json_query](https://docs.ansible.com/ansible/latest/user_guide/playbooks_filters.html#selecting-json-data-json-queries) is essential to navigate a JSON jungle.
Of course, there can be other approaches but, json_query simplifies it best in my opinion.

The task at hand:
1. [register](https://docs.ansible.com/ansible/latest/user_guide/playbooks_variables.html#registering-variables) the output of a [loop](https://docs.ansible.com/ansible/latest/user_guide/playbooks_loops.html)ed module to a variable.
2. check the 'results' in the output for 'failed' or 'changed' booleans to decide actions in the next module.

Sounds simple right? Not quite ..

Trial #1:
```
  - name: PUT files in bucket
    amazon.aws.aws_s3:
      bucket: "{{ arch_bucket }}"
      object: "{{ item.path|basename }}"
      src: "{{ item.path }}"
      mode: put
      aws_ca_bundle: "/path/to/bundle.pem"
      aws_access_key: "{{ bucket_access_key }}"
      aws_secret_key: "{{ bucket_secret_key }}"
      s3_url: "{{ cloud_url }}"
      validate_certs: yes
    loop: "{{ files_to_archive }}"
    register: archive_files_op

  - name: Delete files successfully archived
    file:
      path: "{{ item.path }}"
      state: absent
    loop: "{{ archive_files_op | json_query(del_query) }}"
    vars:
        del_query: "results[?changed == 'True' && failed == 'False'].item"
```
For some reason, the json_query doesn't like using standard comparison operators for the booleans and an error is reported:
```
fatal: [target.node.com]: FAILED! => {"msg": "template error while templating string: expected token ',', got 'True'. String: {{ archive_files_op | json_query('results[?changed=='True' && failed=='False'].item.path') }}"}
```
After hours of trying, this is what worked to my satisfaction:
```
  - name: PUT files in bucket
    amazon.aws.aws_s3:
    ..<snip-snip>..
    loop: "{{ files_to_archive }}"
    register: archive_files_op

  - name: Delete files successfully archived
    file:
      path: "{{ item.path }}"
      state: absent
    loop: "{{ archive_files_op | json_query(del_query) }}"
    vars:
      del_query: "results[?!failed && changed].item"
```
_Happy automating!_
Bounded Square Sums
Tags: java, 100daysofcode, algorithms, programming
Published: 2022-01-20 20:14:49

# Description

You are given two lists of integers `a` and `b` as well as integers `lower` and `upper`. Return the number of pairs `(i, j)` such that `lower ≤ a[i] * a[i] + b[j] * b[j] ≤ upper`.

**Constraints:** 

- `0 ≤ n ≤ 100,000` where `n` is the length of `a`
- `0 ≤ m ≤ 100,000` where `m` is the length of `b`

## Example 1

### Input

```
a = [3, -1, 9]
b = [100, 5, -2]
lower = 7
upper = 99
```

### Output

```
4
```

### **Explanation**

```
We have the following pairs:

3 * 3 + 5 * 5 = 34
3 * 3 + -2 * -2 = 13
-1 * -1 + 5 * 5 = 26
9 * 9 + -2 * -2 = 85
```

---

# Intuition

`lower ≤ x ≤ upper` → `x ≤ upper - x≤ lower - 1`

Algorithm Templates Binary Search, find target left

# Implementation

```java
import java.util.*;

class Solution {
    public int solve(int[] a, int[] b, int lower, int upper) {
        for (int i = 0; i < a.length; i++) {
            a[i] *= a[i];
        }
        for (int i = 0; i < b.length; i++) {
            b[i] *= b[i];
        }

        Arrays.sort(a);
        Arrays.sort(b);

        return helper(a, b, upper) - helper(a, b, lower - 1);
    }

    private int helper(int[] a, int[] b, int target) {
        int count = 0;
        for (int i = 0; i < a.length; i++) {
            int l = -1, r = b.length - 1;
            while (l < r) {
                int mid = l + r + 1 >> 1;
                if (a[i] + b[mid] <= target) {
                    l = mid;
                } else {
                    r = mid - 1;
                }
            }
            count += l + 1;
        }

        return count;
    }
}
```

## Time Complexity

- Time: O(nlogn)
- Space: O(1)
ASP.NET Core - IIS Set environment in web.config
Tags: csharp, programming, iis, coding
Published: 2022-01-20 21:37:44

---
title: ASP.NET Core - IIS Set environment in web.config
published: true
description: Set environment of the app in the web.config
tags: CSharp,programming,iis,coding
//cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/r28a0ri3cv6wtis10gc8.jpg
---

In order to set a Environment variable for the IIS hosted app via web.config we need to add `<EnvironmentVariables>` element inside the `<aspNetCore>` element.

```XML
<environmentVariables>
    <environmentVariable name="ASPNETCORE_ENVIRONMENT" value="Development" />
</environmentVariables>
```

Example of your config should look like this:
```XML
 <aspNetCore processPath="dotnet" arguments=".\YourApp.dll" 
                        stdoutLogEnabled="false" 
                        stdoutLogFile=".\logs\stdout" 
                        hostingModel="inprocess">
	<environmentVariables>
	    <environmentVariable name="ASPNETCORE_ENVIRONMENT" value="Development" />
	</environmentVariables>

</aspNetCore>
```
Look what Ive found.....
Published: 2022-01-20 21:26:07

.... by just browsing the code:


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x8cbiptbuu5i9z2e98fa.png)

Meanwhile:

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/skcfq59kcnwvjfuablcn.png)

======

Another interesting thing is..... what more to say, just see for yourself: [this answer by Ben](https://forem.dev/ben/comment/4e1)

and now, compare the above with 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v1gtg1ruyc97xmjiymtz.png)

@ben @nicktaylor ?
Clone google homepage with next.js
Tags: nextjs, react, javascript
Published: 2022-01-20 21:10:52

Simple project where I cloned google using the next.js framework, besides being able to see it in my github repository, you can see the deployment of this application on the Vercel platform.
 Following the links listed below:

Github - https://github.com/dedaldinodov4/google-clone-nextjs
Application Deployment - https://google-clone-nextjs-delta.vercel.app/

Screenshot

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w74dw4mwlfm8oqwga5qr.png)
Fundamentos de TypeScript 🦆| #10: Funciones
Tags: typescript, spanish, beginners, webdev
Published: 2022-01-20 21:08:53

Si bien ya vimos ejemplos de muchas funciones en post pasados, no está mal dedicarle una entrada solo a las funciones.

## **Declaración de funciones**
Para declarar funciones se deben tener en cuenta 2 cosas importantes para sacar el jugo a typescript:

1. Poner explícitamente el **tipo de dato a los parámetros** de una función.

2. Tener en cuenta que **las funciones también tienen un tipo de retorno**, acá encontré opiniones divididas, algunos devs sugieren que el compilador de typescript **infiera** el tipo de retorno de la función, en cambio otros proponen que debe ser el desarrollador quien escriba explícitamente dicho tipo de retorno. Personalmente, a mi me gusta optar por escribir explícitamente el tipo de retorno, así queda claro a simple vista que es lo que esa función debe regresar.

## **Funciones clásicas vs Funciones de flecha**

Por ejemplo, en JavaScript, una función para obtener la potencia de un número se veria asi:

```ts
function potencia(base, exponente){
  return base ** exponente
}

console.log(potencia(5,2)) //25
```

Para convertir esta función a sintaxis TypeScript tendríamos que añadirle el tipo de dato a los parámetros y el tipo de retorno a la función per se, así:

```ts
function potencia(base:number, exponente:number):number{
  return base ** exponente
}

console.log(potencia(5,2)) //25
```

> *Recuerda que al no poner el tipo de retorno de la función, TypeScript inferirá dicho tipo de retorno, en este caso `number`.*

Ahora, escribamos la función en sintaxis *arrow*:

```ts
const potencia = (base:number, exponente:number):number => base ** exponente;
console.log(potencia(2,8)) //256
```
Podemos tener la misma función pero en una sola línea.

> *Las ventajas de usar funciones clásicas o funciones flechas escapa de los conceptos de TypeScript, JavaScript explica sobre todo el contexto `this` de ambas formas de usar funciones.*

## **`void` para funciones**
El tipo de dato `void` puede ser usado en una función cuando sabemos de antemano que esta no devolverá nada, por ejemplo:

```ts
const saludo = (nombre:string):void => console.log(`Hola ${nombre}`)
console.log(saludo("Cris")) // Hola Cris
```
El cuerpo de la función no tiene una sentencia `return` por ende no regresa nada, en este caso es muy aconsejable usar `void` como tipo de regreso.

## **Conclusiones**
- Las funciones en TypeScript necesitan declarar el tipo de sus datos y el tipo de retorno.
- Pueden ser funciones clásicas usando la palabra reservada `function` o funciones flecha.
- `void` es útil para funciones que no regresan nada.


## **Referencias**
{% youtube BwuLxPH8IDs %}
Paracetamol.js💊| #21: ¿Qué imprime este código JavaScript?
Tags: javascript, webdev, spanish, beginners
Published: 2022-01-20 21:04:37

## **¿Qué imprime este código JavaScript?**

```js
const numbers = [1, 2, 3];
numbers[10] = 11;
console.log(numbers);
```

-     A: `[1, 2, 3, 7 x null, 11]`
-     B: `[1, 2, 3, 11]`
-     C: `[1, 2, 3, 7 x empty, 11]`
-     D: `SyntaxError`

Respuesta en el primer comentario.

---
Paracetamol.js💊| #20: ¿Qué imprime este código JavaScript?
Tags: javascript, webdev, spanish, beginners
Published: 2022-01-20 21:04:03

## **¿Qué imprime este código JavaScript?**

```js
console.log(typeof typeof 1);
```

-     A: `"number"`
-     B: `"string"`
-     C: `"object"`
-     D: `"undefined"`

Respuesta en el primer comnetario.

---