teleren/devto huggingface dataset:
Basic Knowledge required to be a Front-end developer in web3
Published: 2022-11-25 16:33:37

So this article is to explain the nitty-gritty of what is required to become a front-end developer as a novice in the web3 space. The web3 space is a level higher than the web2 space because now we are dealing with a decentralized system. What is a decentralized system? It's a system where you own your data and information. In the tech space there is no multinational company keeping your records or information. 

To be a front-end developer in the web2 space you need the knowledge of this 3 major topics
Html (Hypertext markup language)
Css (Cascading style sheet)
Js (Javascript)

Html is the basic structure of the content of your web page; it is also referred to as the skeleton. This contains all the words, images, videos etc that will be seen on your web page

Css is the beautification of your webpage. It includes the adding of color, font, animation etc to a web page

Js deals with the interactivity of the web page e.g I fill a form and submit and it replies Thank you for submitting. This is the work of javascript. Web pages that do not make use of javascript are called static sites.

Now to upgrade to the web3 space you will need the additional knowledge of APIs and React js. Let me break it down a little. In web2 you require APIs as this allows you to interact with the backend(database where information is stored) likewise it's the same in web3 the only addition is that it will also interact with the Smart contract for it to be deployable on the blockchain. The Vanilla javascript can interact with smart contracts but it takes more time to manipulate and so React js is used. Which makes it easy for interaction with the backend.

In using the React js we require the installation of the node js as this shows the changes in the javascript folder in the terminal of your coding editor. Before i go in too deep, other terminologies you will come across as a beginner includes coding editor, git & github

Coding editor is like an interface where you write your code. Codes cannot be written in ms-word or excel sheet. Examples of coding editors include Visual studio code(VSCode), Atom, Notepad ++, Bracket etc. All these are downloaded from the internet.

Git is a version control tool that is used to keep track of changes to files like code files. i.e it allows you to store your codes in case of changes and notifies you of a new update.

Github is an online hosting service for your git repositories i.e it plays the same role as the popular google drive but in this case it only stores codes in files known as repositories.

All of these coding tools are accessible for download online. There is also documentation on their sites that walk you through the installation process and how to make use of them. But all in all google is your friend for any information you need, youtube is also there. I personally learn faster with visuals, learn with what best suits you. I hope this introduction has given you a green light on how to start your journey in becoming a front-end developer.
Functional requirements vs Non-functional requirements
Tags: systemdesign
Published: 2022-11-25 16:30:00

---
title: Functional requirements vs Non-functional requirements
published: true
description: What are functional and non-functional requirements and what is the difference between them?
tags: systemdesign
published_at: 2022-11-25 16:30 +0000
---

In order to build a good software system it's usually recommended a good understanding of its requirements. These requirements can be divided into two groups: **functional requirements** and **non-functional requirements**.

## Functional requirements

Functional requirements describe *how the product must behave*. For example: *"the system sends a confirmation email when a new user account is created"*.

## Non-functional requirements

Non-functional requirements specify the quality attributes of the system, that's why they are also called *quality attributes*. The key types of non-functional requirements are:

- **performance and scalability** - How fast does the system return results? How much will this performance change with higher workloads?
- **portability and compatibility** - Which hardware, operating systems, and browsers, along with their versions does the software run on? Does it conflict with other applications and processes within these environments?
- **reliability, maintainability, availability** - How often does the system experience critical failures? How much time does it take to fix the issue when it arises? And how is user availability time compared to downtime?
- **security** - How well are the system and its data protected against attacks?

These requirements are part of a format that is called SRS a.k.a. Software Requirement Specification.
how to learn codding - for beginner
Tags: programming, beginners
Published: 2022-11-25 16:27:11

Codding is one of the best skills to learn in 2022. you can also make good money by learning it. 
First, start by learning a programing language, the best one to get started is python. You may ask why python? Because it's very easy to understand and you can understand the basics of programming very easily with python.
You can buy a course on Udemy, buy a book or you can watch tutorials on YouTube but the important thing is that you have to do it by yourself and practice it to understand how to write code.
At this stage don't try to make some big project while learning python(or any other language) you should have this understanding goal in your mind.
 You should know what are variables, data types, functions, if-else statements, and loops
You should try to understand what is going on behind the scenes. Why so and so is output when something is changed code.
 Don't hesitate to make errors and try everything which is popping up in your mind.
O mito do "Java é Difícil" e as melhorias da linguagem
Tags: java, beginners, programming
Published: 2022-11-25 16:27:09

## O mito

Uma das coisas que eu mais vejo na internet e faculdade são falas como "Deus me livre de usar Java", "Java é muito difícil" e "Java é muito verboso" ~~"Precisei comprar um computador de R$ 10.000,00 para poder usar Java"~~, ta eu não trouxe muitos exemplos, aposto que você também viu algo parecido.
O grande problema é que muitas pessoas, na verdade, não entendem o paradigma de Orientação a Objetos e culpam a linguagem em si, a linguagem nunca é a culpada por algo. Ela é só uma ferramenta, o grande ponto é o telefone sem fio que vai espalhando a "noticia" de que o problema está na linguagem, muitas pessoas sequer programaram em Java.
Uma coisa que essas pessoas podem fazer é entender melhor o que é a Orientação a Objetos, que problemas ela resolve, tentar outra linguagem como C#, Ruby, ou qualquer outra que tenha esse paradigma, a pessoa entendendo o paradigma a linguagem vai ser o menor dos problemas.
Um grande ponto é que não precisamos mais escrever Java como era escrito antigamente, temos frameworks que abstraem muitas coisas, como o Spring, com Spring conseguimos fazer um CRUD com poucas linhas de código, se usar Rest Repositories e JPA viish, em 10 minutos sai um CRUD, com tudo que é método e ainda implementando HATEOAS, paginação e tudo mais.

A realidade é que as pessoas precisam perder o medo da linguagem e entender que ela é apenas uma ferramenta.


## As melhorias

A verbosidade da linguagem vem diminuindo com o tempo, por exemplo, no Java 17 (ultima LTS) temos os records, uma feature bem interessante para dados que são imutáveis, não precisamos criar aqueles famosos POJOS.

```java
public record Person(String name, String email, String address) {}
```

Desse modo temos um tipo de classe, mais compacto, com atributos imutáveis e métodos `get` para eles.
Agora também temos "switch expressions" que são blocos "switch" que podem também retornar algo, temos um modo melhor também para dar o "match" em um valor.

```java
public int foo(int input) {
    return switch(input) {
        case 1, 3, 5, 7 -> input * 2;
        case 2, 4, 6, 8 -> input * 3;
        default -> input;
    }
}
```

Em versões anteriores também temos o `for` abstraindo iterators, temos a Stream API, conseguimos usar recursos de linguagens funcionais em Java também.
Need help extracting emails....
Published: 2022-11-25 16:23:15

So:

I have a task to gather all the contact emails from multiple people from a website.

The website is about movies and here are about 30 movies on a page.

To find the contact div, i need to firstly click on the movie img and then click on the contact div where i find the data i want: The contact email from the producer.

Now, there are about 300 pages. So about a total of almost 9000 movies.

Is there any way I could extract the emails using some kind of web scraping method or shall I accept my misery and spend two months manually writing them? Thank you in advance and sorry!
Navigator, a fine-tuned tool to quick directory access and navigation
Tags: bash, linux, commandline, shell
Published: 2022-11-25 16:14:48

---
title: Navigator, a fine-tuned tool to quick directory access and navigation
published: true
description: Allow the user to navigate between directories faster than ever
tags: bash, linux, commandline, shell
cover_image: https://i.imgur.com/0fXAI3i.jpg
# Use a ratio of 100:42 for best results.
# published_at: 2022-11-25 15:41 +0000
---

This tiny tool that relies on the shoulder of giants has one single goal: **to allow the user to navigate between directories faster than other tools, even `cd` in most cases**.

I focused on UX to make it easy and useful. Look these nice features:

- The last created directories are near the focused cursor for quick access.
- Always focus on directory ".." when changing directory to allow quick exit to the parent directory.
- Files are listed separated from directories.
- Files can be opened with the associated application.
- The path of last directory or file accessed is copied to the clipboard.
- Fuzzy search.


[![shell screenshot inside the script navigator showing a list of files and directories](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d8et60x4mpob4sfr1hkn.png)](https://github.com/llagerlof/navigator)


## How to install

**1)** Install the following dependencies using your distro's package manager:

- fzf
- xclip
- xgd-open (from package xdg-utils)

**2)** Download the script `navigator` from https://github.com/llagerlof/navigator

**3)** Copy the script to `/usr/local/bin/`

**4)** Make it executable with `chmod +x /usr/local/bin/navigator`

**5)** Create an alias in your `~/.bashrc`. Add the following line to the end of file:

```
alias n="source /usr/local/bin/navigator"
```

**6)** Reopen the shell to reload the aliases.


## How to use

- Run the script typing `n` in bash.
- Navigate with arrow keys.
- Press ENTER key to access a directory.
- Press ENTER key to open a file with the associated application.
- Press ESC key to exit the script. Your new current directory is the last directory visited while using Navigator.
- Start typing to fuzzy search the current list of directories and files.
DocArray, an Inclusive and Standard Multimodal Data Model
Tags: github, opensource, machinelearning
Published: 2022-11-25 16:00:35

November is a big time for Jina AI. From this month, [DocArray](https://github.com/docarray/docarray) will be hosted under the Linux Foundation AI & Data - a neutral home to build and support an open AI and data community. This is the start of a new day for DocArray.

In the ten months since DocArray's first release, we've seen more and more adoption and contributions from the open-source community. Today DocArray has over 150,000 downloads per month and powers hundreds of multimodal AI applications. At Jina AI, we're committed to delivering a powerful and easy-to-use tool for deep-learning engineers to represent, embed, search, store, and transfer multimodal data. But now we're sharing this commitment with you, our community and industry partners. Together with LF AI & Data, we're bringing together companies and individual contributors to build a neutral, inclusive and common standard multimodal data model. By donating DocArray to LF AI, we're letting it spread its wings and fly.

**What does it mean to host a project at LF?**
In this post we'll review the history of DocArray and unveil our future roadmap. In particular, we'll demonstrate some cool features that we're already developing and will roll out in an upcoming release.
**
A Brief History of DocArray**
We introduced the concept of "DocArray" in Jina 0.8 in late 2020. It was the jina.types module, intending to complete neural search design patterns by clarifying low-level data representation in Jina. Rather than working with Protobuf directly, the new Document class offered a simpler and safer high-level API to represent multimodal data.

If you are interested in knowing more, please check [here](https://jina.ai/news/donate-docarray-lf-for-inclusive-standard-multimodal-data-model/).
RestAPI
Published: 2022-11-25 16:00:31

NAME: Bagus Raffi Santoso
NIM: A11.2021.1310
<?php

$file_db = "kospakbudi.db";

try {
    $pdo = new PDO("sqlite:$file_db");
    $pdo ->setAttribute(PDO::ATTR_ERRMODE, PDO:: ERRMODE_EXCEPTION);
    $pdo ->setAttribute(PDO::ATTR_EMULATE_PREPARES, false);

    $sql_create = "CREATE TABLE IF NOT EXISTS 'KOS_PAK_BUDI' (
        'id' integer NOT NULL PRIMARY KEY AUTOINCREMENT,
        'username' text NOT NULL,
        'password' text NOT NULL,
        'created_at' datetime NOT NULL DEFAULT CURRENT_TIMESTAMP)";
    $pdo -> exec($sql_create);
}
catch(PDOException $e){
    throw new PDOException($e->getMessage(), (int)$e->getCode());
}

header ('Content-Type: application/json');

if ($_SERVER['REQUEST_METHOD']=='GET') {
    $query = 'select * from kospakbudi order by created_at desc';
    $stmt = $pdo->prepare($query);
    $stmt ->execute();
    $data = $stmt->fetchALL(PDO::FETCH_ASSOC);
    echo json_encode($data);
} elseif ($_SERVER['REQUEST_METHOD']=='POST'){
    $username = $_POST['username'];
    $query = "insert into kospakbudi (username, password) values (?, ?)";
    $stmt = $pdo->prepare($query);
    $res = $stmt->execute([$username, $password]);
    if($res) {
        $data = ['username'=>$username,'password'=>$password];
        echo json_encode($data);
    } else {
        echo json_encode(['error'=>$stmt->errorCode()]);
    }
}   
 elseif ($_SERVER['REQUEST_METHOD'] === 'DELETE') {
    $id = $_GET['id'];
    $query = "delete from kospakbudi whre id = ?";
    $stmt = $pdo->prepare($query);
    $res = $stmt->execute([$id]);
    if($res) {
        $data = ['id'==$id];
        echo json_encode($data);
    } else {
        echo json_encode(['error'=>$stmt->errorCode()]);
    }
}
Você sabe o que significa AppSec?
Published: 2022-11-25 15:51:17

Sempre estou falando de AppSec por aqui, mas afinal, você sabe o que significa esse termo?

Pensando nisso, criei esse material resumido para explicar melhor sobre esse domínio de conhecimento.

## Softwares podem ter falhas

Atualmente, o mundo gira em torno de aplicações web e mobile para a realização de todo tipo de tarefas, como transações bancárias e compras online. 

Qualquer uma dessas aplicações podem conter lacunas ou vulnerabilidades que permitem que invasores possam expor dados ou acessar as funcionalidades de sistemas, impactando a todos.

## AppSec para construção de aplicações seguras

Nesse sentido, AppSec é o nome que se dá ao processo de construir, lançar e manter aplicações seguras – sempre por meio das melhores práticas aplicadas ao desenvolvimento.

Ao contrário do que muitos pensam, segurança de aplicações não se resume apenas a testes, mas a um processo.

## AppSec faz parte da Cibersegurança

Em muitas comunidades, tem sido comum devs confundirem a Segurança de Aplicações com questões que envolvem o vasto campo da cibersegurança.

Entretanto, AppSec é apenas um dos domínios do campo da Cibersegurança.

“Cibersegurança é o conjunto de tecnologias, processos e práticas projetadas para proteger redes, computadores, programas e dados contra ataques, danos ou acesso não autorizado”.

## Quando surgiu AppSec?

Esse processo surgiu junto com as próprias aplicações, mas de forma bem mais simples do que atualmente.

Ao decorrer da Segunda Guerra Mundial, o primeiro grande ataque “hacker” aconteceu, trazendo a preocupação da segurança.

Em 2001, foi fundada a OWASP (Open Web Application Security Project), instituição que lidera muitos dos padrões de AppSec. 

Nesse mesmo período, surgiram as primeiras empresas focadas em AppSec como a Conviso.


## O futuro da Segurança de Aplicações

A cultura DevOps e a rápida adoção e migração da computação em nuvem refletem como desenvolvedores precisam enviar código mais rápido do que nunca.  

É preciso trazer a Segurança de Aplicações para o início do ciclo de desenvolvimento (Shift-Left), tornando desenvolvedores a primeira linha de defesa, colocando conhecimento sobre Desenvolvimento Seguro e as ferramentas certas em suas mãos.

O futuro da Segurança de Aplicações é Dev First.

## Quer saber mais sobre AppSec?

Acesse os nossos canais e fique atualizado com os principais tópicos sobre Segurança de Aplicações

Canal do Youtube da Conviso: https://www.youtube.com/@ConvisoAppSecurity

Podcast "AppSec to Go": https://open.spotify.com/show/3bsns2k5Td7WmfTItH8Kev

Blog da Conviso: https://blog.convisoappsec.com/

Referência: https://bit.ly/3U7ztQj
REST API
Published: 2022-11-25 15:50:01

```
<?php

$file_db = "sosmed.db";

try {
    $pdo = new PDO("sqlite:$file_db");
    $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
    $pdo->setAttribute(PDO::ATTR_EMULATE_PREPARES, false);

    $sql_create = "CREATE TABLE IF NOT EXISTS `sosmed`(
        `id` integer NOT NULL PRIMARY KEY AUTOINCREMENT,
        `nama` text NOT NULL, 
        `konten` text NOT NULL,
        `created_at` datetime NOT NULL DEFAULT CURRENT_TIMESTAMP)";
    $pdo->exec($sql_create);
} catch (PDOException $e) {
    throw new PDOException($e->getMessage(), (int)$e->getCode());
}

header('Content-Type: application/json');

/** 
 * Method REST:
 * 
 * - GET: untuk mendapatkan data dari server
 * - POST: untuk menginputkan data baru
 * - PUT: untuk mengupdate data yang sudah ada
 * - DELETE: untuk menghapus data
 * 
*/

if ($_SERVER['REQUEST_METHOD'] === 'GET') {
    # untuk mengakses data dari server
    $query = 'select * from sosmed order by created_at desc';
    $stmt = $pdo->prepare($query);
    $stmt->execute();
    $data = $stmt->fetchAll(PDO::FETCH_ASSOC);
    echo json_encode($data);
} elseif ($_SERVER['REQUEST_METHOD'] === 'POST') {
    # untuk menambahkan data baru dari server
    $nama = $_POST['nama'];
    $konten = $_POST['konten'];
    $query = "insert into sosmed (nama, konten) values (?, ?)";
    $stmt = $pdo->prepare($query);
    $res = $stmt->execute([$nama, $konten]);
    if ($res){
        $data = ['nama'=>$nama, 'konten'=>$konten];
        echo json_encode($data);
    } else {
        echo json_encode(['error'=>$stmt->errorCode()]);
    }
} elseif ($_SERVER['REQUEST_METHOD'] === 'DELETE') {
    # untuk menghapus data dari server
    $id = $_GET['id'];
    $query = "delete from sosmed where id = ?";
    $stmt = $pdo->prepare($query);
    $res = $stmt->execute([$id]);
    if ($res){
        $data = ['id'=>$id];
        echo json_encode($data);
    } else {
        echo json_encode(['error'=>$stmt->errorCode()]);
    }
}
```
microservice and monolithic architectures.
Published: 2022-11-25 15:48:05

Before microservices, let's see what a monolithic architecture is.

A monolithic architecture is like a huge container within which all software components of an application are assembled, and all the components share a same database.


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


#### 👍 advantages of monolithic architecture: 

- easy deployment.
- easier to develop.
- end to end testing can be performed faster.
- easy debugging.

#### 👎 Disadvantages of monolithic architecture: 

- Scalability: Individual components cannot be scaled.
- Reliability: if one feature goes down, the entire system goes down
- Adoption of technology is restricted.
- Lack of flexibility.

## 🚀 Microservice architecture

A microservices architecture is an architectural solution that is based on a collection of independently deployable services. These services have their own business logic and database, and they serve a specialised purpose.


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

#### 👍 Advantages of Microservices

- Flexible scaling
- Continuous deployment: frequent and faster release cycles.
- Highly maintainable and testable.
- Independently deployable.
- High reliability: one failure does not bring down the entire application.

#### 👎 Disadvantages of Microservices

- Difficult to manage a large number of services.
- Each microservice has its own set of logs, making debugging more difficult.

### Components of Microservices Architecture:

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

🔵 Identity Provider:  These client requests are subsequently forwarded to identity providers, who authenticate the requests and relay them to API Gateway. The queries are subsequently routed to internal services using a well-defined API Gateway.

🔵 Static Content. Following internal communication, the Microservices distribute static material to a cloud-based storage service that may provide it directly to clients via Content Delivery Networks (CDNs).

🔵 Management: This component is responsible for balancing the services on nodes and identifying failures.

🔵 Service Discovery: it keeps a list of services on which nodes are situated, it acts as a guide for Microservices to discover the path of communication between them.

#### Follow me on [twitter](https://twitter.com/shubhztwt)
Resources for learning about and debugging issues with delayed/undelivered push notifications sent via FCM/Firebase
Tags: firebase, fcm, notes
Published: 2022-11-25 15:47:32

---
title: Resources for learning about and debugging issues with delayed/undelivered push notifications sent via FCM/Firebase
published: true
description: Resources for learning about and debugging issues with delayed/undelivered push notifications sent via FCM/Firebase
tags: firebase, fcm, notes
# cover_image: https://direct_url_to_image.jpg
# Use a ratio of 100:42 for best results.
# published_at: 2022-11-25 15:32 +0000
---

Background: 
1. [Why your chat notifications might go undelivered, & what you can do about it](https://www.cometchat.com/blog/chat-push-notification-deliverability)
2. [FCM Architectural Overview](https://firebase.google.com/docs/cloud-messaging/fcm-architecture)
3. [Reasons an FCM notification can be delayed](https://gist.github.com/gdeglin/98aeda28035b45cef04bb6c2cb41a4aa)
4. [Understanding FCM message, delivery priorities, quotas, limits](https://firebase.google.com/docs/cloud-messaging/concept-options)
5. [Firebase FCM Usage Limits](https://stackoverflow.com/questions/37961625/firebase-fcm-usage-limits)
6. [How to get better insight into push notification delivery](https://firebase.blog/posts/2021/10/push-notification-delivery-insights/)
7. [Life of a message from FCM to the device](https://firebase.blog/posts/2019/02/life-of-a-message)

Tools, metrics and reports: 
1. [Understanding message delivery: Message delivery reports, Aggregated delivery data via the FCM Data API and BigQuery data export](https://firebase.google.com/docs/cloud-messaging/understand-delivery?hl=da&platform=android)
2. [Firebase push notifications troubleshooter](https://firebase.google.com/support/troubleshooter/fcm)
3. [Aggregated delivery data API](https://firebase.google.com/docs/reference/fcmdata/rest/v1beta1/projects.androidApps.deliveryData/list?hl=da)
4. [More about aggregated delivery data API](https://medium.com/firebase-developers/what-is-fcm-aggregated-delivery-data-d6d68396b83b)