teleren/devto huggingface dataset:
5 Websites To Finish 💯 Complicated Stuff Quickly & Easily! 🚀
Tags: webdev, productivity, developers, programmer
Published: 2023-01-30 00:19:05



- As a developer, having the right tools is essential to ensuring that your projects are successful and efficient. 

- Developer tools can help developers create, debug, maintain and optimize applications for various platforms. 

- They provide an array of features that make development easier such as debugging capabilities, testing frameworks and code refactoring options. 

- Using the right developer toolkit is key to creating software in an effective manner with minimal bugs or errors in the final product.

- These tools can be used to automate tedious tasks like checking syntax errors or finding memory leaks which would otherwise take up valuable time while coding manually.

- Additionally they enable developers to quickly find solutions by providing access to online resources such as tutorials on how best use specific programming languages or libraries related information about common problems encountered when developing software applications.

- Finally it’s important for any serious developer working on complex projects with tight deadlines should consider using some form of integrated development environment (IDE). 

- IDE's offer many advantages over traditional text editors including autocomplete functionality , debugging support , version control integration and more .

- Having these features at one’s disposal will save countless hours spent searching through documentation trying figure out why certain lines of code aren't behaving correctly.

- Ultimately, this makes it much easier for developers focus their efforts where they needed most - writing clean well-structured code instead wasting time troubleshooting issues caused by incorrect formatting typos etc.   
 

### Dev_Tools

#### 5 Websites To Finish 💯 Complicated Stuff Quickly & Easily! 🚀

🎥 {% youtube yUJ6P-lseEA%}


#### Bonus

###### 7 websites that will change the way you write code🚀👩‍💻

🎥 {% youtube 8z1PJPtQ4qM%}



### Connect with Me 😊

#### 🔗 Links

[![linkedin](https://img.shields.io/badge/linkedin-0A66C2?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/mahmoud-el-kariouny-822719149/)

[![twitter](https://img.shields.io/badge/twitter-1DA1F2?style=for-the-badge&logo=twitter&logoColor=white)](https://twitter.com/Mahmoud42275)
How to use useRef with React Hook Form
Published: 2023-01-30 20:31:57

---
title: How to use useRef with React Hook Form
published: true
date: 2023-01-30 00:00:00 UTC
tags: 
canonical_url: https://blog.robertoconterosito.it/posts/use-ref-with-react-hook-form/
---

_Welcome back to my dev notes!_

Today I was in trouble for a while because I wanted to use a ref inside a React-Hook-Form form with an input of type `file` and I couldn’t do it.

The problem was quite simple, suppose you have a form like this:

```
const { register } = useFormContext();
const fileInputRef = useRef(null);
const handleClick = useCallback(() => {
 fileInputRef.current.click();
}, [fileInputRef]);
return (
 <>
   <input type="file" ref={fileInputRef} {...register("file")} />
   <button onClick={handleClick}>Upload</button>
 </>
);

```

And guess what? It didn’t work. The `fileInputRef` was `null` inside the `handleClick` function and I couldn’t understand why. After googling for a while I found the solution: you have to use the `register` method in a different way to make it work:

```
const { register } = useFormContext();
const { ref, ...inputProps } = register("file");
const fileInputRef = useRef(null);
const handleClick = useCallback(() => {
 fileInputRef.current.click();
}, [fileInputRef]);

return (
 <>
   <input
     type="file"
     ref={(e) => {
       fileInputRef.current = e;
       ref(e);
     }}
     {...inputProps}
   />
   <button onClick={handleClick}>Upload</button>
 </>
);

```

I hope this will help you if you are in trouble with refs and React Hook Form.

**Notes** : this is a dev note, not a tutorial. If you want to learn more about React Hook Form, check out the [official documentation](https://react-hook-form.com/).
Spark to Azure Data Lake Storage Gen1
Published: 2023-04-29 21:26:01

---
title: Spark to Azure Data Lake Storage Gen1
published: true
date: 2023-01-29 23:49:07 UTC
tags: 
canonical_url: https://mikestaszel.com/2023/01/30/spark-to-azure.html
---

This is another quick post for how to connect Spark to various platforms.

I used Azure Data Lake Storage on a project in the past and had a tough time figuring out what to do (there are huge differences between Azure Blob Storage, Azure Data Lake Gen1, and Azure Data Lake Gen2).

This guide assumes that you have a `client_id`, `tenant_id`, and `client_secret` from Azure.

### Code Example

```
# Acquire these JARs from Maven:
# azure-data-lake-store-sdk-2.3.10.jar
# hadoop-azure-datalake-3.2.3.jar
# wildfly-openssl-1.0.7.Final.jar
# place them in $SPARK_HOME/jars/

spark = SparkSession.builder.getOrCreate()
tenant_id = "some-identifier-here"
client_id = "some-identifier-here"
client_secret = "super-top-secret-here"

spark.conf.set("fs.adl.account.auth.type", "OAuth")
spark.conf.set("fs.adl.oauth2.refresh.url", f"https://login.microsoftonline.com/{tenant_id}/oauth2/token")
spark.conf.set("fs.adl.oauth2.client.id", client_id) spark.conf.set("fs.adl.oauth2.credential", client_secret)

# That's all there is to it:
df = spark.read.parquet("adl://something.azuredatalakestore.net/folder/")

```

Finding the correct JARs and Spark configurations was more than half the battle. Hopefully this post helps someone out in the future!
Scrimba's JavaScript Deep Dive - Part III
Published: 2023-01-29 23:27:05

Functions:
- define by `function `as key word
- a function will return `undefined `by default
- closure: how to remember values (or pass down)
- `toFixed`: return string, so we need to update the type
- we can also use default values (with equal in the declaration of arguments)
- we need to write functions think that arguments will not be correctly given
- arrow function don't need `function` key word, just `=>`. But by default they use implicit return (so we don't need the key word)
- higher order function: call an function in a function (all callbacks are higher order)
- arrow function need a variable storage the function
- functions can be thought like actions, so better to name them as verbs. Be explicit (it don't need to be short), but be consistent with the names you use (simple prefix are great!)

Object and Maps:
- We can create objects to organize, with keys (references)
- key don't need " 
- to use them `object.key`
- object are great for static information 
- object are collection of primitive (6 types: undefined, null, boolean, number, string, and symbol)
- object are not the equally to other (exactly the same) 
- object are passed as reference (not a copy), so if we are not careful, we can update both objects at once 
- dot notation is the most comfortable way to reach values
- we can destructured objects properties and make them into variables of the same name using `{ }`
- `Object.assign({}, obj1,obj2)` we should make a new object, to merge to previous objects. Or `...obj` to spread. For both, order matters, the last is the one that will be use.
- Maps: when key is not a string or symbol
Why WebStorm is the most productive IDE for JavaScript development
Tags: javascript, react, webdev
Published: 2023-01-29 23:01:52

Discover the Productivity Boost of WebStorm: The Ultimate IDE for JavaScript Development"

Do you want to take your JavaScript development to the next level? If so, then you need to check out WebStorm!

In this article by Aaron Janes, you'll learn why WebStorm is the most productive IDE for JavaScript development. From its intuitive user interface to its powerful features, WebStorm is designed to help developers work more efficiently and effectively.

One of the standout features of WebStorm is its support for modern JavaScript, including React and Angular. With built-in tools for debugging and testing, you can write, run, and debug your code in a single place, saving you time and effort.

Another great aspect of WebStorm is its integration with other tools, such as Git and npm. With just a few clicks, you can easily manage your code and packages, ensuring your projects stay organized and up-to-date.

Whether you're a beginner or an experienced developer, WebStorm will help you work faster and more efficiently. So, why wait? Head over to Aaron Janes' article now and discover the productivity boost of WebStorm for yourself!

Link: https://aaron-janes.medium.com/why-webstorm-is-the-most-productive-ide-for-javascript-development-3223918b197a
Get Started with Git: Understanding the Fundamentals
Tags: git, github, javascript, webdev
Published: 2023-01-29 23:00:42

Do you struggle to understand what Git is and how it works? Look no further! In this article by Aaron Janes, you'll get an introduction to Git and learn what it's all about.

Git is a version control system that allows you to manage your code and track changes. It's a crucial tool for software development, as it enables you to collaborate with others, roll back changes, and maintain a history of your code.

In the article, you'll discover the basics of Git, including how to create a repository, make commits, and work with branches. You'll also learn about some common Git commands and how to use them effectively.

Whether you're new to Git or just looking for a refresher, this article is a great starting point. Aaron Janes does a fantastic job of breaking down the concepts and making them easy to understand. So, what are you waiting for? Start reading now and master Git in no time!

Link: https://aaron-janes.medium.com/intro-to-git-what-the-heck-is-git-anyway-2b02e5dfaa13
Get started with React GraphQL App in few steps.
Published: 2023-01-29 22:52:14

1. Create a project using create-react-app.
2. Install the dependencies you would like to use in your App.
3. Define your GraphQL schema
-  defining schema it means you need to select the type of 
   data which you want to fetch. 

**How to define your schema**
In this case, I will make use of the code from my own project, however I will try by all means to make it super clear. Feel free to ask inthe comment section if you have any challenge in understanding the part of the code which I will share with you. in your `schema.js` file

```
type Country {
  name: String
  president: President
}

type President {
  name: String
  countries: [Country]
}
```

By doing this it means the type of data you want to see on the server side is the country's name and it's president's name too.
 After defining the schema you also need to :
4. Define your data set.
5. Define a resolver.
My son told me a joke :)
Tags: jokes, microsoft, blog
Published: 2023-01-29 22:50:04

Found it a bit amusing :)

> Gates and Allen started [Microsoft](https://helloacm.com/welcome-pack-swag-from-microsoft-research-cambridge/)—originally called Micro-Soft, for microprocessors and software—in order to produce software for the Altair 8800, an early personal computer

![385caf66772d57669f126638a96e727.png](https://cdn.steemitimages.com/DQmRCkD4oT3D94CYfii6JEdpf7N6ZAAhWBDk58i2chWJCM2/385caf66772d57669f126638a96e727.png)
A FLISoL é o maior evento de promoção do Linux na América Latina
Tags: linux, opensource
Published: 2023-01-29 22:37:32

Nos laboratórios das escolas públicas, nas instituições públicas de ensino superior, nas micro e pequenas empresas e nas casas de pessoas que não são desenvolvedoras, é comum que o sistema operacional instalado em desktops e laptops seja o Windows.

Mesmo com o fim do suporte oficial da Microsoft às versões do Windows XP e Windows 7, ainda há empresas rodando esses sistemas para uso em funções vitais do seu negócio. Outro ponto a observar é que muitos usuários domésticos e corporativos usam versões do Windows sem pagar pela licença, o famoso **_"pirata"_**.

Esses usuários põe seus dados e atividades em risco porque sempre viveram dentro de uma únicia experiência de cultura computacional, essa cultura da Microsoft e seu sistema operacional se impôs porque o software vem instalado de fábrica. E se tem algo que todo consumidor preza é a familiaridade de uso dos dispositivos.

Para impulsionar uma transformação nessa cultura computacional, pessoas e grupos de toda América-Latina com apoio de entidades educacionais e alguns patrinadores regionais, criaram a Feira Latino-Americana de Instalação do Software Livre (FLISoL), que tem com o objetivo a promoção do software livre, sua filosofa e avanços.

Pensado para um público amplo, que aborda de estudantes, profissionais dos setores públicos, privados e do terceiro setor, realizam em diversas localidades simultaneamente eventos para instalar voluntariameeente sistemas operacionais Unix Like, Linux ou BSD nas máquinas do público participante. Cada comunidade local define a distro ou distros que serão instaladas de acordo com o contexto do usuário.

O evento além de agregar um monte de novos conhecimentos aos participantes, propicia uma plataforma legal, segura, moderna e com a capacidade de dar mais performance a equipamentos mais antigos, devido a menor exigência de recursos como processador, RAM e espaço em disco necessário para instalação.

Para além da instalação ocorrem atividades nas perspectivas artísticas, acadêmicas, empresarial e social, com palestras, workshops, treinamentos com temas locais e do contexto latino-americano.

A FLISoL é realizada des 2005 e tem como referência o quarto sábado de abril todos os anos. Para saber mais visite a página do evento [https://flisol.info/Brasil](https://flisol.info/Brasil).

Na sua cidade o evento já foi realizado alguma vez? Que tal realizar uma primeira edição?
Understanding Javascript Scope
Tags: beginners, react, webdev, codenewbie
Published: 2023-01-29 22:07:52


![scope overview](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/syc66c0f5r9h1h65qzu2.png)
## What is scope
Scope in javascript refers to rules that guide where variables are stored and how variable look ups(reading variables) happen. We can take scope as a container where whatever details we put in cannot be accessed outside of the container, scope helps us hide details(values) that we don't want to be globally accessible in a file.

Before ES6 the smallest unit of scope was the function scope, we could group javascript scope into global and function scope. The introduction of `let` and `const` in ES6 helped introduce a new unit of scope **Block scope**. Whatever variables we define in the global scope are readily available anywhere in a file, this can easily lead to mistakenly overwriting variable values and sometimes hard to debug errors.

Function scope helped introduced the concept of local scope and hiding implementation details. Variables defined in a local scope are only available within that local scope and when we try to access those variables outside of their scope container, we get a reference error if that variable does not exist in the global scope.
![scope presentation](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o6pgkm6pzgmnjgg2xj2j.png)

Scopes can be nested, local scopes nested in other local scopes and finally enclosed by the global scope. When reading or assignng values to a variable in a function, the function scope would be checked first to see if that variable exists. In the case of reading a variable value, if it exists in the scope we use that value else the JS engine checks the enclosing scope(i.e goes up by a level), we get a reference error if that variable does not exist in any of the enclosing scopes. If we are not in strict mode and we try assigning a value to a variable that does not exist in the function scope, we go up by a level until we find the variable and if we evntually get to the global scope and still can't find the variable we automatically get one created for us in the global scope, else we get  reference error in strict mode.

![nested scopes](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yxtqxjma2hlijlg1gs75.png)

## Conclusion
I'll be writing a continuation of this article to explain block scope with more examples, this was meant to be a very short article that just helped break down javascript scope😅. please let me know if there is anything that confuses you as you read.

Things to note: 
`var` when not used in a function automatically creates a global scope variable.
`let` and `const` hijacks scopes and forcefully creates a block scope when used in forloops or other non function blocks.
The Types of Clients You’ll Get
Tags: freelancingtips, saas, freelancing, business
Published: 2023-01-29 22:09:01

---
title: The Types of Clients You’ll Get
published: true
date: 2023-01-29 22:04:04 UTC
tags: freelancingtips,saas,freelancing,business
canonical_url: https://bajcmartinez.medium.com/the-types-of-clients-youll-get-c2ecdbbab784
---

[![](https://cdn-images-1.medium.com/max/1920/1*WPAQxst1Bgq7ZJgy9Y9h7w.jpeg)](https://bajcmartinez.medium.com/the-types-of-clients-youll-get-c2ecdbbab784?source=rss-46b6f430560f------2)

Learn about the seven types of customers you may encounter in your professional life and how to work with them.

[Continue reading on Medium »](https://bajcmartinez.medium.com/the-types-of-clients-youll-get-c2ecdbbab784?source=rss-46b6f430560f------2)
Infrastructure as code - (When You Don't Know What The Heck Is It) Part 3
Tags: infrastructureascode, devops, automation, governance
Published: 2023-01-29 21:41:23

Infrastructure as Code (IAC) is a game-changing tech practice that codifies the underlying IT infrastructure as software. It has revolutionized how organizations manage their infrastructure by defining it as software. So far, this series of IAC blogs have discussed potential shortcomings, the intricacy associated with IAC, and how quickly it could escalate in [Part 1](https://dev.to/akshatkumar/infrastructure-as-code-when-you-dont-know-what-the-heck-is-it-39ml). However, we shared the benefits of IAC and how it can help organizations improve their infrastructure management in [Part 2](https://dev.to/akshatkumar/infrastructure-as-code-when-you-dont-know-what-the-heck-is-it-part-2-41mg). But as with any new technology or process, it's essential also to be aware of potential misconceptions and pitfalls that we will talk about today.

One of the biggest misconceptions about IAC is that it's a **one-time project**. But in reality, IAC is an ongoing process that requires regular maintenance and updates to ensure the infrastructure stays up-to-date and secure. Organizations that view IAC as a one-time project may not see the full benefits and could even run into issues with reliability and stability.

Another pitfall is focusing too heavily on automation without considering **governance**. Automation can significantly reduce the need for manual intervention and the risk of human errors. Still, it's also essential to have oversight and governance in place to ensure the infrastructure is secure and compliant. Organizations can run into security, compliance, and overall infrastructure management issues without proper administration.

**Testing** is also crucial when implementing IAC. Organizations must fully understand the importance of testing IAC scripts and the infrastructure they create to ensure everything is working as intended and identify and fix any issues. Without proper testing, organizations may run into reliability and stability issues.

It's also important to consider the impact of IAC on existing processes and to take the necessary steps to integrate it into the workflow. Organizations should invest in the essential resources, such as tools and training, to fully implement and maintain IAC. Securing **scalability and security** verifications are crucial aspects to consider when implementing IAC.

In conclusion, IAC is a powerful practice that can help organizations improve their infrastructure management and stay competitive. By understanding the ongoing nature of IAC, the importance of governance and testing, the impact on existing processes, the need for necessary resources, and the scalability and security, organizations can fully realize the benefits of IAC and avoid potential issues.
Distrowatch é o maior observatório Linux e BSD do mundo
Tags: linux, bsd
Published: 2023-01-29 21:27:18

Se você está chegando agora no mundo dos sistemas operacionais _**Unix Like**_, ou já possui experiência e quer saber mais sobre alguma distro específica, fazer um comparativo rápido sobre suas características e recursos, você deve conhecer a [Distrowatch](https://distrowatch.com).

A Distrowatch é um portal criado pela **Atea Ataroa** Limited em 2001, seu criador o eslovaco **Ladislav Bodnar**, construiu um observatório para **sistemas operacionis Linux e BSD**.

Esse espaço é exclusivamente dedicado a falar, revisar e manter atualizadas informações de 100 distribuições, com rankeamento de distros mais utilizadas nos últimos 20 anos.

Para quem está em dúvida sobre qual distro usar e deseja aderir aquela mais utilizada no momento vai verificar no ranking semanal, mensal ou trimestral. Para aqueles que querem distros utilizadas a mais tempo vai consultar o ranking semestral ou anual. Também é possível consultar individualmente o rankeamento de cada ano desde 2002. 

No site você encontra um print da tela principal do sistema, o tipo de ambiente, a arquitetura, se a versão está ativa ou foi descontinuada, link para download da iso, tempo de suporte, sistema de partição, utilitários embarcados, o gerenciador de pacotes e todos os detalhes relevantes sobre.
How to access index of an array while mapping in Flutter
Tags: flutter
Published: 2023-01-29 21:26:47

If you come from Javascript, like me, you were probably expecting that when mapping over an array you had access to the index of the item, like so:

```
myArray.map((item, index) => {
     // whatever
}
```

Well, the index in Dart is not available. So you will first have to convert the array to a map, with key-value pairs, like so:

```
myArray.asMap().entries.map((entry) {
    int idx = entry.key; // this is the index
    String val = entry.value;

    return whatever;
}
```

Don't forget to call `asMap`, like so: `asMap()`, and chain `entries`. If you need the outcome to be a Flutter `List`, you need to add the `toList()` at the end.

Kudos to [these](https://fireship.io/snippets/dart-how-to-get-the-index-on-array-loop-map/) folks for teaching me this. Dart docs [here](https://api.dart.dev/stable/2.2.0/dart-core/List/asMap.html).