teleren/devto huggingface dataset:
Introduction to Refine
Tags: reactframework, api, react, webdev
Published: 2022-10-31 20:51:14





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


## Introduction

### What is Refine?

Refine is a React Framework that makes it really easy to create CRUD Applications

### Why should you use refine?

- Really easy to setup
- Blazing fast to create an application
- Supports a ton of data providers
- SSR Support

## Integrations

Refine supports a lot of integrations:

UI Frameworks/Libraries: AntUI, MaterialUI, MantineUI
Data Providers: Supabase, Appwrite, Any REST API, Any GraphQL API, Hasura, Firebase, etc..
Frameworks: Next.js, Remix
Live Providers: Ably

You can checkout all the integrations they support right [here](https://refine.dev/integrations/)

## Setting Up Requirements for Refine

Refine Requires:

- Node `16.x`
- NPM `8.x`

You can download Node.js from https://nodejs.org/en/


## Conclusion

This ends this blog right here!

In the next blog of the refine series, We will be creating a app with refine using a UI Framework

Lastly, Don't forget to Leave a `LIKE` and key in your feedback in the comments!
Connect Git with SSH in Windows
Tags: git
Published: 2022-10-31 20:44:41

SSH is a  method to authenticate with a server like github, gitlab, without exposing your username and password so here is an easy way to set up ssh key in windows. SSH stands for Secure Shell and is a cryptographic protocol based on the concept of public-private keys.
**Generating an SSH key**
`ssh-keygen`

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/szy1fplf4b3zwc3nyinl.png)
You will be asked about the location where the keys should be stored, choose location to store files or hit enter to set default selected location.

Next, you will be asked to set a password to protect your private key or leave it empty double enter. Your public/private key pair has been generated.

Read the public key of generated file id_rsa.pub, or cmd: 
`cat /c/Users//besart/.ssh/id_rsa.pub hit enter. Copy public key and add to github => settings => ssh`

Done :)
Who here? Like I
Published: 2022-10-31 20:35:43

Who here? Like I, stayed up late night scrolling tumblr.com looking for meaningful/inspiring quotes with a Sunset gradient background.

Who here? Like I, watched a Pewdiepie Amnesia playthrough video before going to sleep, thinking that it won't keep me up at night.

Who here? Like I, played countless hours of Runescape just to never get back into the game that had me staying up till sunrise.

Who here? Like I, miss those days...
Validando Tipos e Dados em Python
Tags: python, beginners, tutorial, braziliandevs
Published: 2022-10-31 20:34:17

Podemos descobrir o tipo de uma variável usando a função `type()`, que nos permite então, verificar o tipo de variável que o algoritmo irá aceitar ou não.

Vamos ler uma variável que não está sendo convertida para inteiro, logo ela é uma string:
```py
x = input('Digite algo: ')
```
Em seguida, executamos a função `type()` dentro da função `print()`, para ser exibido na tela o tipo da variável `x`:

```py
print(type(x))
```
O resultado será:

```
<class 'str'>
```

## Validação básica

Segue uma breve validação de variável, caso ela não seja do tipo `int`, o código irá executar a condição programada:

```py
if type(x) != int:
    print('A variável não é do tipo inteiro')
```
## Validação avançada

Podemos obter muito mais informações de uma variável no programa, basta executar alguns dos métodos:

```py
#Contém apenas letras?
isalpha() 

#Contém apenas espaços?
isspace() 

#Contém apenas números?
isnumeric() 

#Contém apenas maiúsculas?
isupper() 

#Contém apenas minúsculas?
islower() 

#Contem apenas letras e números?
isalnum() 

#Primeira maiúscula e outras minúsculas?
istitle() 
```
O resultado retornado será `True` ou `False`.

Vamos executar os métodos com uma variável `y`:

```py
print('Apenas letras?', y.isalpha())

print('Somente espaços?', y.isspace())

print('Apenas números?', y.isnumeric()) 

print('Apenas maiúsculas?', y.isupper())

print('Apenas minúsculas?', y.islower())

print('Está capitalizada?', y.istitle())

print('Apenas letras e números', y.isalnum())
```
Teste inserir entradas diferentes, até entender completamente os conceitos de cada método.

## Na prática

Podemos, por exemplo, usar o método `isnumeric()` para validar um CPF. No qual o programa só irá prosseguir quando o usuário inserir apenas números.

Ou usar o método `istitle()` para verificar o campo Nome de um formulário. Caso o nome inserido não esteja com as letras iniciais em maiúsculo, podemos validar e até mesmo fazer as alterações necessárias na variável.
Ruby on Rails 7 with Ajax (axios)
Tags: rails, javascript, webdev
Published: 2022-10-30 22:02:30


Recently I was working with Ruby on Rails 7 and needed to do an API requests from javascript to my ROR backend. In the past I choose `[axios](https://github.com/axios/axios)` for that and still, I decided to use it (as I don't yet know Turbo).

The feature was to check if user exists in the DB from the modal.

After `./bin/importmap pin axios` and building the stimulus controller I got an error in a browser:

`TypeError: Cannot read properties of undefined (reading 
 'FormData   at index.js:162:32`

I started to google, and search on stackoverflow for the solution but could not find anything useful.

After few minutes ... without any success I just decided to experiment with different versions of `axios` and guess what...turns out that the version **0.27.2** was working as expected

After pinning the **version 0.27.2**
`./bin/importmap pin axios@0.27.2`

The AJAX request worked like charm! I'm sharing this here, as You might find it useful!

The longer read you can find on [medium](https://medium.com/@grzegorz.smajdor/ruby-on-rails-7-with-ajax-axios-8beb0a793d9c)

All the best!
Grzegorz
esbuild Ignore With Comments Plugin
Tags: esbuild, javascript, programming, node
Published: 2022-10-31 20:19:39

With the increasing popularity of full stack frameworks that combine server-side and client-side code, build tools need to support selectively including or ignoring files in a project.

When developing a framework for [React Serverless SSR Rendering](https://maxrohde.com/2022/10/16/serverless-react-ssr), I needed the capability to prevent certain code from being packaged up for the server or client. Specifically, server-side logic that required dependencies incompatible with client-side JavaScript (such as `fs`) would result in my client-side build to break.

While [esbuild](https://esbuild.github.io/) provides a number of tools to exclude certain files or dependencies, I found these insufficient for my needs and thus developed the [`esbuild-ignore-with-comments-plugin`](https://www.npmjs.com/package/esbuild-ignore-with-comments-plugin).

This plugin allows to add a comment as the following to a source file:

```typescript
/* esbuild-ignore */
```

All content in this file with subsequently be ignored by esbuild when the plugin is configured as follows:

```typescript
import ignorePlugin from 'esbuild-ignore-with-comments-plugin';
import { build } from 'esbuild';

await build({
  plugins: [ignorePlugin()],
});
```

It is further possible to support multiple esbuild build configurations over the same codebase by adding a qualifier to the comment, such as:

```typescript
/* esbuild-ignore ui */
```

Then files will be ignored in a build with the plugin configured as follows:

```typescript
await build({
  plugins: [ignorePlugin(['ui'])],
});
```

For instance, this plugin is used in the project React Server-Side Rendering ( [react-ssr](https://github.com/goldstack/react-ssr)) as follows:

- The file [`_document.ts`](https://github.com/goldstack/react-ssr/blob/246aa65733512d2cda08aa52f64ff34f03dfbfd0/packages/server-side-rendering-1/src/_document.ts) is only required during Server-Side rendering to assemble the HTML document. Thus, the comment `/* esbuild-ignore ui */` is added:

```typescript
/* esbuild-ignore ui */

import type { RenderDocumentProps } from '@goldstack/template-ssr';

const renderDocument = async (props: RenderDocumentProps<unknown>): Promise<string> => {
// ...
}
```

- The file [`build.ts`](https://github.com/goldstack/react-ssr/blob/9fcbe5204697546ec2b5268b637b0012a582eb17/packages/server-side-rendering-1/src/build.ts) is required only to define the configuration for esbuild itself. It does not need to be bundled for the client or server. Thus, comments to ignore this file for both server-side and client-side builds are provided:

```typescript
/* esbuild-ignore ui */
/* esbuild-ignore server */

import { pnpPlugin } from '@yarnpkg/esbuild-plugin-pnp';
import cssPlugin from 'esbuild-css-modules-client-plugin';
import ignorePlugin from 'esbuild-ignore-with-comments-plugin';

// ...
```

If you have any question or comments, please [reach out](https://maxrohde.com/about) or [raise an issue](https://github.com/goldstack/goldstack/issues) 🤗.
5 Free Security Tools Developers Will Love in 2022
Tags: webdev, beginners, security, devops
Published: 2022-10-31 20:12:01

## Top 5 Free Security Tools Developers Will Love in 2022 🔥🔥🔥

One of the key ways to get developers to jump wholeheartedly onto the application security (appsec) bandwagon is to stop making it so darned difficult for them to shoehorn security processes into their daily workflows. 

A big ingredient to DevSecOps success is an organization's ability to implement security tools that developers don't hate.

**Here are some promising possibilities:**

1. Contrast CodeSec - Free Application Security tool for developers using CLI, and GitHub (Scan's source code, open-source libraries, and Serverless environment's)-  https://www.contrastsecurity.com/developer/codesec/

2. GitHub CodeQL - Free source code scanner for GitHub only - https://codeql.github.com/ 

3. Snyk - Free Application Security tool for developers using CLI, and GitHub (Scans source code, open open-source libraries) - https://snyk.io/

4. Mend (WhiteSource) - Free open-source library scanner only for CLI and GitHub - https://www.mend.io/free-developer-tools/ 

5. AppScan CodeSweep - Free source-code scanner only JetBrains, VsCode, GitHub - https://www.hcltechsw.com/appscan/codesweep


All 💯 FREE.
Ruby Gem
Published: 2022-10-31 20:10:51

- É um package manager para ruby que fornece um formato padrão para distribuir programas e bibliotecas em um formato auto-contido (self-contained) chamado de gem;
- É uma Ferramenta feita para administrar facilmente a instalação de gems;
- E é um servidor para distribuí-las

https://stackoverflow.com/questions/5233924/what-is-a-ruby-gem

Gems possuem:

- nome
- versão
- plataforma
What would be a 3 months road map to learn data structures and algorithm ?
Published: 2022-10-31 19:54:45

Start From Basic

Learn about basic Data Structure , e.g:- Linked List, Stack, Queue, Tree,Graph , Map(C++ STL).

Data Structures - GeeksforGeeks is enough for learning about these Data Structure.

Implement them by your self (in your favorite language, it will help you to understand them well and also learn about time complexity more clearer)

So it will take around 10 - 15 days to learn about basic Data Structure deeply.
Now start learning about ALGO. For Algorithm i will suggest CLRS book.
Topcoder Tutorial, Codeforces Tutorial and you can find many awesome blog online doing just Google Search. 
Learn from there also.
For each topic (Algorithm which you learn ), start solving problem on codechef , hackerrank, Codeforces. (It will make you perfect). While practicing read problem description slowly , think about solution, give enough time to think , implement. If you solved (Just read other person solution , it will just increase your thinking ability, give you new ways to solve problem). 
If not able to solve , than don't worry , read other person solution. and understand that, Maybe some time it will be hard to understand , just use pan and paper and try to understand each line of code , what it is doing. It will help you alot.
 If you programming enthu, than do much coding otherwise for learning you can just solve some problem for your better understanding. (Practice Make A Man Perfect.)

Go to Advance.
Advance Data Structure (Segment Tree, BIT, Tries, Suffix Tree, Suffix Array,Advance Graph Theory)

Again read form GeeksForGeek.

Topcoder Tutorial(recommended).

Read Blog(just google search Topic, you will find top university lecture ppt or top blog).

Again Solve problem on various online judges Topcoder , Coderforces, Codechef etc.

 Also learn all about DS and Algo via Topcoder + Google Search and solve problem on Spoj, Codechef, hackerrank etc.

For coding people read  library (like in C++, STL). 

It will make your life easy. Rest you can find on google about STL


ALL THE BEST😉
Mongo Server Error : user is not allowed to do action [insert] on [nodeMongoCrud.users]
Tags: mongodb, database, webdev, codewithashim
Published: 2022-10-31 19:26:10


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

_If You Face This Error .Then Follow The Stapes .._

To create or modify a database user, please go to [cloud.mongodb.com](https://cloud.mongodb.com/) and go to the Database Access tab and make sure that your user has the readWriteAnyDatabase@admin access so you can read or write the data in your MongoDB database without any permission restriction error.


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

And if this is not the case please click on **Edit** button and change the Built-in Role to _**Read and Write to any Databases
**_


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dcstvloxbo672d353joo.png)
rush dist:package in CI/CD
Published: 2022-10-31 18:47:09

## Bonus
Have a look at the [instructions](https://github.com/kkazala/generator-rush-publish/blob/main/docs/cicd.md) on how to use `rush dist:package` in Azure pipelines, and check this [example pipeline](https://github.com/kkazala/generator-rush-publish/tree/main/azure-pipelines) for inspiration
Hacktoberfest: Sum-Up
Tags: hacktoberfest, opensource, beginners
Published: 2022-10-31 18:46:43

This October was overall eventful. It was my first time participating in Hacktoberfest and contributing to impressive open-source projects all month.

It was a fantastic experience because it helped me:
- Form new connections.
- Collaborate with developers around the globe.
- Get comfortable with contributing to projects that I do not maintain.
- Improve my coding skills.

###Linear Progression (in order)

#### Improve Telescope documentation (1/4)
Add missing information about the proper way to initialize `PostgresSQL` for development purposes.
{% embed https://dev.to/tdaw/hacktoberfest-pr-3-improving-documentation-3kg %}

---

####Disable spell-check in Linked editor (2/4)
Linked currently does not have support spell-check. Thus, there is no point in underlining typos. 
{% embed https://dev.to/tdaw/hacktoberfest-wrap-up-minor-contribution-to-linked-196o %}

---

####Fix overlapping tooltip bug in Telescope (3/4)
Hovering over the avatar in the top navigation shows the 'Sign out' tooltip overlapping with the username. I adjusted the tooltip position to display it outside the avatar.
{% embed https://dev.to/tdaw/hacktoberfest-fixing-a-ui-bug-40eh %}

---

####Implement completion spec for `ssh-keygen` in Fig Autocomplete (4/4)
Add autocompletion for the `ssh-keygen` command using `man` pages as my reference.
{% embed https://dev.to/tdaw/hacktoberfest-week-1-first-time-contributions-30el %}

---

###Learning outcomes
- Getting comfortable setting up different projects on my local machine based on contribution documentation. I also learned that it is only sometimes a straightforward process. You may run into issues during the configuration process for medium to large-scale projects and may have to seek assistance from community members.
- Getting comfortable with Git rebasing is a _must_ for medium to large-size projects. 
- Often, a bug may seem easy to fix until you start working on it. I learned that timing and research is the key.
- There is no shame in having too many reviews and comments on a PR. It is better to get used to it now than later. _There's no escape._ Eventually, the pull requests will get longer. 

---


![The End](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cepzddvjuec8ej2r4rjo.jpg)
rush dist:package for SPFx
Published: 2022-10-31 18:38:48

Rush _bulk_ commands are invoked separately for each project.  Rush will look in each project's package.json file for a "scripts" entry whose name matches the command name.  By default, the command will run for every project in the repo, according to the dependency graph (similar to how "rush build" works). The set of projects can be restricted e.g. using the "--to" or "--from" parameters.
> See [Custom commands](https://rushjs.io/pages/maintainer/custom_commands/) for information on writing and using custom commands.

## Package SPFx solution

```bash
# build prerelease
rush spfx:package-dev
# build stable
rush spfx:package
```

These commands may be provided to `dist:package` using the `--package-command` parameter, to be executed for each changed project.
They run individually for each project in the repo. Rush looks for a corresponding script name in each project's **package.json** file.

```bash
## Prerelease -------------------
# package ALL as prerelease
rush dist:package --include-all --prerelease `
  --package-command 'spfx:package-dev'

# package ALL projects WITH version policy:
rush dist:package --include-all --prerelease --version-policy 'SPFx' `
  --package-command 'spfx:package-dev'

#  package CHANGED as prerelease
rush dist:package --prerelease `
  --package-command 'spfx:package-dev'

## Stable -------------------
# package ALL as stable
rush dist:package --include-all `
  --package-command 'spfx:package-dev'

# package ALL projects WITH version policy:
rush dist:package --include-all --version-policy 'SPFx' `
  --package-command 'spfx:package-dev'

#  package CHANGED as stable
rush dist:package `
  --package-command 'spfx:package-dev'
```

### `spfx:package` in package.json

Corresponding commands are added to `package.json` files for each selected project and may be adjusted as needed.

```json
  "scripts": {
    "spfx:package": "gulp clean && gulp bundle --ship && gulp package-solution --ship",
    "spfx:package-dev": "gulp clean && gulp bundle --ship --prerelease && gulp package-solution --ship",
  }
```

## Copy packages to target location

```bash
rush spfx:copy  `
  --target-folder "C:\temp" `
  --copied-files "./sharepoint/solution/*.sppkg,./sharepoint/assets/elements.xml"  `
```

This command may be provided to `dist:package` using the `--copy-command` parameter.
It runs individually for each project in the repo. Rush looks for a corresponding script name in each project's **package.json** file.

```bash
rush dist:package --include-all --prerelease `
  --package-command 'spfx:package-dev' `

To make sure that these changes will not be detected by `rush change`, the `package-solution.json` files are registered in [rush-project.json (experimental)](https://rushjs.io/pages/configs/rush-project_json) files specific to individual projects.
  --copy-command 'spfx:copy --target-folder "C:\temp" --copied-files "./sharepoint/solution/*.sppkg,./sharepoint/assets/elements.xml"'
```
Useful Tools for Front-end Developers
Tags: css, html, javascript, webdev
Published: 2022-10-31 17:30:46

When working on the front-end for my websites, I constantly flick back and forth and look for various websites to help me with what I need. So, here's a list of sites for future me and also for you!

1. MDN - https://developer.mozilla.org/en-US/
  - By far one of the most useful websites for frontend devs is MDN. Contains all HTML elements, CSS attributes, etc and a lot of information about them.

2. Can I Use? - https://caniuse.com
  - Check browser compatibility for CSS attributes, APIs or HTML elements that you plan to use.

3. CSS Tricks - https://css-tricks.com/guides/
  - CSS Tricks has loads of useful guides on everything CSS. There are amazing cheatsheets for Flex and Grid as well as many other useful things.

4. HTML, CSS and JS Cheatsheets - https://htmlcheatsheet.com/
  - Lots of useful reference for all 3 languages. 

5. React Cheatsheet - https://devhints.io/react

6. Tailwind CSS Docs - https://tailwind.com/docs
  - Tailwind is a great CSS library that provides a lot of flexibility. The documentation is great to refer too!


That's all I can think of now, but I'll try to update this when I think of more! If you have any you use, leave them in the comments and I'll add them!

Hope it helps,

Dillon
xRDP oturumunda Türkçe Klavye Problemi Çözümü
Tags: rdp, xrdp, turkce, klavye
Published: 2022-10-31 18:33:47

xRDP, Linux sistemlere **RDP** (Remote Desktop Connection) protokolü ile erişimi sağlayan [açık kaynak kodlu](https://github.com/neutrinolabs/xrdp) bir uzak bağlantı servisidir. Windows üzerinde çalışan RDP gibi **3389** portunu kullanmaktadır ve ayarları yapıldığı takdirde SSL üzerinden haberleşebilmektedir.

# Kurulum

Öncelikle kullanabilmek için wayland oturumu yerine **X11** oturumu kullanmanız gerekmektedir. İlerleyen yıllarda bu yazı okunduğu sırada belki Wayland üzerinde destek de gelmiş olabilir.

Öncelikle xrdp bağımlılıklarının kurulumu için aşağıdaki gibi paket kurulumları yapılmalıdır.

```bash
sudo apt update
sudo apt install xorg dbus-x11 x11-xserver-utils
```

Bu adımdan sonra xRDP sunucusu ve iç görüşme için alternatif olarak tigervnc kurulumu gerçekleştirilebilir.

```bash
sudo apt install xrdp tigervnc-standalone-server 
```

BU adımdan sonra SSL sertifikalarının üretilmesi ve kullanılması için xrdp kullanıcısı ssl-cert grubuna eklenmelidir.

```
sudo usermod -a -G ssl-cert xrdp 
```

# Yapılandırma

Bu kısım detaylı olan kısım olup çeşitli şekillerde düzenlenebilmektedir. O yüzden bu kısmı bu yazıda detaylandırmıyoruz.

# Türkçe dil klavye kullanma sorunu çözümü

Bu çözüm için birkaç kavramı oluşturmak gerekmekte.

Öncelikle Türkçe Klavye Setini sisteme eklemek gerekiyor. Bunun için aşağıdaki dosyayı /etc/xrdp/km-041a.ini ve  /etc/xrdp/0000041f.ini şeklinde iki yerde oluşturulması öncelikli olarak gerekmektedir.


[https://gist.github.com/aliorhun/f00edc807a6df488816e78dc852603fa](https://gist.github.com/aliorhun/f00edc807a6df488816e78dc852603fa)

Dosya oluşturulduktan sonra dosyanın izinleri düzenlenmelidir.

```
sudo chmod 644  /etc/xrdp/km-041a.ini 
sudo chmod 644  /etc/xrdp/km-0000041f.ini
```

Daha sonrasında xrdp klavye düzeni yapılandırma dosyası düzenlenir. Ki bu dosya /etc/xrdp/xrdp-keyboard.ini dizininde oluşturulmalıdır.

```
[default_rdp_layouts]
rdp_layout_tr=0x0000041f

; <rdp layout name> = <X11 keyboard layout value>
[default_layouts_map]
rdp_layout_tr=tr

[rdp_layouts_map_mac]
rdp_layout_tr=tr
```

Bu adımdan sonra aşağıdaki komut ile servis yeniden başlatılarak sorun çözülmüş olur.

```bash
sudo systemctl restart xrdp
```
PayPal Developer Meetup - November 15th San Jose CA
Published: 2022-10-31 18:19:52

PayPal is hosting a free meetup in person at the PayPal campus in San Jose, CA. This is a face-to-face event, and no live stream will be available.

We look forward to discussing your favorite developer topics with some of our best talent at PayPal. In this session, you’ll connect with PayPal’s Developer Relations, Engineering, and leadership teams.

Please register [here](https://www.meetup.com/paypal-developer-community/events/288827257/).