teleren/devto huggingface dataset:
How to install Github Desktop for Ubuntu & Debian?
Tags: github, ubuntu, opensource, linux
Published: 2021-04-12 14:11:42

#Step 1 :
*Use the wget command followed by the URL of .deb file of GitHub desktop from the shiftkey Github repo. Shifykey is maintained by Brendan Forster one of the staff member of Github.*
***Note : Github Desktop 2.9 link updated***
```
sudo wget https://github.com/shiftkey/desktop/releases/download/release-2.9.0-linux2/GitHubDesktop-linux-2.9.0-linux2.deb
```
#Step 2 :
*Install gdebi using the following command which helps you to install local deb packages, resolving and installing its dependencies.*
```
sudo apt-get install gdebi-core
``` 
#Step 3 :
*After installing gdebi, using gdebi install the GitHubDesktop client using the following command.*
```
sudo gdebi GitHubDesktop-linux-2.9.0-linux2.deb
```

# Alternate methods to install, after Step 1 :
You can also use the dpkg or apt commands.
###Method 1:
```
sudo dpkg -i GitHubDesktop-linux-2.9.0-linux2.deb

sudo apt-get install -f
```


###Method 2:
```
sudo apt install ./GitHubDesktop-linux-2.9.0-linux2.deb
```


Visit My Personal Blog @ [danyson.github.io](https://danyson.github.io/)

**Support Us on** [Buy Me a Coffee](https://www.buymeacoffee.com/dogealgo)
Build a Maze Game with JS and CSS, Part 1
Tags: webdev, javascript, css, gamedev
Published: 2021-04-12 13:55:56

Hi all, 

Since I've been a kid I've learned coding best from working on projects — and particularly by building games.

Recently I was inspired to write a quick tutorial on how to build a maze game with Vanilla JS and CSS. 

I wrote it to be a straightforward on-ramp to a working game, and there are many directions to take it in once you finish the project.

So if you're like me and learn JS and CSS best from having a project to work on, try out Part 1 of “Build a Maze Game with Vanilla Javascript,” published in CodeX. 

https://medium.com/codex/build-a-maze-game-with-vanilla-javascript-part-1-of-2-ddfd35e84e93?source=friends_link&sk=74dd69bb6ed61fa4156fb29795824620
Outlook Client: Scrollbar Cursor Is Always I-bar (Not Arrow)
Published: 2021-04-12 13:55:30

In Windows 10 if you 
* turn on the "Always display scrollbars" feature.  
* Run Outlook client
* Attempt to scroll through email

You will see that the cursor is always an I-bar even when over the scrollbar (even though it should be an arrow).  
![always I-bar cursor](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4ki3u5mie7xsdssei3r2.png)

You can see a video of this at: [https://www.youtube.com/watch?v=J-5UcGfzbk4](https://www.youtube.com/watch?v=J-5UcGfzbk4)

Do you use the Outlook client on win10?
Have you seen this?
Save Twitter GIFs as MP4 without any add-on or service
Tags: twitter, hack, trick, devtools
Published: 2021-04-12 13:51:26

---
title: Save Twitter GIFs as MP4 without any add-on or service
published: true
description: Using browser developer tools you can save GIFs from Twitter as MP4
tags: twitter, hack, trick, devtools
//cover_image: https://direct_url_to_image.jpg
canonical_url: https://christianheilmann.com/2021/04/12/quick-tip-save-twitter-gifs-as-mp4-without-any-add-on-or-service/
---
 
When you want to save a GIF from Twitter, the interface plays a cruel joke on you. If you context-click the GIF you get a menu that states "Copy GIF address". 

![Copy GIF address context menu on Twitter](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j5f7z1didl340tjup2oj.png)

All it does though is copy a link to the tweet with the GIF in it, which is pretty pointless. Under the hood Twitter also converts any GIF to MP4 because it is a much more effective file format. 

Knowing this, the easiest way to save the GIF is to open DevTools, go to the Console and type/copy:

```javascript
window.open(document.querySelector('video').src)
```

This opens the GIF as a video in a new tab and you can save it there as shown in this screencast:

![saving a GIF from Twitter](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1p3ikhetidb6h8ty8ddk.gif)
 
Of course there are a myriad of web services, Twitter bots and other things that do the same for you and also in more advanced fashion, but I think it is always a very good idea to not trust any service that offers to save protected content from the web for you. I've seen far too many malware browser extensions in that arena.
React/Redux Project
Published: 2021-04-12 13:41:15

    
The final project for the Flatiron School Full Stack Web Development program.  As the culmination of all of the work that I have done so far, not only requires the most work, but also the most knowledge to complete.  Like the JS project, I encountered many bumps in the road.  Thanks to my work for my JavaScript project, I have a much better understanding of how frontend applications work and how the backend via Rails API connects to the frontend.

When I was working on my JavaScript project, it was incredibly annoying having to reload the application page every time I made a change in my code.  React has made this easier by automatically updating the web application.  It makes it so much easier to see any bugs that occur in my code as well as allowing me to see if the changes I make to debug the code actually work.  This was particularly helpful with my code for the forms for both the albums and reviews. The reviews form initially had trouble submitting the information from the form.  Until I solved the issue this bug typically arose from either incorrect code from my actions component, or simply misnaming components/variables when trying to import the components needed.

The most difficult part of this project was definitely working with Redux.  Coding the frontend in React was not too complicated; at least, not until I had to start incorporating Redux into my code so that I could begin pulling data from the backend's API to display on the frontend.  Part of this struggle came from understanding state and props, differentiating between the 2, and how I can manipulate states in order to display the data in the way I want.

While my project is complete in terms of its functionality, in terms of its presentation it is completely barebones and I am planning on working on it to make it much neater and appealing to look at for the user.  Other functions that I plan on implementing are   One of my next steps as well is the implementation of a user using JavaScript Web Tokens in order to make it a bit closer to a realistic web application that someone would want to use.

This screenshot is before I added Albums as its own object that has a has_many - belongs_to relationship with Reviews.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4510qr4w99w2jahfzf6r.png)

This screenshot is after adding all of the relevant files and code that incorporate Albums as its own class and has its own routing separate from Reviews.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rttrjnlzg5n02pum8n40.png)


If you would like to view my repositories for this project:
https://github.com/adarvin14/music-reviewer-client
https://github.com/adarvin14/music-reviewer-api
A simple chat application in flutter.
Tags: flutter, techwithsam, beginners, tutorial
Published: 2021-04-12 13:34:47

Source Code: 
{% github techwithsam/chat-app-flutter %}


![App Screenshots](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8iizkjalgqrdcv4d40al.png)


Video Tutorial:
{% youtube Qhwc9V7VNtc %}


🔗 Let's Connect 🔗 ==> [Github](https://github.com/techwithsam) | [Twitter](https://twitter.com/techwithsam_) | [Youtube](https://www.youtube.com/c/TechWithSam?sub_confirmation=1) | [WhatsApp](https://wa.me/message/JLGQNNTPG64IH1).

Join the Flutter Dev Community 👨‍💻👨‍💻 ==> [Facebook](https://www.facebook.com/groups/flutterdevsgroup/) | [Telegram](https://t.me/flutterdevsgroup) | [WhatsApp](https://chat.whatsapp.com/Cns1jo7dc5dCNrg6aG44My) | [Signal](https://signal.group/#CjQKILccbSu9GnMF_qVrkdCFVQ_i2gmnigPDvweCy86JGpL3EhBg39kp1rftGQgZDYXLty7t).


Subscribe to my [Telegram channel](https://t.me/acctgen) | [Youtube channel](https://www.youtube.com/c/TechWithSam?sub_confirmation=1). Thanks

**Happy Fluttering** 🥰👨‍💻
Validating numeric query parameters in NestJS
Tags: nestjs, javascript, typescript, node
Published: 2021-04-12 13:29:00

Another day, another short article. Today we will focus on validation of numeric query parameters.

Everyone values his/her time, so here is TL;DR:

> Each query parameter comes as string, so it's not possible to validate numeric params correctly. Simple solution – use `@Type()` decorator from `class-transformer` library, and declare numeric field as `Number`. I.e. `@Type(() => Number`)


Let's take an example URL address with few query parameters: ```
https://awesomesite.com/users?country=6&name=joe
```

Our controller would probably look like this:

```TypeScript
@Controller('users')
class UsersController{
  @Get()
  getUsers(@Query() queryParams){}
}
```

Ok, at the beginning we've extracted our query parameters with `@Query()` decorator. Time to impose some validation on them. Here is our validation class: 

```TypeScript
class GetUsersQuery{
  @IsInt()
  country: number;

  @IsString()
  name: string;
}
```
We've defined very basic validation constraints for country and name fields. Then we need to do a little change in our controller method.

```TypeScript
@Controller('users')
class UsersController{
  @Get()
  getUsers(@Query() queryParams: GetUsersQuery){
    console.log(queryParams)
  }
}
```

Ok. Time to check if our validation works correctly. Let's try to send GET request for previously mentioned URL. Everything should be just fine, right? Well, not really, here is what we got:

```JSON
{
    "statusCode": 400,
    "message": [
        "country must be a number conforming to the specified constraints"
    ],
    "error": "Bad Request"
}
```

What? But `country` is a` numeric` field! It's even an integer! Unfortunately, not for our application. Let's try to make one step back, and remove validation, then check what kind of parameters will query object contain.

```JSON
{ 
  country: '1',
  name: 'joe'
}
```

Ok, now you can see, that each field is passed as a string value. Even an integer field. What can we do with it? After all, we need to validate whether the `country` field is an integer, or not, right?

Once again, `class-transformer` library has a simple solution for us. Use `@Type` decorator, and declare country field as `Number`:

```TypeScript
class GetUsersQuery{
  @IsInt()
  @Type(() => Number)
  country: number;

  @IsString()
  name: string;
}
```

Now our request will pass validation, and the response object will look like this:

```JSON
{ 
  country: 1,
  name: 'joe'
}
```

Country field has numeric type now. When we send an invalid value, for example, a string, we'll get:

```
{
    "statusCode": 400,
    "message": [
        "country must be an integer number"
    ],
    "error": "Bad Request"
}
```

But for integer type parameter it will pass. Finally, our integer validation works now correctly. Hope this short article will help you to validate numeric values passed through URL parameters. Cheers!
Node.JS - Foal framework - How to create a simple to-do list
Tags: typescript, javascript, node, typeorm
Published: 2021-04-12 13:20:35

---
title: Node.JS - Foal framework - How to create a simple to-do list
published: true
description: This tutorial presents how to build a simple to-do list with FoalTS framework
tags: typescript, javascript, node, typeorm
//cover_image: https://direct_url_to_image.jpg
---

This tutorial shows how to create a basic web application with FoalTS. The demo application is a simple to-do list with which users can view, create and delete their tasks.

{% youtube kPDlHtgKk68 %}

*Plan:*
1. Installation
2. Introduction
3. The Todo Model
4. The Shell Script create-todo
5. The REST API
6. Validation and Sanitization

Here is the [text version](https://foalts.org/docs/tutorials/simple-todo-list/1-installation/).

And the [source code](https://foalts.org/simple-todo-list-source-code-v2.zip).
Lazy web components: The Book
Tags: javascript, esm, webcomponents, litelement
Published: 2021-04-12 13:10:48

I posted the other day about writing a blog post about lazy loading assets to optimize web components. [@WestbrookJ](https://twitter.com/WestbrookJ/) responded asking for a book!
{% twitter 1380974093797892106 %}

So let's get started on this "book". Using [#HAXTheWeb](https://haxtheweb.org/) as a backdrop, let's look at different performance optimizations around asset loading. I hope these are useful in your projects, HAX or otherwise, LitElement or otherwise. Many of these approaches are transferable to any modern JavaScript project, so enjoy!
![LET'S GO](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ha7m6xahnkjobq94g7fs.gif)
How to make moderation bot discord.js
Published: 2021-04-12 12:59:04

How to mae discord bot in 5 mins ? 
Esy go check out 

https://youtu.be/TXzZABndSj8


First got to https://replit.com/@khanmanam/automod-bot-10#.env click on frok icon
Then make a new file called .env
Then put in .env TOKEN= YOUR BOT TOKEN HERE
then click on run ur bot is ringing now how to host ?
Go to https://hosting.cwkha.tk put ur repl  Url

https://www.youtube.com/embed/TXzZABndSj8?autoplay=1
Network Error
Tags: reactnative, android, ios
Published: 2021-04-12 12:48:35

I got this error on devices only and my emulator was running fine. To solve this first execute steps in my previous [article](https://dev.to/coucoseth/running-http-requests-in-release-build-android-react-native-coj)
lastly add this line ```<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />```
still in your manifest file.
Enjoy
Debug Kubernetes Operator-sdk v1.0.0 locally using Vscode
Tags: operatorsdk, vscode, kubernetes, debug
Published: 2021-04-12 12:48:34

---
title: Debug Kubernetes Operator-sdk v1.0.0 locally using Vscode
published: true
description: How to debug operator-sdk v1.0.0 locally using Vscode 
tags: #operatorsdk #vscode #kubernetes #debug
cover_image: https://thepracticaldev.s3.amazonaws.com/i/skw845tzyh9o2wdhujix.jpg
---

Wrote this some time ago [debug-kubernetes-operator-sdk-locally-using-vscode](https://dev.to/austincunningham/debug-kubernetes-operator-sdk-locally-using-vscode-130k) but due to changes in the Operator-sdk it's not valid for version v1.0.0 and greater. 

here are the Steps to get debug running with v1.0.0
- Go to Run\Add Configuration
- Select Go from environments
- Select Go Launch package

![add go config](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bskbqyyqf0a4amk87w0f.gif)

You should get the following launch.json

```json
{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch Package",
            "type": "go",
            "request": "launch",
            "mode": "debug",
            "program": "${workspaceFolder}"
        }
    ]
}
```

- Add an env for WATCH_NAMESPACE in the configuration so it looks like 

```json
{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch Package",
            "type": "go",
            "request": "launch",
            "mode": "debug",
            "program": "${workspaceFolder}",
            "env": {
                "WATCH_NAMESPACE": "your-operator-namespace",                
            }
        }
    ]
}
```

Debug should now work as expected

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ciihpoifjs6fv9ytveg5.gif)

Thanks goes to [Oleg Matskiv](https://github.com/matskiv) for sharing this with me.
Wonder WebRTC unConference on May 18th
Tags: webrtc
Published: 2021-04-12 12:39:53

🙌 Hey folks, join the Wonder WebRTC unConference on May 18th online!

We'll unite the WebRTC community to talk about our bright browser-based future and today's challenges in the WebRTC world!

Register now: https://unconf.wonder.me

Looking forward to seeing you there!

Best
Florian
PostgreSQL does have SSL (asymmetric key files), but I couldn't get it to work
Tags: postgres, database, security, help
Published: 2021-04-12 12:34:34

I don't want to lock it by merely password and username.

Here is what I adapted from [how-to-secure-your-postgresql-database](https://www.infoworld.com/article/3306441/how-to-secure-your-postgresql-database.html)

First, SSH into remote server (Linode, in my case). Then,

```bash
$ sudo su - postgres
$ echo $PWD
```

1. Create a certificate signing request (CSR) and a key file.

```sh
$ openssl genrsa -out rootCA.key 1024
$ openssl req -x509 -new -key rootCA.key -days 365 -out rootCA.crt -subj '/C=XX/L=Default City/O=Default Company Ltd/CN=root'
```

2. Create a server certificate signed by the root certificate authority. 

```sh
$ openssl genrsa -out server.key 1024
$ openssl req -new -key server.key -out server.csr -subj '/C=XX/L=Default City/O=Default Company Ltd/CN=polv.cc'
$ openssl x509 -req -in server.csr -CA rootCA.crt -CAkey rootCA.key -CAcreateserial -out server.crt -days 365
```

(Note that CN in the second line above should be the server name for server validation.)

3. Create a client certificate signed by the root certificate authority. 

```sh
$ openssl genrsa -out postgresql.key 1024
$ openssl req -new -key postgresql.key -out postgresql.csr -subj '/C=XX/L=Default City/O=Default Company Ltd/CN=postgres'
$ openssl x509 -req -in postgresql.csr -CA rootCA.crt -CAkey rootCA.key -CAcreateserial -out postgresql.crt -days 365
```

4. Copy the server certification file (server.crt), server private key (server.key), and root certification authority (rootCA.crt) to either the PostgreSQL data directory or a secured location accessible by PostgreSQL superuser (postgres). Once copied, allow read-only privileges to PostgreSQL users.

```sh
$ chmod 0400 server.crt server.key rootCA.crt
```

5. Set the appropriate parameters in PostgreSQL to enable SSL mode. 

```sh
$ psql
ALTER SYSTEM SET ssl TO 'ON';
ALTER SYSTEM SET ssl_ca_file TO '/var/lib/postgresql/rootCA.crt';
ALTER SYSTEM SET ssl_cert_file TO '/var/lib/postgresql/server.crt';
ALTER SYSTEM SET ssl_key_file TO '/var/lib/postgresql/server.key';
```

6. OpenSSL supports a wide range of ciphers. You will want to choose the cipher that suits your organizational standards. Once you have chosen the cipher you wish to use, set the following parameter in PostgreSQL.

```sh
psql
ALTER SYSTEM SET ssl_ciphers TO 'HIGH:MEDIUM:+3DES:!aNULL'; 
```

Default cipher is: `HIGH:MEDIUM:+3DES:!aNULL`

Then,

```sh
$ exit
$ sudo systemctl restart postgresql@12-main.service 
```

However, this command, as well as subsequent `psql` crashes, with `ee key too small`...

### Please help me on PostgreSQL on this security! Or, is it not important?
PyLadies is 10 years!
Tags: python, datascience, womenintech, opensource
Published: 2021-04-12 12:25:40

## Background
[PyLadies](https://www.pyladies.com/) is a global group that was created to involve more women in the Python open-source community. PyLadies was founded in 2011, with the first chapter being established in Los Angeles in April of that year. There is more background available in the [PyLadies Wikipedia page](https://en.wikipedia.org/wiki/PyLadies).

2021 is the **10-YEAR Anniversary** of PyLadies!

This article explores the current state of PyLadies, specifically data around chapters, locations and members:  [2021 State of PyLadies](https://reshamas.github.io/2021-state-of-pyladies/)

## Video Talk
Below is my video presentation for [PyLadies International Women's Day](https://iwd.pyladies.com) (15 minutes). 

<iframe width="560" height="315" src="https://www.youtube.com/embed/GgCB0-EjSnY" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
Finite State Machines in ReScript
Tags: rescript, statemachine
Published: 2021-04-12 12:09:38

---
title: Finite State Machines in ReScript
published: true
description: The Twitter Follow Button as a state machine
tags: rescript, statemachine
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wrupvjxjjetlsw0mz7n5.png
---

# Finite State Machines in ReScript

I saw this excellent blog post by [@erikras](https://twitter.com/erikras), [Finite State Machines in ReScript](https://erikras.com/blog/finite-state-machines-in-rescript), but he didn't show the code implementing though he provides a demo on the blog post.

I needed to know how to implement it so I when ahead and did it. Here it is: [rescript-state-machine-twitter](https://github.com/idkjs/rescript-state-machine-twitter).


# Running

```sh
> git clone https://github.com/idkjs/rescript-state-machine-twitter
> cd rescript-state-machine-twitter
> yarn && yarn dev
```
Operador de Nullish Coalescing (??) em Javascript
Tags: javascript, node, beginners, braziliandevs
Published: 2021-04-12 12:08:06


Capa por <a href="https://unsplash.com/@evan__bray?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Evan Dennis</a> no <a href="https://unsplash.com/s/photos/question-mark?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>

# Sumário

- [Introdução](#introdução)
- [O operador ??](#o-operador-raw-endraw-)
- [Caso de uso](#caso-de-uso)
- [Considerações](#considerações)

# Introdução

Talvez em algum momento você tenha se deparado com um trecho de código em Javascript da seguinte maneira:

```js
const valor = valorReal || "valorPadrão";
```

O operador `||` usado acima é chamado de OU lógico, e funciona da seguinte maneira: Se o valor à esquerda do operador for verdadeiro, seu valor será atribuído à variável `valor`. Se o seu valor for falso, a variável `valor` receberá o valor à direta, "valorPadrão".

Se você já está habituado com Javascript, deve saber que existem vários problemas com relação a falsidade ou veracidade de valores na linguagem. Exemplo: "" e 0 são considerados valores falsos. Logo, se em um algoritmo "" ou 0 forem valores válidos, o operador `||` não iria fornecer o resultado necessário. É aí que entra o operador de Coalescência Nula(ou <i>Nullish Coalescing</i>).

# O operador `??`

Agora que você já entendeu o problema, vêm a solução. O operador de Coalescência Nula é representado por `??` e utilizado da seguinte forma:

```js
const valor = valorReal ?? "valorPadrão";
```

Nesse caso, se o valor da variável `valorReal` for `null` ou `undefined`, a variável `valor` receberá `"valorPadrão"`. Caso contrário, ela receberá o valor de `valorReal`.

# Caso de Uso

Pense no seguinte cenário: Você está fazendo um cálculo que utiliza um coeficiente. Se o coeficiente não for fornecido, ele irá receber um valor padrão, sendo `0` um valor válido. Como comentei, o operador `||` iria impedir que o `0` fosse utilizado. Nesse caso, o operador `??` se torna muito útil. Confira a representação desse problema abaixo:

```js
function calcularResultado(x,y,coeficiente) { ;
    const c = coeficiente ?? 0.5;
    return x + y * c;
}

const resultado = calculaResultado(2,3);
console.log(resultado) // Saída: 3.5 ( 2 + 3 * 0,5 )
```

A função `calculaResultado` usa o `??` para verificar se o parâmetro `coeficiente` foi passado para a função. Caso tenha sido, seu valor será usado. Se não, o coeficiente padrão será `0.5`.

# Considerações

O caso que citei for um exemplo simples, mas o operador `??` pode ser útil em muitas situações e garantir uma maior confiabilidade no seu código.

Gostou deste artigo? Me siga para mais conteúdos como esse!

Minhas redes sociais:

[Twitter](https://twitter.com/reisdev) | [Instagram](https://instagram.com/reisdev) | [Youtube](https://youtube.com/reisdev). 

Até o próximo artigo!👋🏽