teleren/devto huggingface dataset:
Day 689 : Harriet Tubman
Tags: hiphop, code, coding, lifelongdev
Published: 2023-02-06 22:11:38

_liner notes_:
- Saturday : Went into the station this week even though there was a game so that I could go to an event in town. I was messing up on the show. I felt off. I forgot Harriet Tubman's name! haha Had a good time at the event though. The recording of this week's show is at https://kNOwBETTERHIPHOP.com

![Radio show episode image of 2 people a female police officer and a male standing in front of a police SUV wrapped in a design to celebrate Black History Month parked in front of the City of Miami (Historic Negro) Black Police Precinct and Courthouse with the words Feb 4th 2023 Sadder Days](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8o0b6tiegvhcptuijk48.jpg)

- Sunday : Did the study sessions over at https://untilit.works . Spoke with customer service about getting my Chromebook fixed. Filled out some forms and supposed to get the info I needed emailed to me. Did a little coding. Went through the projects on my computer and made sure it was backed up on GitHub. Got caught up talking with someone online thinking about learning data science and then went to bed.

- Professional : Pretty good way to start the week off. Got some feedback from my team on a talk abstract that I wrote. Double checked my updates that I did to a repo last week. Did some more updates and tested it again. Started looking at another repo to update.

- Personal : So I ran into this blocker on the project I'm working on. I need to pass info from one component to another. I'm thinking I may need to use stores, at least that's how I do it in Svelte, but I'm using Astro now. I can use Svelte in Astro, but I want to see how far I can push Astro. They have their own stores solution as well. Maybe that'll help solve my issue. Going to do more research.

![New Orleans Bayou, LA, USA wetlands with mangrove trees in the water](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/poskafiuzntymoro61jw.jpg)

Got the email from my Chromebook's manufacturer and bought a box to ship it in. Going to print out the form and pack up my laptop. I'm thinking, I may wait till later in the week to send in my laptop, because I can still use it. Going to see if I can get the stores working in my side project. I may go through tracks for the radio show. Eat dinner. Watch a couple of anime episodes. Go to bed.

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube PhRRvelKyfA %}
v-show vs v-if: Conditional Rendering in Vue
Tags: vue, webdev, javascript, typescript
Published: 2023-02-06 22:01:54

`v-if` and `v-show` are two ways to conditionally render content in Vue. Both are built to conditionally render content in Vue, but in slightly different ways - which can be quite confusing. Let's take a look at how they work, and when you would use each.

## v-if vs v-show
`v-if` in conditional rendering is the one you will want to use **most** of the time. That's because the way `v-if` works is to completely eliminate the DOM elements if the condition within it returns `false`. For example, below we'll try to render an `<h1>` tag, but only if `msg` is equal to `5`. In the below example, `msg` isn't equal to `5`, so the `<h1>` will never be rendered:

```html
<script setup>
const msg = 6
</script>

<template>
	<h1 v-if="msg === 5">Hello World!</h1>
</template>
```

If we made `msg` reactive, and updated it, we could conditionally render the content based on a button press, like in this code:
```html
<script setup>
  import { reactive } from 'vue'
	const msg = reactive({ setting: true })
  function updateMessage() {
    if(msg.setting) msg.setting = false
    else msg.setting = true
  }
</script>

<template>
	<h1 v-if="msg.setting === true">Hello World!</h1>
  <button @click="updateMessage">
    Update Message
  </button>
</template>
```

This is fine for most cases. Loading one less DOM element is usually a better idea, and can help with some styling issues you may run into. If you try to look at your code in `Inspect Element`, you'll see that the `<h1>` tag we tried to render won't exist if `v-if` is returning `false`. Pretty cool, right?

However, there are some situations where you'll want the DOM element to be rendered, though, even if `v-if` returns `false`. For example, you may want to apply some Javascript to your DOM element, even if it is supposed to be hidden. For that, you can use `v-show`:

```html
<script setup>
const msg = 6
</script>

<template>
	<h1 v-show="msg === 5">Hello World!</h1>
</template>
```

The difference between `v-show` and `v-if` is that `v-show` does not eliminate the DOM element. If the expression in `v-show` returns `false`, the element will still be rendered and exist in the document, but it will have `display: none` applied to it in CSS.

### Other differences between v-if and v-show

There are two other key differences between `v-if` and `v-show`:
- `v-if` can be used on `<template>` elements, but `v-show` cannot.
- `v-if` also supports `v-else` and `v-else-if` clauses, whereas `v-show` does not. [Learn more about this here](https://fjolt.com/article/vue-using-v-if-and-v-else)


## Conclusion
`v-if` and `v-show` both have their uses. While `v-if` will stop something being rendered if the expression within it returns `false`, `v-show` will still render the element - but it will apply `display: none` to the element.

[To learn more about Vue, you can check out my other articles here](https://fjolt.com/category/vue).
Raspbian iwconifg produces the following fancy output
Published: 2023-02-06 21:49:48

On my Raspberry Pi 3 running Raspbian iwconifg produces the following fancy output:

`wlan0     IEEE 802.11bgn  ESSID:"ssid of my network"  
          Mode:Managed  Frequency:2.452 GHz  Access Point:*************   
          Bit Rate=72 Mb/s   Tx-Power=1484 dBm   
          Retry short limit:7   RTS thr:off   Fragment thr:off
          Power Management:on
          Link Quality=36/76  Signal level=-73 dBm  
          Rx invalid nwid:0  Rx invalid crypt:0  Rx invalid frag:0
          Tx excessive retries:0  Invalid misc:0   Missed beacon:0

lo        no wireless extensions.

eth0      no wireless extensions`

According to the definition of dBm (see https://en.wikipedia.org/wiki/DBm) such a high tx power is not possible due to energy conservation :-).

well I have the following questions:
-  how to do a setup?
- i need to set the tx-powerm right?
-  What do I have to do, to see the right tx-power?
Java Efetivo Essencial - Método Padrão
Tags: java, programming
Published: 2023-02-06 21:45:19

## Proteja as interfaces para a posteridade

_Esta é uma série baseada no entendimento de tópicos relacionados ao livro com foco no resumo.
_

**Interfaces**

Já sabemos que antes do Java 8 não era possível adicionar métodos sem gerra um quebra nas interfaces, ou seja, fazer com que todas as classes que implementasse a interfasse tivessem que implementar o novo método.
Com o Java 8 surgiram os métodos padrões, que permitem que adicionemos um método com implementação na interface, ou seja, nesse caso as classes que implementam a interface herdam o método padrão.
Porém é necessário que ter em mente que alterações em interfaces pode ser arriscado.

**Atenção**

Mesmo sendo possível adicionar o método padrão e ele ser utilizado por todas classes que implementam a interface não é possível ter controle de que a execução do método novo será com sucesso em todas as implementações.
O livro usa bastante exemplos da própria base de código do Java e então o exemplo citado sobre esse ponto é da interface de Collections, que teve métodos padrão implementados para que as lambdas fossem implementadas em todas as implementações de coleções.

**Problemas**

Um dos métodos implementados em Collections é o removeIf que não tem um efeito possitivo em todas implementações, como citado no livro algumas classes wraper por exemplo como a SynchronizedCollection da biblioteca Apache Commons acabam não executando bem esse método( pelo menos até a data de escrita do livro), isso porque quando um método padrão novo é implementado pode não conseguir atender todas as possibilidades de implementação. Então ao adicionarmos um método padrão precisamos ter em mente isso. 

**Então**

Então devemos ficar atentos na execução do método nas implementações da interface.
E isso porque pode parece um recurso fácil de utilizar, mas ainda temos que garantir estabilidade na escrita de uma interface. Sempre se questione quando uma interface mudar muito, isso pode ser um problema no design da aplicação.
Tenha cautela ao projetar intefaces.

**Resumo do Resumo**

Métodos padrão são bons, mas devem ser utilizados em exceções em especial quando se tem noção das implementações da interface de modo que consiga projetá-lo bem.
Teste bem suas interfaces, implementando clientes das interfaces de forma totalmente diferente. 
Corrigir erros depois de implementados em interfaces acaba sendo um trabaho mais difícil.
Django 101: Creando un proyecto fàcil.
Tags: python, programming, framework
Published: 2023-02-06 21:34:02

El lenguaje de programación es multipropósito, por los cuales uno es el desarrollo en web, por lo tanto comenzaremos con lo basico.

## Contenido

- Que es framework django
- creacion de un projecto django
- reacion de una app django
- ejecucion el proyecto
- creacion de usuario
- creacion de modelos 
- migrate y makemigrations
- ingresando datos para el modelo 


Iniciaremos creando un entorno 
Crear un directorio para el proyecto 'django101'. dentro escribir el siguiente comando

```
python -m venv .venv
```

Habilitar el entorno creado.

```
.venv\Scripts\activate
```

- Instalacion del framework django

```
pip install Django==4.1.6
```

- creando un proyecto 
```
django-admin startproject project101 .
# viendo el directorio
.venv
project101
manage.py
```
 - Ejecutamos el servidor del proyecto

```
python manage.py runserver
```


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

- ejecutar el migrate

```
python manage.py migrate
```

- crear el superusuario

```
python manage.py createsuperuser
```

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

- Ejecutar el servidor e ir a `http://127.0.0.1:8000/admin`.


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


#### Creando una app

- ingresar el siguiente comando

```
python manage.py startapp book
```

- agregar en `project101\settings.py` el nombre de la aplicacion


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

- agregar un modelo en `book\model.py`, agregaremos con campos basicos.


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

- realizar el makemigrations, a la aplicacion `python manage.py mikemigrations book`.


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

- En la carpeta de la aplicacion `book`, agregar en `book\admin.py`, para el registro del modelo y visualizarlo en la web.


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


- antes de iniciar el servidor realizar el `python manage.py migrate book`. despues ejecutar el comando `python manage.py runserver`.

- visualizara de la siguiente forma.

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

- Agrege algunos datos


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

En resumen, este es un comienzo para crear proyectos en el framework de django.
Gracias por leer.
Free Corda Next-Gen Bootcamp
Tags: corda, dlt, blockchain
Published: 2023-02-06 20:39:16

Join us for our next session to learn more about [Next-Gen Corda](https://developer.r3.com/videos/corda-5-coding-differences-comparison-with-corda-4/). We will cover how to write a Hello World CorDapp with the CSDE (CorDapp Standard Development Environment) running on our Next-Gen Corda platform.
This session will also cover the changes in Corda services in Next-Gen Corda.
**[REGISTER NOW](https://developer.r3.com/events/)**
📊 DOMAINE.nc on Neo4J AuraDB Neodash gallery 🎨
Tags: datascience, datavis, neo4j, cloud
Published: 2023-02-06 20:30:44

## ❔ About

We have release an API for [`DOMAINE.nc`](https://www.domaine.nc/) so we get a nice [`whois`](https://www.domaine.nc/whos) for New-Caledonia.

This also makes it possible to make a full `csv` extract... and then to load it into Neo4J (see [ready-tu-use Neo4J dumps](https://github.com/opt-nc/domaine-nc-jupyter-notebook/tree/main/dump)).

See following repo for more:

{% github https://github.com/opt-nc/domaine-nc-jupyter-notebook %}

## 💡 Inception

While chating with [Niels de Jong](https://www.linkedin.com/in/nielsdjong/) about [`neodash`](https://neo4j.com/labs/neodash/), Niels offered me to develop and publish a deshboard on [NeoDash Dashboard Gallery 🎨](https://neodash-gallery.graphapp.io/).

Finally, a dump could be imported in [Neo4j AuraDB](https://neo4j.com/cloud/platform/aura-graph-database/)

## 🍿 What you'll discover

Below you'll discover how it is now possible to interact (and even customize a lowcode [dashboard and stunning (and ever growing) visualizations ](https://neo4j.com/labs/neodash/2.1/developer-guide/component-overview/) on DOMAINE.nc datas)

[![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jduofro821ht7oa20mf3.png)
](https://neodash-gallery.graphapp.io/)

## 📑 Neodash resources & News

- [🗞️ NeoDash 2.0 – A Brand New Way to Visualize Neo4j](https://neo4j.com/developer-blog/neodash-2-0-a-brand-new-way-to-visualize-neo4j/)
- [🎨 NeoDash Dashboard Gallery](https://neodash-gallery.graphapp.io/)
- [📝 Week 35 :  Discover AuraDB Free  – NODES 2022 Sessions](https://neo4j.com/developer-blog/week-35-discover-auradb-free-nodes-2022-sessions/)
- [🤓 Neodash on GitHub](https://github.com/neo4j-labs/neodash)

## 🍿 Show time

{% youtube Exr_csN1Epc %}
How You Can Two a Brokendown Car?
Published: 2023-02-06 20:28:09

You can't be a safe driver without reading these [car-towing tips](https://aqtiverecovery.co.uk/car-breakdown-recovery/).
You should know how to tow a car safely and lawfully in case you ever need a tow or come to the aid of someone whose car has broken down and you need to tow it.

The following are rules that both drivers and passengers on the towed vehicle must keep in mind:

The car being towed must have a 'On Tow' sign in the rear view mirror.
The maximum allowed distance between vehicles is 4.5 metres when they are attached solely by a rope or chain.
Whenever there is more than 1.5 metres separating the vehicles, the rope or chain must be made visible to drivers approaching from either side by means such as tying a fluttering piece of coloured cloth in the middle.
If you come across a stalled car, you must ensure that the person inside is a licenced motorist.
The [vehicle](https://aqtiverecovery.co.uk/)'s lights must be on if it's nighttime and the car is broken down.
React.js several impotant concepts
Tags: react, concepts, javascript, webdev
Published: 2023-02-06 20:17:37

## React is a JavaScript library for building user interfaces.

## React.js has several impotant concepts that make it a powerful tool for developing web applications.

### Some of impotant concepts include:

👇️


1. **Virtual DOM**: React uses a virtual DOM to update the actual DOM, which makes updates to the user interface more efficient and fast.

2. **JSX**: React uses JSX, a syntax for JavaScript, to define UI components. JSX allows developers to write HTML-like code within JavaScript, making it easier to build and maintain complex user interfaces.

3. **Components**: React is built around components, which are small, reusable UI elements. Components can receive data as props and manage their own state.

4. **React Hooks**: React Hooks are a new feature in React that allow developers to add to functional components. Example:
> states `useState()`,
> Side effects `useEffects()`,
> referrence of element `useRef()`,
> etc.


5. **Context API**: React's Context API provides a way to share data and logic between components without passing props down manually through the component tree. We don't need to props drilling. Example:
> `createContext()` -> Create the context
> `Context.Provider` -> Context provider
> `useContext()` -> Use the context

6. **Server-Side Rendering**: React can be rendered on the server (SSR) to improve the initial load performance of web applications.

7. **Higher-Order Components**: React allows developers to create Higher-Order Components (HOC), which are components that wrap other components and add additional functionality.

---

#### 👉️ These are some of the concepts that make React a 
popular and powerful tool for building user interfaces. Understanding these concepts is essential for developing complex and efficient web applications with React.

Please let me know, where is my mistakes.

---

🌎 Let's Connect!

[Telegram](https://t.me/mdsifath70)
[Linkedin](https://linkedin.com/in/mdsifath70)
[WhatsApp](https://api.whatsapp.com/message/54YMTRFGZIXTG1?autoload=1&app_absent=0)
[Twitter](https://twitter.com/mdsifath70)
Visualizing music with just a few lines of code
Tags: python, datascience, music
Published: 2023-02-06 20:00:00

Hey, I'm back! Let's see how far I can get with music and data science. Since I know my way around Django, I'm a little confident that I can build something with these two altogether. I'm still using librosa here, pandas, matplotlib and numpy.

You can check out the [google colab notebook](https://colab.research.google.com/drive/1Kg680zL78TAPIX1mnDfJ1vyPZeE9PU7Y?usp=sharing) if you wish to.

### Let's install and import the dependencies:
```python
pip install librosa matplotlib pandas

import matplotlib.pyplot as plt
import librosa
from librosa import display, load, amplitude_to_db, stft
import numpy as np
import pandas as pd
```

We import a couple of librosa's functions for using on our data as well as numpy, pandas and matplotlib.

### Load the data and plot the waveform
```python
y, sr = load('We Are Monsters.wav')
pd.Series(y).plot(figsize=(10, 5), lw=1, title="We Are Monsters") 
```

We load the waveform and sample rate using the `y` and `sr` variable respectively and plot the data as shown in the figure below: 

`<matplotlib.axes._subplots.AxesSubplot at 0x7f885cf29100>`

![Audio waveform of We Are Monsters by the band Dirtslub](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3nuudlnj0u8y3qx5y0jy.png)

### We now create a spectrogram from our data

```python
D = stft(y)
sound_db = amplitude_to_db(np.abs(D), ref=np.max)
sound_db.shape # check the number of rows and columns in the dataset
fig, ax = plt.subplots(figsize=(10, 5))
img = display.specshow(sound_db, x_axis='time', y_axis='log', ax=ax)
```
`(1025, 11179)`

We transform the waveform(y) and get the absolute frequency of the data to produce a spectrogram and plot the data as shown in the figure below:

![Spectrogram waveform of We Are Monsters by the band Dirtslub](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s2u4symu363kdolyctqo.png)


### Lastly we create a melspectrogram

```python
S = librosa.feature.melspectrogram(y=y, sr=sr, n_mels=128)
s_db_mel = amplitude_to_db(S, ref=np.max)
fig, ax = plt.subplots(figsize=(10, 5))
img = display.specshow(s_db_mel, x_axis='time', y_axis='log', ax=ax)
```

Now we transform the data using the melspectrogram feature of librosa and adding 128 `n_mels` then plot the data again as shown in the image below:

![Melspectrogram waveform of We Are Monsters by the band Dirtslub](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5mjxx33xcj4lwt1se8a3.png)

## Conclusion
This is the continuation of my learning of python and music from day 1, which is yesterday. I may have missed some explanation on code snippets above. I would love to hear how you explain them.
About "SyntaxError: Unexpected end of JSON input" in JavaScript
Tags: javascript, webdev, beginners
Published: 2023-02-06 19:56:33

> ✋ **Update:** This post was originally published on my blog [decodingweb.dev](https://www.decodingweb.dev), where you can read the [latest version](https://www.decodingweb.dev/syntaxerror-unexpected-end-of-json-input-in-javascript) for a 💯 user experience. _~reza_

You might have encountered the error “Uncaught SyntaxError: Unexpected end of JSON input” when using `JSON.parse()`.

The error looks like this on the browser console (Google Chrome):

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

First of all, it’s not your code! What’s most likely wrong is the [JSON string](https://www.decodingweb.dev/front-end-skills-to-get-you-started#data-interchange-formats) you’re trying to parse.

When “Unexpected end of JSON input” is raised, your code is probably parsing:

1. <u>An empty string</u>
2. <u>An empty array</u>
3. <u>Or an incomplete (a.k.a malformed) JSON data</u>

That said, the first thing to examine is the JSON data.

If you’re using Google Chrome (like me), you can click the link on the right-hand side of the error message. 

It’s usually in the form of **`VM: Script ID`**, e.g., `VM:1`

If the log is empty, you’re probably dealing with an empty string! Otherwise, you’ll see the JSON data with an indicator.

## How to fix the Uncaught SyntaxError: Unexpected end of JSON input

When working with JSON-formatted data in JavaScript, we’re either working with locally defined JSON data or fetching it from an API.

But how can we resolve the issue?

**When working with locally defined JSON data:** If you’re parsing local JSON content, the first thing to do is to ensure the variable isn’t empty. Maybe the variable is truncated for some reason.

If it’s not, you can validate your JSON-formatted data with an online JSON validator like [JSONLint](https://jsonlint.com/). If you have an invalid JSON object, you’ll find out here!

**When working with a third-party JSON API:** If you’re trying to parse a JSON API response, and you don’t have control over the back-end code, you can place your `JSON.parse` reference into a `try/catch` block – like so:

```js
try {
  const data = JSON.parse(jsonData);
  // Do something with the JSON data
} catch (err) {
  console.error(err);
}
```

## Wrapping up

The infamous "JSON input error" is a Syntax error usually raised when parsing empty or malformed JSON data. Fixing this issue is easy when dealing with locally-defined JSON data. 

If you don't have control over the back-end code generating the JSON data, a `try/catch` block would help you avoid the "Uncaught SyntaxError" error.

Additionally, you might find this [Mozilla guide on `JSON.parse`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse) to avoid other types of parse errors.

I hope this quick guide provided the answer you were looking for.

Thanks for reading.
Share your social accounts server-less-ly :)
Published: 2023-02-06 19:42:51

Hi,
I hope you all doing well :)

Few months ago, I developed a webapp that acts something like Linktree, but guess what ? it runs solely on your browser! isn't this a good idea :D QR codes have been there for years now, so why not take the advantage !

So I let it there, and JS code was scumbled and bugous, then few days ago I reworked the tiny app to be enjoyable for developers as well, making code modular and adding Parcel in the build process; So any contribution is welcome! 

I have some open issues if you like, thanks in advance :)

website: https://mylinks.space
repository: https://github.com/bacloud23/mylinks

Thanks !

Enjoy.