teleren/devto huggingface dataset:
I quit
Tags: watercooler
Published: 2022-04-01 06:06:22

It's been 735 articles, and I've finally had enough.
Time to lay down the keyboard and retire the blog.

Don't worry the blog will keep being online so you can re-read all those 735 articles.

You might wonder, why?

The blog takes a lot of effort every day, and recently I've found myself not finding the motivation to write.
The inspiration is there, but putting the words down is becoming difficult.

## A big thanks

Thank you to all the people who have read all my articles and supported me in my journey.

You made this blog come to life, and what kept me writing.

I won't take up to much of your time, as I value everyone's time...

## So what now?

Now it's time to announce that it's currently April 1st.

So: April fools!

![April fools](https://media.giphy.com/media/bvhj7zqJ11RjG/giphy.gif)

Of course, I won't stop publishing, I promised to try and do a [full year non-stop](https://daily-dev-tips.com/posts/i-received-a-letter-from-myself/) 🤘

Enjoy this day of jokes and laughter.

### Thank you for reading, and let's connect!

Thank you for reading my blog. Feel free to subscribe to my email newsletter and connect on [Facebook](https://www.facebook.com/DailyDevTipsBlog) or [Twitter](https://twitter.com/DailyDevTips1)
What does a Block look like in a Blockchain?
Tags: blockchain, cryptocurrency, blockchaintech
Published: 2022-04-01 06:05:29

**Hey Guys,**

Hope all are doing well.

Great!

**Today we will see about the block, and what does it look like in a blockchain network.**

I assume you are aware of _block structure_. If not, please read my previous article [here](https://medium.com/coinmonks/structure-of-the-block-inside-a-blockchain-network-7ad66ea5bea).

Awesome.

_Block_ is the head of a blockchain network. without blocks, you can't create a blockchain. and every _block_ interlinked with each other. Let's see how.


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

As you can see in the above diagram, a _block_ is consists of **Nonce, SHA256, the previous block signature, and some transactions.**

**Genesis Block**

The very first _block_ is called a _Genesis Block_ or _Block 0_. Because this _block_ doesn't contain any previous _block_ signature.

Able to understand somewhat?

Great!

Let's see other parts.

**Nonce**

Every _block_ must have a _Nonce_. A _nonce_ is created by a miner, who mines the _block_ into a blockchain network. These are generated in a particular way through the mining algorithm. It contains some value, and it is different from other nonce values.

**SHA256**

_SHA256_ is a simple hash algorithm that crunches any length of data into a unique string of a fixed length. Each _block_ has a different _HSA256_.

Eg. ba7816bf8f01cfea414140de5dae2223b00361a396177a9cb410ff61f20015ad

**Signature**

_Genesis block_ doesn't contain a _signature_. Because, it is the very first block, or block 0. Once the genesis _block_ is formed, the _signature_ will be added to the next _block_. A _signature_ is the HSA256 value of the previous _block_. Block 1's signature value is the same as Block 0's SHA256 value. Block 2's signature value is the same as Block 1's SHA256 value. And so on. With the help of this _signature_ value, every _block_ is linked with another _block_.

**Transactions**

Each _block_ contains some _transactions_, but not the _genesis block_. _Transactions_ can be anything like let's say, A has 10 coins, B has 20 coins and C has 40 coins. A transferred 5 coins to B and C transferred 10 coins to B. Like this, every _transaction_ is stored in a _block_.

I think you have got some idea about the block.

**Great**!

If you further need any help, try to connect with me. I’ll be happy to solve your doubts.

Till then, keep learning and keep smiling :)

Thanks for reading this. See you soon with a new article.

[LinkedIn](https://www.linkedin.com/in/sarojvrc/)   [Twitter](https://twitter.com/iamsarojb)
Feature branches slow me down, but not with merge conflicts
Tags: discuss, waysofworking
Published: 2022-04-01 06:04:15

I recently did the mistake of working on a long lived feature branch that was active for over a week. I try to avoid this as much as possible, but sometimes I slip. The branch got a bit big and that in itself slows the review process down because some developers are either afraid, or don't want to commit their time, into reviewing it. 

I've never had major issues with merge conflicts when using feature branches. Typically the teams I've worked on, even in big monolithic systems, have their work segregated so we don't really work on the same files and have these kinds of issues. If we do, resolving those issues is rather easy. What is an issue however, is that now I have to continue working with that specific feature, and I need the original branch as a base to continue, and it's sitting on the PR queue. I adjusted my ways of working through our retrospective, and split my stories so small that I can complete those tasks through short lived feature branches (customer's teams don't do trunk based development), but I can't start until that base branch is merged into the development branch. Otherwise I'd have to create a new branch from the base, and then wait until it's merged so I can open another PR and so on. It might be in the queue for days.

Have you experienced this issue and how did you manage it?
Day 2
Tags: html, css, javascript
Published: 2022-04-01 06:03:25

---
title: Day 2
published: true
description: toggle between login interface and registration interface
tags: HTML, CSS, JavaScript
//cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j45sv9iu9qo8905s4x65.png
---

I will use [Scrimba](https://scrimba.com/) please check out the platform if you want to learn programing interactively.

Biggest reason  of using scrimba is it make playing with code easy.

Check the banner to see coding in action

Day 2 code on Scrimba [Code](https://scrimba.com/scrim/canvzECW)

### The Plan

Copy code from day 1

Make login and registration toggle using js 

Link *.js page to the index.html file

> `<script src="./*.js"></script>`

Inside *.js file create two functions next() and prev()

The idea is to toggle between login interface and registration interface

By default we see login interface when click event is clicked we see registration interface

Just changing CSS propeties via JavaScript
>Currently in style.css
>```
>#registration{
>    display: none
>}
>```
>
>JavaScript will dynamically add css style to #login and #registration
>
>```
>#login{
>    display: none
>}
>
>#registration{
>    display: block
>}
>```
>
>The inverse happens when click event is clicked again

### JavaScript code to achieve that

>```
>function next() {
>    document.getElementById('login').style.display = "none";
>    document.getElementById('registration').style.display = "block";
>}
>function prev() {
>    document.getElementById('registration').style.display = "none";
>    document.getElementById('login').style.display = "block";
>}
```

In index.html we setup for the click event on the event on a new user

1. anchor tag inside Login form  add `onclick="next()"`

<a href="#" >You don't have an account yet? Register Here</a>

2. anchor tag inside Registration form  add `onclick="next()"`

<a href="#" onclick="prev()" >You have an account already? Login Here</a>
WN13: What is the best piece of content you found?
Tags: discuss, career, productivity
Published: 2022-04-01 05:42:55



Another week has passed, and here we want to get the best pieces of content you found during the week!

It really can be anything:

- videos
- posts
- tweets
- books
- motivation
- etc.

Share anything that added value to your journey and could add value to other people's journey.

So, what is the best piece of content you found this week?
Some project ideas for beginners, Web Development.
Tags: javascript, webdev, beginners, programming
Published: 2022-04-01 05:33:44

In this article we will see some project ideas
that you can create with only HTML, CSS and JavaScript.
This projects will help you understand about basic web.
- The Clock
 - Create a Round Dial clock or Digital Clock.
 - Update Clock hands rotation using JavaScript.
 - Use CSS animations in background
 - Helps in understanding.
   1. Handling CSS with JavaScript.
   2. Transform properties of a object in CSS.
   3. Position property in CSS.
 and, do something creative with it, [reference](https://github.com/its-kunal/Mrs-Minutes)

- Calculator
 - Create a basic calculator using HTML, CSS and JS.
 - Use event handlers for input box. while using buttons. 
 - Store previous calculation in local storage.
 - Helps in understanding.
   - Asynchronous JavaScript
   - Grid System
   - Event Handling, Event Listeners

- Messaging UI
 - Create two containers for two persons and show them messages stored in local storage.
 - Helps in understanding.
  - How messaging service works.
  - Concept of showing messages.
 - Use components from bootstrap.
 - use sass with bootstrap.

That is it for this article, be free to share more ideas and suggestion in discussion section below.
100 días de código: 94, reflexionar sobre tu camino de desarrollador
Tags: spanish, webdev, 100daysofcode, beginners
Published: 2022-04-01 05:32:52

Foto del cover de [Elijah Hiett](https://unsplash.com/@elijahdhiett?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) en [Unsplash](https://unsplash.com/s/photos/think?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText).
  

¡Hey hey hey!

Despues de casi 100 días de código que realmente se convirtieron en unos 4 o 5 meses he llegado a la conclusión de que estoy suficientemente preparado para el sector laboral y se que, como yo, tu también estarás en ese proceso o lo habrás superado obteniendo tu empleo y aunque he tomado muchos cursos y realizado muchas guías no me he encontrado la siguiente pregunta...

¿Cual es el camino que quieres seguir?

Pareciera que realmente es una pregunta sencilla de responder y en algunos casos lo sera pero creo que es muy importante plantearte como te ves a largo plazo  porque te indica que es lo que te gustaría en tu futuro. 

Puedes pensar... me gustaría un aumento, conseguir un empleo donde haya un buen salario o trabajar para una empresa en donde pueda seguir codificando jquery todos los días pero creo que con el tiempo estos objetivos se vuelven vagos y volverá a tu mente la pregunta anteriormente mencionada. 

¿Cual es mi camino? 

Es importante reflexionar con esta pregunta, piensa en tu vida, en como te nace y te mueven algunas cosas y otras no, en cuales te gustaría y no te gustaría hacer y con ello te iras guiando para escribir un pequeño párrafo que describa el camino que quieres seguir en tu vida, no solo como desarrollador si no como persona.

Recuerda hacer esa pregunta cada cierto tiempo... Creo que te ayudara en la vida para ayudarte a sentirte pleno cada día porque la motivación que te haga sentir ese pequeño párrafo podrá hacer la diferencia en momentos difíciles.

Y aunque no te lo preguntes te contare como es que llegue a esta pregunta... Hoy finalice un proyecto con el stack MERN que sinceramente pensé que seria mas difícil y al terminarlo me di cuenta que no sabia cual era el siguiente paso. 

Pase de codificar algo a tener mi mente en blanco con lo cual llego el momento de pensar en que era lo que quería para mi futuro y he decidido convertirme en freelance para lograr demostrar mis habilidades de desarrollo web y seguir aprendiendo tecnologías, lenguajes y frameworks para crear las mejores soluciones de software. A la larga pienso convertirme en un desarrollador conocido que ayude a la comunidad a crecer.

Espero que tengas mucho éxito en tus proyectos y ¡animo con todo!

Hasta la próxima.
What exactly is WEB 3.0 ?
Tags: webdev, programming, productivity, career
Published: 2022-04-01 05:27:56

## The Evolution of the Web :

The web has evolved a lot over the years. The evolution of the web is often partitioned into three separate stages.

## WEB 1.0, WEB 2.0, WEB 3.0 

1. WEB 1.0 - Static
2. WEB 2.0 - Dynamic
3. WEB 3.0 - Decentralized 

## What is WEB 1.0 :

WEB 1.0, was mainly about providing online content and information. As such, WEB 1.0 was largely static and practically only allowed users to read information.

## What is WEB 2.0 :

WEB 2.0, which is generally associated with the rise of social media platforms, was instead largely about interactivity and "frontend" usability.

The web becomes dynamic, allowing users not only to consume or "read" information but also create it themselves or "write" information.

## What is WEB 3.0 :

WEB 3.0, aims to going from dynamic to a **Decentralized Internet**. Furthermore, in WEB 3.0, data isn't owned by centralized entities - rather, it is shared.

Moreover, WEB 3.0 focuses on improving **Backend Functionality**, much like WEB 2.0 saw a focus on front-end functionality.

A marquee feature of the WEB 3.0 era is also the emergence of **dApps**, or **Decentralized Applications**, which could supersede traditional applications.

WEB 3.0 enhances the internet as we know it today with a few other added characteristics, WEB 3.0 is :

- Verifiable
- Trustless
- Self-Governing
- Permissionless
- Distributed and Robust
- Stateful
- Native built-in payments
New Display Filters on Stackoverflow
Tags: stackoverflow, aprilfools
Published: 2022-04-01 05:11:19

On MARCH 31st 2022, Stackoverflow added new display feature filters to its site. Until this post Created there are 8 different styles (9 with they default filters), by default its will use random filters if you not yet choose the filters.

1. 3D Glasses
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o0ffxtywpnbzqju1685s.png)

2. BookFace 
> 'Like facebook, i like this filter'
![BookFace](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/05b4tn3c3lcecoov0m8e.png)

3. Hot Dog Stand
![Hot Dog Stand](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u1hvhxlua9qojymdkz9z.png)

4. Frisa Lank 
> i like this filter
![Frisa Lank](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3jo97c4cw29yjdulfppc.png)

5. Terminal
![Terminal](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o81b35xid56xywz7b51c.png)

6. MariOverflow 
> like super mario game
![MariOverflow ](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jys0yarua8mqzktkcclg.png)

7. Top Secret
![Top Secret](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2pd7zhm5lji0lzj6tq7w.png)

8. Windows 3.1 
> Old Windows Look, i think this look like old facebook
![Windows 3.1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s671dftsx18kcoc0kkma.png)

9. The one and only Defalult Theme of StackOverflow
![StackOverflow](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/alynrigaz0xwr2jm48sk.png)


From [stackoverflow](https://stackoverflow.blog/2022/03/31/time-to-get-on-trend-filters/) blog but ended with an april fools tag.
Almost finished with the Flatiron School program
Tags: flatiron, bootcamp, beginners, codenewbie
Published: 2022-04-01 05:03:38

As I begin the last phase of the Flatiron School self-paced software engineering program, I wanted to write a blogpost recapping my code journey thus far. Even though 2021 was one of the worst years in my life, as well as for my family, the Flatiron bootcamp was a bright spot among the negatives since I knew I would have a great career to look forward to once I completed the course. 

I enrolled in the Flatiron School back in late February of 2021, and started off strong in the lessons since I had been doing the free JavaScript intro lessons, so I was pretty familiar with how labs and lecture material worked. After a month or so of being fairly consistent in my lessons/labs, I felt I was on pace to finish the course within 6 months, but then bad luck kept striking. For the next few months, my family and I dealt with a death in our extended family at least once a month, taking my focus away from my studies. While I was helping my family through this tough time, my dad ended up getting laid-off, so I decided to pick up a part-time job to keep the money coming in. These 2 things really made it difficult to stay consistent with my lessons, until my dad ended up getting a new job and I could put my focus back towards the Flatiron program. Around October/November, I jumped back into my labs/lessons and chugged through the material so that I could finish as fast as possible without compromising my learning. Fast forward a few months and I am now entering the last phase of the program, more confident than ever in my coding abilities and eagerly anticipating my future career in software.

Back in early 2021, I never could have dreamed that I would be able to code and create apps/websites from scratch within the span of a year, yet here I am with a skillset that has nothing to do with the things I spent 4 years in college learning about. Without the Flatiron School, I was on the path to become a dentist, and hearing stories from my friends that are currently in dental school about how miserable they are makes me extremely grateful for this program. Not to mention I saved about $250k in student debt and 3 years of additional schooling by shifting careers.
self-host forem on cloud other than gcp,aws,digitalocean
Tags: forem, selfhost
Published: 2022-04-01 04:59:01

The fully automated option for self-hosting forem on gcp, aws and digitalocean is awesome.

However, I wonder what's the recommended practice for self-hosting on other cloud providers. Is there a solution that

forem dependencies/configures as a docker
user figure out how to setup the cloud servers, etc ?
There are some discussions a while back in 2020, but things has changed quite a bit.

https://dev.to/akhilnaidu/installing-forem-dev-using-docker-on-ubuntu-imh

Appreciate your advices and experiences!
Go Build in the Cloud Pt2
Tags: security, identityandaccessmanagement, dataprotection
Published: 2022-04-01 04:57:04

Security[](https://www.youtube.com/watch?v=_2HFqANE4gwrl) is one of the pillars of the well architected framework,the framework is the guideline and manual that describes basic and important key concepts of navigating in the cloud.
These include the design principles,architectural practises for designing and running workloads in the cloud[](https://aws.amazon.com/architecture/well-architected/?wa-lens-whitepapers.sort-by=item.additionalFields.sortDate&wa-lens-whitepapers.sort-order=desc)
Security is baked into every layer of deployment on AWS because it is a priority and the goal of the security pillar of the framework.
The goal of is to always deploy secure  workloads and while doing so,consider following design principles :

- Execute a strong identity foundation

- Make every action easily traceable

- Put in security at all layers

- Automate security best practices

- Protect data in transit and at rest

- Make exposure to your data be in barest minimum

- Prepare for security incidences'

Security of the cloud is the principal duty and offering of AWS to anyone who interacts or builds with them.The main purpose is establish a relationship of trust as demonstrated by the shared responsibility model[](https://aws.amazon.com/compliance/shared-responsibility-model/).
While your workloads are secured in the relationship because the security of the cloud is  top tier with your partner give  security in the cloud a premium place in building.
electron-store with TypeScript Example
Tags: typescript, tutorial, node, electron
Published: 2022-04-01 04:45:54

---
description: "electron-store with TypeScript Example"
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/i8ba1h9goi45a3929kzb.png
---

> Simple data persistence for your Electron app or module - Save and load user preferences, app state, cache, etc.
>
> [electron-store](https://www.npmjs.com/package/electron-store)

Below some example how to use [electron-store](https://www.npmjs.com/package/electron-store) in TypeScript and using Schema for validation.

```ts
import Store, { Schema } from 'electron-store';

interface Dummy {
  someObject: {
    someString: string;
  };
  someNumber: number;
  someEnumString: 'one' | 'two' | 'three';
}

const schema: Schema<Dummy> = {
  someObject: {
    type: 'object',
    properties: {
      someString: {
        type: 'string',
        default: 'string inside object',
      },
    },
    default: {}, // electron-store need this for object type
    required: ['someString'],
  },
  someNumber: {
    type: 'number',
    minimum: 1,
    maximum: 100,
    default: 50,
  },
  someEnumString: {
    type: 'string',
    enum: ['one', 'two', 'three'],
    default: 'two',
  },
};

const store = new Store<Dummy>({ schema });

console.table(store.get('someObject'));
// ┌────────────┬────────────────────────┐
// │  (index)   │         Values         │
// ├────────────┼────────────────────────┤
// │ someString │ 'string inside object' │
// └────────────┴────────────────────────┘
console.log(store.get('someNumber'));
// 50
console.log(store.get('someEnumString'));
// two
try {
  store.set('someNumber', 200);
} catch (err) {
  console.error(err);
  // Error: Config schema violation: `someNumber` must be <= 100
}

try {
  store.set('someEnumString', 'four');
} catch (err) {
  console.error(err);
  // Error: Config schema violation: `someEnumString` must be equal to one of the allowed values
}
```
use env variables blga blga
Published: 2022-04-01 04:44:36

<img src="https://raw.githubusercontent.com/aru31/test-blog-publish/master/media/google.png" alt="another tag" />entirely since you will need to delete files/folders from your system. But it is generally a good idea to move the files/folders you want to delete to a recycle bin and then delete them after some time. I will also share the script and modification I used to adopt this setup.
<img src="https://raw.githubusercontent.com/aru31/test-blog-publish/master/media/subfolder/download.png" alt="another tag" />entirely since you will need to delete files/folders from your system. But it is generally a good idea to move the files/folders you want to delete to a recycle bin and then delete them after some time. I will also share the script and modification I used to adopt this setup.

Slightly modified
March 21, 2022
Tags: rem, em, css
Published: 2022-04-01 04:37:35

absolute vs relative 

absolute - px
relative - %, v*, em, rem

(16px is the pixel that the browser provides default)

**em**
1em = 16px

for example,
parent > child

.parent{
    font-size: 8em;
}

.child{
   font-size: 0.5em;
}

parent font size - 16px * 8 = 128px
child font size - 128px(parent font size) * 0.5 = 64px


**rem**
**root** em

root = html

parent > child

.parent{
    font-size: 8rem;
}

.child{
   font-size: 0.5rem;
}

parent font size - 16px * 8 = 128px
child font size - 16px * 0.5 = 8px