teleren/devto huggingface dataset:
Debug Next-js application running on Chrome on your android device from your laptop/desktop using Chrome DevTools
Tags: debugging, android, devtools, webdev
Published: 2022-07-21 19:53:55

## For Mac only

1. Get your local IP by running this command in your terminal: 

        ipconfig getifaddr en0
_Your local IP will look something like this - 192.168.1.5_
2. Paste that local IP in the following command and run it: 

        npm run dev -- -H 192.168.1.5  
_by default next application runs on port 3000_ 
3. Now open this following URL on the chrome browser of your android device: 
        http://192.168.1.5:3000
_Make sure your android device and development machine are connected to the same wifi network_
4. Go to the following doc provided by Chrome and setup remote debugging on your android phone: 
        https://developer.chrome.com/docs/devtools/remote-debugging/
5. Voila, you will be able to inspect the android chrome session mentioned in step 3 on your development machine. 
6. Happy Debugging!
Redefining Motivation. Redefining Myself.
Published: 2022-07-21 19:47:00

## Introduction 
Honestly it has been a very hard time for me in general. As someone who's not only struggling to find place in the tech industry, but in the world. I don't necessarily have an agenda writing this blog post, but I want to keep it genuine as possible so I guess it works out.

## Who...
I am someone trying to break into tech as a web developer. I express my creativity and solve problems big or small through web technology. I am a web developer! 
```js
const dev = {
who: "Andrew Kal"
};
```

## What...
I am someone who is trying to code. I spend many hours learning, reviewing, revamping, debugging, and writing code. I write code! 
```js
const dev = {
who: "Andrew Kal",
code: "Hello, World",
what: function() {
return this.code;
}
};
```

## When...
I am someone who likes to push things off the later so I don't have to deal with the intrinsic/emotional struggles (applying to jobs or starting a coding challenge). I have the ability to take a deep breath and shut out the noise and just work. I won't hesitate or self doubt, I will be nice to myself and forgiving. 
```js
const dev = {
who: "Andrew Kal",
code: "Hello, World",
what: function() {
return this.code;
},
when: "Just do it! Also don't neglect yourself!",
why: "I genuinely enjoy coding"
};
```

## Why...
I am someone who knows I want to code for a career, but I am unsure if I am qualified. I have the foundations from relentless hours of coding, I have the skills from doing many projects, and I have the support and network to become a professional. I can get a job! 
```js
const dev = {
who: "Andrew Kal",
code: "Hello, World",
what: function() {
return this.code;
},
when: "Just do it! Also don't neglect yourself!",
why: "I genuinely enjoy coding"
};
```

##How...
I am someone who doesn't know how to do it. I can efficiently problem solve and utilize resources. I can Google it~ 
```js
const dev = {
who: "Andrew Kal",
code: "Hello, World",
what: function() {
return this.code;
},
when: "Just do it! Also don't neglect yourself!",
why: "I genuinely enjoy coding",
how: "Google it~"
};
```
JavaScript struggles - part 6 | truthy & falsy values
Tags: javascript, webdev, beginners
Published: 2022-07-21 19:10:00

When we use most of programming languages or scripting languages we have some values that <u>isn't</u> a boolean valaue but it works as so.  
We mostly call it truthy & falsy values.

## Content table

- [Truthy values](#thruthy)
- [falsy](#falsy)

## Truthy Values <a name="#truthy"></a>
Personally I like to think of truthy values as a variable that have an actual value in it.

Sort of messy?
Think of it like that: 
- A value that isn't empty is a valuable value, but when it's empty it's <u>not</u>.

Let's see some examples
###### We'll use the `!!` keyword to turn the value into boolean value t check what is the output.


### String
```js
console.log(!!"Hello"); // true

let text = "Hi there";
console.log(!!text); // true
```


### Number
```js
console.log(!!18); // true

let num = 88;
console.log(!!num);
```


### Other
Any object (`{}`) or Array (`[]`) are truthy values, <u>even if they were empty</u>!!
So be aware if you want to use an object or array for storing, you have to get the values inside of the array or object. 

---

## Falsy Values <a name-"#falsy"></a>
A falsy value is the opposite of the truthy values.

### String
```js
console.log(!!""); // false
```


### Number
```js
console.log(!!0); // false

console.log(!!NaN); // false
```
###### To know more about NaN check out the [article about numbers](https://dev.to/abdelrahman_dwedar/javascript-struggles-part-2-numbers-4f2l)


### Other

The `null` object is also falsy value.
```js
console.log(!!null); // false
```

---

## Use Cases

There's of cause some amazing use cases of knowing this, you can stop a process if the value wasn't a number like so, as if you turned a text into number it turn into `NaN` and it's a falsy value.

```js
if (inputValue) {
  ... // Actions
}
```

---

<h3 align="center">Thanks for reading I hope you gain new things out of this article :smile:</h3>
Code reuse with Jenkins Shared Libraries
Published: 2022-07-21 18:51:59

Building pipelines for multiple projects, specially in a distributed architecture such as microservices, is more than normal in nowadays.

One thing that can come up when you are managing multiple pipelines for different projects, is that you might have similar code that needs to run across all jobs. And you don't want to update one by one.

For example, you could have a common function to:
- create git tags
- send Slack notifications
- run a tool to generate a report or scan for vulnerabilities

Jenkins gives the possibility to create a Shared Library that can be imported and reused across multiple jobs to avoid code duplication or silly maintenance.

Here are the steps you need to make use of that in your CI/CD with Jenkins:

1. create a repository to keep your shared library / common functions. see https://github.com/rodrigocprates/jenkins-shared-library

2. setup the Shared Library through Jenkins configurations (/configure)

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


3. update your Jenkinsfile to make use of it

```
@Library('jenkins-shared-library') _ // loads all library functions

stage('Demo') {
  common.sayHello("Rodrigo") // references 'common' as library 'common.groovy'
}

```

Whenever your job is triggered, it will:
- clone this shared library repo (with most updated code)
- import the functions
- run whatever function you call in your pipeline


## Conclusions

Easy and straight to the point!
Here's the repo: https://github.com/rodrigocprates/jenkins-shared-library
Dica de boas práticas: Conventional Commits
Published: 2022-07-21 18:42:00

E lá vai mais uma dica sobre Commits! 

Enquanto estudava um pouco sobre boas práticas em commits, acabei me deparando com o Conventional Commits e não pude deixar de compartilhar com vocês!

Conventional Commits é uma convenção simples para utilizar nas nossas mensagens de commits. 

A ideia é que a mensagem de commit tenha a seguinte estrutura:
<tipo>[escopo opcional]: <descrição>

Além disso, podemos adicionar um corpo e rodapé, mas isto também é opcional!

A seguir, trago uma lista e alguns exemplos de uso da convenção:

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

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

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

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

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

Você pode ler mais sobre Conventional Commits [clicando aqui](https://www.conventionalcommits.org/pt-br/v1.0.0/)
GITMOJI: Aprenda a categorizar seus commits
Published: 2022-07-21 18:36:00

Você está aprendendo versionamento de código mas ainda não encontrou uma forma de organizar e padronizar seus commits? 

Conheça os Gitmojis e saiba como usá-los para otimizar a navegação dentro do seu histórico de commits! 

Existem inúmeros benefícios em utilizar Gitmojis: 

• Categorizar: é possível bater o olho no seu histórico de commits e encontrar em qual deles aquele bug foi resolvido! 

• Reduzir a mensagem do commit: uma imagem fala mais que mil palavras!

• Ambiente amigável: o histórico fica mais convidativo para novos colaboradores! 

Abaixo, você pode visualizar alguns dos Gitmojis mais utilizados:


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

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

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

Além desses, temos também:

:art: melhorando a estrutura do código 
:zap: melhorando a performance
:fire: removendo arquivos ou códigos
:ambulance: corrigindo crítica
:lock: corrigindo problemas de segurança 
:lipstick: atualizando UI e arquivos de estilo
:construction: trabalho em progresso
:hammer: refatorando código 
:wrench: alterando arquivos de configuração 
:memo: escrevendo documentações 
:rocket: fazendo deploy
:white_check_mark: adicionando testes
:arrow_up: atualizando dependências 
:arrow_down: baixando dependências
:heavy_plus_sign: adicionando dependência
:heavy_minus_sign: removendo dependência
I made a social website dedicated to web code
Tags: webdev, javascript, css, showdev
Published: 2022-07-21 17:54:00

[CodeRoad](https://coderoad.org) is a new platform focused on sharing and exploring web code snippets made with simple HTML, CSS and JavaScript.

It is based on Instagram, but with the added value of code, which makes it more interactive and engaging than pure images and gives you the opportunity to practice your coding skills in a convenient, enjoyable way.

There is a built-in editor on the website in which you can edit any code you like. It is possible to download the app as a PWA to provide you with the easiest native experience.

Because we're just starting, there is very little content, but if you like the idea, you can still use the site as convenient way to publish your mini projects and experimentations, while sharing it with the community and helping us grow.

If you're interested, the link is here: [coderoad.org](https://coderoad.org)
Let me know what you think about this idea!
Tenable Providing Nessus Security Checks for AlmaLinux
Tags: tenable, security, almalinux, opensource
Published: 2022-07-21 17:51:58

[Tenable provides coverage of AlmaLinux](https://www.tenable.com/plugins/nessus/families/Alma%20Linux%20Local%20Security%20Checks) with the addition of a new Nessus plugin family. The plugin has been released to cover all existing advisories for AlmaLinux.

Nessus is one of the world’s most popular and deployed proprietary vulnerability scanners developed by Tenable. The security checks information is free and available immediately.

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

As information about new vulnerabilities is discovered and released publicly, The AlmaLinux team updates our errata and OVAL feeds. We’ve been working with the Tenable Research team to help them ingest and utilize those feeds in order to design programs to detect them. These programs are named plugins and are written in the Nessus Attack Scripting Language (NASL). The plugins contain vulnerability information, a simplified set of remediation actions and the algorithm to test for the presence of the security issue.

“Security is a critical piece of sysadmin and hosting functions, and Tenable is helping make sure that information about vulnerabilities is quickly available. Getting access to timing information is critical to understanding and fixing security issues, and we’re pleased that Tenable is providing this valuable tool publicly,” said Jonathan Wright, Infrastructure Lead for AlmaLinux. “We are continuing to work closely with Tenable’s teams to continue to monitor and improve these services that help AlmaLinux users.”

Customers now have the ability to scan AlmaLinux systems using policies that include Linux security checks. Coverage details for the new AlmaLinux plugin is available on the plugin pages for [AlmaLinux](https://www.tenable.com/plugins/nessus/families/Alma%20Linux%20Local%20Security%20Checks).
Watching Beanstalk Fundraising with Sort
Published: 2022-07-21 17:51:35

[Beanstalk](https://bean.money/) is working to build the world's best stablecoin, as the Beanstalk [guide mentions](https://docs.bean.money/), Beanstalk is:

_A stablecoin that (1) prioritizes decentralization, (2) does not require collateral, and (3) organically trends toward more liquidity and stability over time, will unlock the potential of DeFi_

Unfortunately, in April of 2022, [Beanstalk funds were stolen](https://halborn.com/explained-the-beanstalk-hack-april-2022/) through a governance exploit. Having one of the strongest communities in crypto, Beanstalk started a fundraising event called the ["Barn Raise"](https://bean.money/blog/path-forward) to recapitalize the protocol.

We'll use [Sort](https://sort.xyz) to track [Barn Raise](https://bean.money/blog/path-forward) progress, and even export results to a spreadsheet.

##Craft a Sort query for the Beanstalk Barn Raise

```
select
  transaction_hash as tx,
  transaction_from as from_address,
  timestamp,
  CAST(l.params [5].value as integer) as amount,
  CASE
    WHEN transaction_value_eth > 0 THEN 'ETH'
    ELSE 'USDC'
  END AS currency
from
  ethereum.transaction_log l
where
  l.transaction_to IN (
    '0x402c84de2ce49af88f5e2ef3710ff89bfed36cb6',
    '0x735cab9b02fd153174763958ffb4e0a971dd7f29'
  )
  and l.name = 'TransferSingle'
order by
  timestamp desc
limit
  1000
```

[View query results here](https://sort.xyz/query/62d9720ad594d46c3ce8b2f2)

##View a total for the fundraise

```
select
  SUM(CAST(l.params [5].value as integer)) as amount,
from
  ethereum.transaction_log l
where
  l.transaction_to IN (
    '0x402c84de2ce49af88f5e2ef3710ff89bfed36cb6',
    '0x735cab9b02fd153174763958ffb4e0a971dd7f29'
  )
  and l.name = 'TransferSingle'
```

[View query results here](https://sort.xyz/query/62d972e3d594d46c3ce8b2f6)
Do you know what web scraping is?
Tags: python, webscraping, programming
Published: 2022-07-21 17:41:00

Simply put, web scraping is the way to extract data from the internet in a structured format.

The internet is undoubtedly full of information, but it is merely structured. For any project which needs data, the format is fundamental. Some might need Excel, some require CSV format, and some need JSON format for use as an API. So, for that reason, web scraping is needed.

How does web scraping work?
A scraper will download the HTML of a page on requests and save entire data or some selected data in a file used for the project.

Which scraping tool is the best?
There is no best scraping tool. All tools are required in different situations. Each website is unique and has its challenge when scraping. Depending on the complexity of the scraping project, the tool selection varies. However, some tools are available like #python packages, no-code tools, browser extensions, e.t.c.

------------------------------------------------------------------
IF YOU LIKE THIS POST, PLEASE HIT THE HEART ICON ON LEFT.
How to remove element from array in PHP?
Tags: beginners, webdev, tutorial, php
Published: 2022-07-21 17:37:48

There are two ways to [remove an element from the array in PHP](https://phperrorcode.com/how-to-remove-element-from-array-in-php/).

1. Unset() Method
2. Array_splice() Method

## Unset() Method

The [unset() method](https://phperrorcode.com/how-to-remove-element-from-array-in-php/) is a built-in function in PHP that is used to remove or unset a single element from the array. Check out the syntax.

### Example 

```
<?php

  $arr = array("john","mark", "noah", "peter");
  unset($arr[2]);
  print_r($arr);

?>
```
**Output**

`Array (
 [0] => jhon 
 [1] => mark
 [3] => peter 
) `

## Array_splice() Method

The [array_splice](https://phperrorcode.com/how-to-remove-element-from-array-in-php/) function is used when you want to delete or remove or replace an element from the array.

### Example 

```
<?php

 $top = ["a"=> "AI", "b"=>"Programming", "c"=>"Python", 
 "d"=> "PHP"];
 array_splice($top, 2, 1);
 echo "<pre>";
 print_r($top);
 echo "</pre>";

?>
```

**Output**

`Array
(
    [a] => AI
    [b] => programming
    [d] => php
)`

## Conclusion

In this tutorial, we discussed the two most helpful methods for removing an element from the array in PHP.

### Suggested Articles

- [PHP array_merge](https://phperrorcode.com/array-merge-function-in-php/)
- [PHP Array Length](https://phperrorcode.com/array_length-function-in-php/)
PHP array_values
Tags: webdev, php, tutorial, programming
Published: 2022-07-21 17:29:05

It is an in-built function in PHP that is used to show element values of a given array in a new array. [PHP array_values ](https://phperrorcode.com/array-values-function-is-php/)function creates a new array in which it stores only values of elements from a given array and by default gives the numerical keys to every single value.

## Example

```
<?php

$arr=array("Name"=>"warner","Age"=>"24","Country"=>"USA");

echo "<pre>";

print_r(array_values($arr));

echo "</pre>";

?>
```

**Output**
`Array
(
    [0] => Ali
    [1] => 20
    [2] => Pakistan
)`

Now you can see a new array has been created and only values are showing in it.

## Conclusion 
In this tutorial, we learned about the array_values function, see the definition, and then discuss a example. You can also learn 

### Suggested Articles

- [PHP array_push](https://phperrorcode.com/array-push-function-in-php/)

- [PHP array_map](https://phperrorcode.com/array_map_in_php/)
Share Data Table Examples Cucumber across the Scenarios or Files
Tags: cucumber, webdev, testing, typescript
Published: 2022-07-21 17:23:00

I Folks!! 

I use the cucumber with the cypress and I want run the same scenario multiple times for multiple viewports. I already build a scenario outline with the data table examples. But I don't found a way to avoid rewrite the same data table in all scenarios.

Do you know if exist any way to export this data table from another folder or share the same data table in all scenarios in a same feature file?
Longest Consecutive Sequence
Tags: leetcode, algorithms, java
Published: 2022-07-21 17:17:00

**Leetcode Problem:** [Longest Consecutive Sequence](https://leetcode.com/problems/longest-consecutive-sequence/)

**Objective:**

Given an unsorted array of integers nums, return the length of the longest consecutive elements sequence.

You must write an algorithm that runs in O(n) time.

---
**Pattern: Arrays and Hashing**

---
**Approach:** 

1. Create a set to store the elements.
2. Get the start of the sequence. The start of a sequence does not have a left neighbor. 
3. Once we identify a start of a sequence, we can check if the next value exists in the set.
4. Keep track of the length of the sequence. 
5. Return the max length. 

---
**Big-O Notation:** 

Time Complexity: O(n) 
We have iterate n times for each element. 

Space Complexity: O(n)
We use a Set data structures to store n elements. 

---
**Code:**

```java
class Solution {
    public int longestConsecutive(int[] nums) {
        // use hashset to store n values
        Set <Integer> hashSet = new HashSet<>();
        
        // maxLength to keep track of longest consecutive sequence 
        int maxLength = Integer.MIN_VALUE;
        
        // edge case 
        if (nums.length == 0 || nums.length == 1){
            return nums.length;
        }
        
        // add all elements into hashset 
        for(int i : nums){
            hashSet.add(i);
        }
        
        // get the first sequence 
        for(int curr : nums){
            // does left exist in hashMap
            // if it does not then it is the start of a sequence 
            if(!hashSet.contains(curr - 1)){
                int count = 1; 
                boolean flag = true;
                while(flag == true){
                    if(hashSet.contains(curr + 1)){
                        count++;
                        curr++;
                    } else {
                        flag = false;
                    }
                    maxLength = Math.max(maxLength, count);
                }
            }
        }
        return maxLength;
    }
}
```
Typesafe multiple return types based on parameter value with Typescript.
Tags: typescript, magic
Published: 2022-07-21 17:16:00

Typescipt types and runtime values are two separate levels, basically writing typescript conditions based on values is not supported, but there is a solution.

What I would like to achieve is the following: A function return type changes based on the value entered in the function parameter.

```typescript
function getUsers(withPagination: boolean): IUser[] | IPaginatedUsers { 
  // ... 
  return users; 
}
```

The purpose of this function is to return users from an api, if withPagination is true then it wraps the user array in pagination, if false then only the user array is returned (just an example).

The problem is that runtime reveals the return value based on the "withPagination" variable the return value is not specific, but we know what it will be, it can cause some headache.

One solution would be to specify the return value generically, but that is not very convenient and can be messed up. The other solution is to create two separate functions, which in this case might be better but it can cause code duplication.

```typescript
function getUsers(): IUser[] { 
  // ... 
  return users; 
}

function getUserswithPagination(): IPaginatedUsers { 
  // ... 
  return users; 
}

```

If we want to keep it together and implement 2 or more different returns in a typesafe way, then you can do it this way:

```typescript
interface IUser {
    name: string,
    age: number,
}

interface IPaginated<T> {
    data: T[],
    meta: {
        page: number,
        limit: number,
        totalPages: number
    }
}

interface IResponseOptions {
    withPagination: boolean
}

const DEFAULT_RESPONSE_OPTION = {
    withPagination: true
}

type UserResultType<T extends IResponseOptions> = T extends {
    withPagination: true
} ? IPaginated<IUser> : IUser[];


function getUsers<T extends IResponseOptions>(withPagination: T = DEFAULT_RESPONSE_OPTION as any): UserResultType<T> { 
  // fetch data..
  return "something" as any as UserResultType<T>; 
}



getUsers({withPagination: true}); // return IPaginated<IUser>
getUsers({withPagination: false}); // return IUser[];
getUsers(); // returns bsed on DEFAULT_RESPONSE_OPTION: IPaginated<IUser>


```