teleren/devto huggingface dataset:
Explain it to your rubber duck
Tags: beginners, webdev, codenewbie, writing
Published: 2022-08-30 16:00:55

I do not have a rubber duck, but a rubber sumo. He always listens to me calmly whenever I am trying to figure something out and let's me squeeze his fluffiness between my hands when I get on my nerves.

![Fluffy sumo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/errd8fh71vpnontxwmsp.PNG)

My rubber sumo is primarily my debugging tool and so is [my blog](https://www.cristina-padilla.com/blog.html). When I started to learn about coding, I read that many developers recommend writing a blog as a way to explain and understand concepts. And I couldn't agree more!

Why do I encourage you to start a blog?

**Train your brain and improve your skills**

By collecting your notes and thoughts, you will realize the lack in your knowledge. Review, summarize, explore and research what you don't understand yet. This process will stick all concepts in your brain.

![Groth quote](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xmzr32l0k1pwctjjmz7r.png)

**Become a teacher**

When you have learnt something and share it, you will be helping someone out there for sure. There are great coding communities, where you can contribute. It doesn't really matter if there are already hundreds of posts about the same topic. Anyone has a unique perspective and way of explaining things, which might be clearer or easier to understand for some people. It is a win-win process (you learn from others, you improve your skills and you also give something back to the community).


![Sharing is caring quote](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ezabdpsweqqh8975ogz4.png)

**Show your knowledge & expertise and… get hired!**

You will not only be showing that you are interested and passionate about coding, but also that you have quite some knowledge and good communication skills. Furthermore, you could become an expert in a specific topic, could benefit when changing jobs or grow your career.


![Inspiration quote](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o33n97zah2dbaacu6u5l.png)

How to get ideas to start your blog? 🚀

- Make a list of the concepts you are learning. You will always find a topic that you can go deeper into.
- Read coding books.
- Check coding communities like [hashnode](https://hashnode.com/), [DEV](https://dev.to/), [codenewbie](https://community.codenewbie.org/) or [medium](https://medium.com/). These are also free blogging platforms where you could start writing.
- Let yourself inspire by other devs in Twitter or Linkedin.
- Listen to [podcasts](https://www.freecodecamp.org/news/the-best-podcasts-for-new-coders-and-the-best-tools-for-listening-to-them-df393b1c8dc/).
- Build projects and share your learnings.

Are you ready?
Congratulations to the winners of the Luos use case contest!
Tags: opensource, microservices, usecases, luos
Published: 2022-08-30 15:43:40

🎉 Nimbl'bot, Pollen Robotics and Boxco: they all won respectively the contest organized for creating and sending their use case using Luos technology.

👏 Luos allows them to go further and develop their inspiring projects more easily, so congratulations to them!

🤩 They win a $250 Amazon gift card and 3 months of dedicated support from Luos engineers to help them with their projects.

😏 You too, start and send us your projects, you could be the next one!
Концепции APTOS | Управление
Tags: blockchain, aptos, webdev, tutorial
Published: 2022-08-30 15:37:41

Управление Aptos on-chain - это процесс, с помощью которого члены сообщества Aptos могут создавать и голосовать за предложения, минимизирующие затраты на обновление блокчейна. Ниже описывается сфера действия этих предложений для управления Aptos on-chain:

- Изменения параметров блокчейна, например, продолжительности эпохи, минимально необходимого и максимально допустимого количества валидаторов.
- Изменения основного кода блокчейна.
- Обновление модулей Aptos Framework для исправления ошибок, добавления или расширения функциональности блокчейна Aptos.
- Развертывание новых модулей фреймворка (по адресу 0x1).

## Как предложение становится готовым к разрешению

Ниже приводится краткое описание того, как возникает предложение и когда оно становится готовым к разрешению:

- Сообщество Aptos может предлагать предложения по улучшению Aptos (AIP) на форумах сообщества, каналах и обсуждать их вне сети.
- Когда AIP вне сети приобретает достаточную важность, тогда для него может быть создано предложение на сети через модуль `AptosGovernance`.
- Затем избиратели могут голосовать по этому предложению на сети через модуль `AptosGovernance`. По окончании периода голосования предложение может быть разрешено.
- Предложение содержит порог досрочного истечения срока действия, который установлен на уровне 50% от общего количества монет Aptos Coins. Это позволяет провести экстренное исправление ошибок, не дожидаясь полного периода голосования, при условии, что голоса 50% от общего предложения будут поданы быстро.
- Если количество голосов "ЗА" превышает этот порог, предложение готово к принятию решения.
- Если количество голосов "НЕТ" превышает этот порог, предложение считается проваленным.

## Кто может вносить предложения

- Чтобы предлагать или голосовать, вы должны сделать стейк, но вы не обязаны управлять нодой валидатора. Тем не менее, мы рекомендуем вам быть валидатором со стейкингом и входить в набор валидаторов.
- Чтобы создать предложение, пул резервных стейков предлагающего должен иметь минимально необходимый стейк предлагающего. Стекинг предлагающего должна быть заблокирован, по крайней мере, на срок, равный периоду голосования предложения. Это делается для того, чтобы избежать потенциального спама.
- Участники могут создать предложение, вызвав `[AptosGovernance::create_proposal](https://aptos.dev/concepts/governance#:~:text=AptosGovernance%3A%3Acreate_proposal)`.

## Кто может участвовать в голосовании

- Чтобы проголосовать, вы должны сделать стейк, хотя от вас не требуется запускать ноду валидатора. Ваше право голоса формируется из резервного пула стейков.

> **ПОДСКАЗКА**
> Каждый пул стекинга может быть использован для голосования по каждому предложению только один раз.

- Сила голоса рассчитывается на основе активной доли в текущей эпохе в пуле стейкинга, поддерживающих предложение или избирателя. Кроме того, блокировка пула стейкинга должна быть не меньше, чем продолжительность предложения.
How About a Nice Game of Chess?
Tags: adventofcode, algorithms, programming, javascript
Published: 2022-08-30 15:27:06

## [Advent of Code 2016 Day 5](https://adventofcode.com/2016/day/5)

## Part 1
1. Going backwards helped
2. Playing the waiting game...again

### Going backwards helped
I'm quite familiar with MD5 hashing by now:
- [Day 17: Two Steps Forward](https://adventofcode.com/2016/day/17)
- [Day 14: One-Time Pad](https://adventofcode.com/2016/day/14)
- And now Day 5, which I presume is the first `MD5`-themed puzzle for this year - though I could be wrong

### Playing the waiting game...again
- Generate a hash
- Check for a match of `00000` as the first five characters in the hash
- Repeat until eight matches are found

My algorithm in JavaScript:
```js
let index = 0, password = "", doorID = 'abc'
while (password.length < 8) {
  let hash = MD5(doorID + index).toString()
  if (hash.slice(0,5) == '00000') {
    password += hash[5]
  }
  index++
}
return password
```

This may take a while...especially since the match is five `0`s in a row!

...

It didn't take as long as Day 14 - where I had to generate 2017 hashes each iteration!

But it still took several minutes to run.

Thankfully, it generated the correct answer for my door ID!

## Part 2

### A cool twist and a longer waiting game
- I updated my algorithm to account for an array, a position and a value

But I initially neglected to account for this portion of the instructions:
> Use only the first result for each position

- I wasn't quite sure what that meant
- Until I ran my algorithm on the example input
- And I generated an answer different from the expected one
- Because I had modified some of the values already set

After updating my code to account for this:
```js
password[hash[5]] = password[hash[5]] || hash[6]
```

My algorithm generated the correct answer for the example door ID and my door ID!

My updated algorithm in JavaScript:
```js
let index = 0, doorID = 'abc'
let password = new Array(8).fill(null)
while (password.includes(null)) {
  let hash = MD5(doorID + index).toString()
  if (hash.slice(0,5) == '00000' && hash[5] < 8) {
    password[hash[5]] = password[hash[5]] || hash[6]
  }
  index++
}
return password.join('')
```

## I did it!!
- I solved both parts!
- After a short time writing and a lot of time waiting!
- And accommodating one important use case in my algorithm!
Tkinter - When Will It Be Ready For Mobile Applications?
Published: 2022-08-30 15:21:30

I love Tkinter's simplicity with it's syntax, but I kinda turned away from using it when I realized it will not run on mobile devices. Once it can run on mobile devices (if ever), then I'll consider coming back to it. Does anyone know if the Tkinter team plans on making it truly cross-platform compatible and ready to run on ALL devices?
Meteor.js blast from the past: mobile package examples
Tags: javascript, mobile, meteor
Published: 2022-08-30 15:04:42

A quick blast from the past! In the early days of Meteor, three packages specifically for mobile development (understand Cordova) were released. Two of those `mdg:camera` and `mdg:geolocation` had also quick examples attached to them which I have updated and released this year (added to the [Meteor example list](https://github.com/meteor/examples?utm_source=storyteller&utm_medium=online&utm_campaign=Q2-2022-Ambassadors) recently).

There really isn't much to these examples (just straight ahead to show the function of the package), but like with most things in Meteor the great thing is that even though these packages are targeted for mobile is also fully usable in the browser. Due to how Meteor (and these packages are build) they detect if they run in browser (in which case they use the web API) or Cordova/Mobile (in which case they use Cordova API and packages). So with the same code you can have the same functionality in browser and on mobile.

### [Simple photo](https://simple-photo.meteorapp.com/)
First for the camera package, as the name suggest it requests permission to the camera and then takes a photo and displays it on the page.

### [Simple location](https://simple-map.meteorapp.com/)
Again, focus on geolocation. Requests access to your location services and displays the received coordinates and shows them on a map. Originally the example used Google Maps, but the services to display Google map have since been hidden behind paywall, so I went with Open Street Map via free version from [GeoApify](https://www.geoapify.com/). But if you look into the source code of the example you will find the code for Google Maps ready for you.

I wanted to highlight these two packages as they didn't receive much attention for few years (just refreshed them earlier this year - just needed some Cordova updates) and if you are doing anything with photo or need to get user's location they are a super easy to add and use in your Meteor application.

Do you use or have you used these packages? Any other older packages that you would like to see me cover?

--------
If you like my work, please support me on [GitHub Sponsors ❤️](https://github.com/sponsors/StorytellerCZ).
useNavigate Hook in React JS
Tags: javascript, react, webdev, tutorial
Published: 2022-08-30 15:00:27


The useNavigate hook is one of my favorite and easy-to-use hooks while programming with React JS. It offers more functionality of the similar yet antiquated useHistory hook, only with easier compatibility and more features. It presents a very streamlined approach for navigating pages and redirecting to specific URLs of your application. 
___


### To Start:
useNavigate requires React Router Dom v6 as it replaced the useHistory hook of older React Router Dom versions. To install this package: 

```javascript
npm install history@5 react-router-dom@6
```

You will then have to import the hook from React Router into any functional component you wish to implement the hook. 
```javascript
import { useNavigate } from 'react-router';
```
######note: useNavigate can only be used in functional components and cannot be used for class components
---


###Next:
Define a variable equal to the useNavigate hook inside of your functional component. We will call it "navigate" for the purpose of distinctiveness.
```javascript
let navigate = useNavigate();
```
---
###Then:
Call the variable anywhere within your component and pass in any route which has been defined in order to redirect to said route. In this instance, we are calling navigate('/shoppingCart') inside of an onClick function in order to re-route to the designated route upon clicking.

```javascript
function Home() {
  let navigate = useNavigate();
  function redirect() {
    navigate('/shoppingCart')
  }
  return (
    <div>
      <button onClick={redirect}>View Shopping Cart</button>
    </div>
  )
}
```
---
###Additionally:
useNavigate can be passed numerical arguments in order to navigate back to the original page. 

```javascript
function ShoppingCart() {
  let navigate = useNavigate();
  function redirect() {
    navigate(-1)
  }
  return (
    <div>
      <button onClick={redirect}>Back to Home</button>
    </div>
  )
}
```

Here we can see that, instead of a specific route (eg: /home) we pass the numerical argument of -1, which will take us back to the former page. 

Similarly, while -1 is passed to useNavigate() in order re-route to the former page, 1 will re-route to the next page held in history. 

---

Thanks for reading and I hope this short tutorial has proven helpful.
Input with label using CSS - Tutorial
Tags: css, html, webdev, design
Published: 2022-08-30 14:51:50


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

## <u>HTML</u>

For HTML we'll need a container with label and input.

We'll also set placeholder for input to space (" "), which will allow us to detect with CSS when input has some value.

```html
<div class="input_container">
        <input type="text" name="name" placeholder=" ">
        <label for="name">Name</label>
</div>
```
    

## <u>CSS</u>

For CSS, we'll set container's position to relative and change font.

```css
.input_container {
    position: relative;
    font-family: BlinkMacSystemFont;
}
```
    
Now we'll set label's position to absolute and align it in center with top 50% and transform translateX(-50%).

And z-index to -1 so that the input is on top of label.

Otherwise we won't be able to click on input when mouse is on label.

Then we'll set background color to white (#fff). Actually here you just set the same color as your background, because this element will go on top of input's top border, and we don't want border to be behind.

Lastly, I'll set text color to light grey and add some margins, paddings and a little transition.

```css
.input_container label {
    position: absolute;
    margin: 0 5px;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: -1;
    background-color: #fff;
    padding: 0 2px;
    color: #aaa;
    transition: .2s;
}
```
    
For input, I'll set border color to the same light grey color I used on label's text color.

I'll also add some border radius, paddings and set background color to transparent, so that the label behind is visible.

```css
.input_container input {
    border: 1px solid #aaa;
    border-radius: 5px;
    background-color: transparent;
    padding: 5px;
}
```
    
Then I'll just remove the outline on focus.

```css
.input_container input:focus {
    outline: none;
}
```
    
Now I'm styling the label when input is in focus or has some value.

Using "input:not(:placeholder-shown)" I'll select input when there is some value (when placeholder is not shown) and when in focus, and by using sibling "+" selector, I'll' select label, and move it on top of input's top border by setting z-index to 1 and top to 0.

And I'll decrease font size.

```css
/* Focus or containing value (placeholder not shown) */      .input_container input:focus + label,
.input_container input:not(:placeholder-shown) + label {
    top: 0;
    font-size: 8px;
    z-index: 1;
}
```
    
When input is in focus, I'll overwrite label's color and input's light grey border and set it to green.

```css
/* Only when focused */
.input_container input:focus + label {
    color: rgb(15, 156, 116);
}
.input_container input:focus {
    border-color: rgb(15, 156, 116);
}
```
    
And that's it.

You can find the code and video tutorial [here](https://designyff.com/code/input_with_label).

**Thank you for reading. ❤️**
Is there a basic explanation of Web3 somewhere for my mom?
Tags: watercooler, discuss, web3, learning
Published: 2022-08-30 14:49:59

---
title: Is there a basic explanation of Web3 somewhere for my mom?
published: true
description: There isn't, but there should be! 💡 Blockchain is a tool for building Web3, which to me simply means the internet of value (owning digital things). But that also means blockchain need not be a part of that equation at all.
tags: watercooler, discussion, web3, learning
cover_image: https://images.ctfassets.net/m33y9bdtd8t2/DKxsBYU75Rj0ncDiI1Giw/2943a53a5d0a95f9d1f8fbf5f036ffed/cdixonwteet.png
# Use a ratio of 100:42 for best results.
---

There isn't, but there should be! 💡

![web3 explained in a tweet](https://images.ctfassets.net/m33y9bdtd8t2/DKxsBYU75Rj0ncDiI1Giw/2943a53a5d0a95f9d1f8fbf5f036ffed/cdixonwteet.png)

Blockchain is a tool for building Web3, which to me simply means the internet of value (owning digital things). But that also means blockchain need not be a part of that equation at all.

To take advantage of it, your Mom shouldn't need to understand the inner mechanics. I have a refrigerator, what does it do? It keeps food cold. You needn't know the inner workings to take advantage of it's awesome power.

We all pay for goods with money, yet only a select few understand the economics behind fiat. Web3 needs to bridge that gap.

This might rub some purists the wrong way though. It means the average person cares very little about decentralization. What they will care about is being able to log in to applications without having to remember a password or transfer money from place to place without waiting for a clearing house or being charged a transaction fee.

God forbid we allow financial transactions to take place instantly, without paying a middleman... 🤯

I find Web3 seems to conflate the technology behind it with what makes it valuable to a consumer.

But would people be skeptical of HOW it allowed them to log in without a password like they are used to?

Does anyone know if those GDPR cookie popups actually work on every website? Do they ask how our passwords are stored?

I've met developers with years of experience that have no idea how traditional password-based authentication works. I'd imagine most people know even less than that with the tech we have right now.

Someone once told me the little red emergency brakes 🚨 on the train are actually connected to nothing. They're just there to make you feel good. I think of this metaphor a lot when browsing the web. So many popups, certifications, and legalese. Yet there are so many data leaks, breaches, and vulnerabilities on trusted platforms.

What I think is cool about Web3 is the idea that it will enable great security. How it achieves that will grow less and less important to consumers as it becomes mainstream.
Js Cheatsheet
Tags: javascript, webdev, programming, beginners
Published: 2022-08-30 14:37:02

Best cheatsheet of JavaScript

```
<a href="https://www.codecademy.com/learn/introduction-to-javascript/modules/learn-javascript-introduction/cheatsheet"><button>Cheetsheet of JS</button></a>
```
https://www.codecademy.com/learn/introduction-to-javascript/modules/learn-javascript-introduction/cheatsheet

follow for more @anshulsoni2010
Концепции APTOS | Доказательство
Tags: blockchain, aptos, tutorial, webdev
Published: 2022-08-30 13:16:00

Блокчейн Aptos использует доказательства как способ проверки подлинности и правильности данных блокчейна.

Все данные в блокчейне Aptos Blockchain хранятся в распределенной базе данных с одной версией. Каждый валидатор и хранилище FullNode отвечают за сохранение согласованных блоков транзакций и результатов их выполнения в базе данных. Блокчейн представлен в виде постоянно растущего дерева Merkle, где каждый лист, добавленный к дереву, представляет собой одну транзакцию, выполненную блокчейном.

Все операции, выполняемые блокчейном, и все состояния учетных записей могут быть проверены криптографически. Эти криптографические доказательства гарантируют, что ноды-валидаторы согласны с состояниями. Благодаря поддержке доказательств клиенту не нужно доверять организации, от которой он получает данные. Например, если клиент получает последние n транзакций учетной записи, доказательство может подтвердить, что в ответе не было добавлено, упущено или изменено ни одной транзакции. Клиент также может запросить состояние учетной записи, спросить, была ли обработана конкретная транзакция, и так далее.
Validar paquetes de Oracle con Docker (en un pipeline)
Tags: oracle, azure, devops, docker
Published: 2022-08-30 14:31:27

La forma correcta de asegurar que los paquetes de nuesta aplicación, no tengan errores durante el Pase a Producción; es compilarlos anticipadamente en un ambiente Pre-Producción (o UAT).

Pero si lo tenemos que hacer manualmente, existe la posibilidad de obviar algún _script_ o validación.

De manera que, automatizar este paso es crucial en nuestra operación de CI/CD.

---

Como primer punto, es tener una base de datos inicial. Puede contener solo la estructura de las tablas y con ello reducimos el tamaño del _export_. 

Realizamos el _import_ en una imagen de *Docker*:
```
FROM docker.io/gvenzl/oracle-xe:11
```

Luego, ejecutaremos los scripts (DDL y DML). A continuación, compilaremos todos los paquetes. 

De haber paquetes inválidos, el *Pipeline* fallará. Esa será la forma de validarlos.
 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wishk4qs522lf6pf7tqx.png)

Este es un ejemplo del archivo azure-pipelin.yml:
```yml
# Build Docker image for this app, to be published to Docker Registry
pool:
  vmImage: 'ubuntu-latest'
variables:
  buildConfiguration: 'Release'
steps:
- script: |
    git clone https://gitlab.com/edgar.gs/posunificado-docker-oracle11g.git
    cd posunificado-docker-oracle11g
    git checkout 5a9d701c0492841e734ee08dd1de10f6d652578d
- task: CopyFiles@2
  inputs:
    SourceFolder: 'posunificado-docker-oracle11g/DOCKER/init_scripts'
    contents: '**'
    targetFolder: 'fps-app-bd-posunificado/DOCKER/init_scripts'
- task: ExtractFiles@1
  inputs:
    archiveFilePatterns: 'posunificado-docker-oracle11g/DOCKER/PTOVENTA_V1.7.2.DMP.zip'
    destinationFolder: 'fps-app-bd-posunificado'
    cleanDestinationFolder: false
    overwriteExistingFiles: false 
- script: |
    cd fps-app-bd-posunificado
    docker build -f Dockerfile -t ptoventa-build:$BUILD_BUILDID .
    docker run --name ptoventadb ptoventa-build:$BUILD_BUILDID
- script: |
    docker start ptoventadb
    docker cp ptoventadb:/u01/app/oracle/artifacts $(System.DefaultWorkingDirectory)
    docker stop ptoventadb

- task: CopyFiles@2
  inputs:
    contents: '**/*.log'
    targetFolder: $(Build.ArtifactStagingDirectory)
- task: PublishBuildArtifacts@1
  inputs:
    pathToPublish: $(Build.ArtifactStagingDirectory)
    artifactName: MyBuildOutputs
```
---

Se puede observar la ejecución en el siguiente video:

{% embed https://youtu.be/eXm_NThI4Fk %}

---
## Documentación


https://gitlab.com/edgar.gs/posunificado-docker-oracle11g.git
https://hub.docker.com/r/gvenzl/oracle-xe