teleren/devto huggingface dataset:
Install VPN (OpenVPN) Server on AWS EC2 Instance (Ubuntu)
Tags: vpn, openvpn, aws, ec2
Published: 2022-05-10 02:18:18

I think you can use ec2 free tier to create your own vpn server instead of buying or using free limited vpn, hm...

First, you need to login to your aws console and find ec2 service, then create a new instance (launch intance):
***![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sylmw8l4sknolasgpfwl.png)

- Select free tier instance type
- Generate your own key-pair (required to connect with ssh)
- On network setting click `edit`
  - Click `add security group rule` then add new rule for custom UDP with port range = 1194 and source type from `anywhere`
  - ![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j6no5loalrolpk5mpaio.png)
  - ![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d0082p8m8t3xvox8ti32.png)
- Then on `Advanced detail` setting scroll to bottom and you will find `User data` field, and fill with: 

```
#! /bin/bash
apt-get update
curl -O https://raw.githubusercontent.com/angristan/openvpn-install/master/openvpn-install.sh

chmod +x openvpn-install.sh

APPROVE_INSTALL=y ENDPOINT=$(curl -4 ifconfig.co) APPROVE_IP=y IPV6_SUPPORT=n PORT_CHOICE=1 PROTOCOL_CHOICE=1 DNS=1 COMPRESSION_ENABLED=n  CUSTOMIZE_ENC=n CLIENT=david PASS=1 ./openvpn-install.sh 
```
- Then Launch instance.
 
After instance created, you can login into instance with your instance `key-pair.pem`, then you can install [openvpn-install](https://github.com/angristan/openvpn-install) to generate your account/configuration file (.ovpn).

When installed, you can generate file by running:
```
sudo ./openvpn-install.sh
```

You can copy the configuration file into your local machine, and install OpenVpn client (windows) or Tunnelblick (MacOs), then CONNECT!!

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/exfczo6wslfvqh9lcdym.png)
Everything or Enough !!
Tags: javascript, webdev, programming, html
Published: 2022-05-10 02:12:45

The development community is a never ending infinite process, so as the programming and development itself. Plenty of things are available in the market and constantly encroaching the society day by day. In this field we as a computer science students or professionals are the ones who suffer the most. Where there is sufferings, there is also serenity. The only relationship we have is with the computers and programming itself. The two sided love will never end, we assure. No matter what will happen but we will be together forever like this.
How to change the ID of a Meta Box field
Tags: database, fieldid, metabox, tutorial
Published: 2022-05-10 01:40:09

Have you had a ton of posts that contain data on your custom fields? For any reason, you may want to rename one of the fields without having an effect on existing data. In this post, we'll show you two ways to update your field ID without losing data. Let’s see how!

<!--more-->

<span style="text-decoration: underline;"><strong>Reminder</strong></span>: Before going to update the field ID, make sure you <a href="https://deluxeblogtips.com/best-wordpress-backup-plugins/">backup your database</a> first. The methods described here involve running SQL on your database, which can’t revert. Having backups might help you in the event that there's something wrong.
<h2>Running SQL in phpMyAdmin</h2>
Assuming you want to replace the field’s ID <code>location</code> with the new <code>address</code>.

In phpMyAdmin, you can directly run the SQL UPDATE statement to perform the change. Meta Box <a href="https://docs.metabox.io/database/">saves each custom field</a> in one row in the post meta table, where the field id is the <code>meta_key</code> and the value will be the <code>meta_value</code> in the meta table.

So, in phpMyAdmin you only need to run the following SQL:
<pre>UPDATE wp_postmeta SET meta_key = 'location' WHERE meta_key = 'address'</pre>
Just go to tab SQL and enter the SQL query above, then click the <strong>Run</strong> button to execute it.

<img class="aligncenter" src="https://i.imgur.com/UMLUaJJ.png" alt="Run SQL update in phpMyAdmin" width="956" height="151" />
<h2>Using a Functionality Plugin</h2>
If you can’t access the phpMyAdmin, you can create a functionality plugin that can help you perform the same SQL query.

Create a PHP file with the following content:
<pre>&lt;?php
/**
* Plugin Name: Update Your ID
* Description: This is the plugin to help you update your ID.
* Version: 1.0.0
* Author: eLightUp
**/

function update_your_id() {
    global $wpdb;
    $wpdb-&gt;query( "UPDATE $wpdb-&gt;postmeta SET meta_key = 'location' WHERE meta_key = 'address'" );
}

update_your_id();</pre>
We name the plugin <strong>Update Your ID</strong>. It's very simple. It has only the <code>update_your_id</code> function which runs the SQL query to perform the database update. The SQL query is exactly the same that we have in the previous method.

After creating the file, upload it to the <code>wp-content/plugins</code> folder. Then go to <strong>Dashboard</strong> &gt; <strong>Plugins</strong> and activate it. Once activated, the plugin will execute the SQL and change your field ID from <code>location</code> to <code>address</code>.

Then, if you don't want it to run every time your site loads, don't forget to deactivate the plugin. Running it only once is enough.

That’s all, is it simple? If you have any questions, feel free to let us know in the comment section. Good luck!
Strings acting as Arrays
Tags: javascript, beginners
Published: 2022-05-10 01:38:46

####The following statement is inaccurate in regards to JavaScript (under-the-hood differences from other languages), but is still relevant:
Basically, strings can be looked at as arrays of chars, that have been manipulated (in a similar way to how _split()_ and _join()_ do, as shown in an example hereinafter).
Because of said manipulation, many array methods won't work on strings - although there are some alternatives.

####Let there be string:

```
const str = 'abcde';
```

Here's an alternative to using array methods on strings, for example:

```
const char = str[3];
//=> d
```

chars can be accessed this way similarly to elements of an array
The above would have normally been: `char = str.charAt(3))`, but we can use index positioning to find our char.
Lets try another array method on our string:

```
const reversedString = str.reverse();
//=>TypeError: str.reverse is not a function
```
Whoops!! **This threw an error**! _str_ is not an array...

####Lets try a different approach:

```
const arrStr = str.split('');
//=> [ 'a', 'b', 'c', 'd', 'e' ]
```
As you can see, we used the _split()_ method to convert the string into an array.
This can also be achieved like this: `const arrStr = [...str];` (using the _spread_ operator).

Now lets use array methods on an array! Let's try _reverse()_ again:

```
const revArrStr = arrStr.reverse();
//=> [ 'e', 'd', 'c', 'b', 'a' ]
```
**Not this time, Error!**

We need our string to be a string again:

```
const revStr = revArrStr.join('');
//=> 'edcba'
```
**Now that's the stuff!**

So we can use the _split()_ method to convert a string into an array - use array methods on it - and then _join()_ it back together.
In other words: We can operate on strings in their "array version", as arrays.

But there are a lot of wasted chars all over this page.
Lets shorthand it all:

```
const shortRevStr = str.split('').reverse().join('');
//=> LOG: edcba
```
**Short and sweet!**

Other methods that work on arrays, but not on strings can be used on these 'temporary' arrays as well.
The ability to manipulate strings in this way, allows us access to many additional tools.
I'd love to hear about some of the ways that _you_ use data type manipulation to your advantage!
Finalmente consegui a primeira vaga!
Tags: javascript, braziliandevs, beginners, career
Published: 2022-05-10 01:27:39

Eu podia fazer aqueles textões lindos de linkedIn explicando como a jornada foi dura - e foi! e ainda é!. Mas queria deixar esse texto bem enxuto e comentar o ponto principal disso tudo.

Eu estudo front end, com foco em React, a cerca de 1 ano e poucos meses; sendo que deles, 4 eu reservei para começar a aplicar nas vagas.

Ao todo recebi 64 nãos, consegui fazer 6 entrevistas e 3 testes.

Nas entrevistas eu me saí muito bem, mas aqui vai dicas do que eu faria hoje:
- Anotaria em um papel meus pontos positivos
- Faria um planejamento de como encaixar eles no ramo na qual a empresa que eu esteja aplicando atua
- Me venderia melhor para os recrutadores e pessoas ligadas à entrevista.

Algo que me deu muito orgulho. Hoje foi meu primeiro dia e muito do que eu sabia na prática - e praticando em projetos - foi de muita utilidade. Achei que ia ficar perdido quanto as tarefas e fluxo, mas até que me saí muito bem, então desse ponto eu deixo outra dica.

- Continue estudando, sempre.

Por mais que você não consiga agora, você vai conseguir; e quando conseguir, você se destacará pela carga de informação que terá acumulada, daí é só questão de ajustes para saber aplicá-las.

Continue estudando!
Client Cookie Conversion Requirements for ColdFusion
Published: 2022-05-10 01:25:23

Anyone aware of any information regarding best practices for client-side cookie generation for ColdFusion/Lucee CFML?

I'm working on an admin tool and created a client-side cookie with an email address or two (for email testing). Upon the next page request using ColdFusion 2016-2021, only the content up to the first `@` character was available to ColdFusion. If I explicitly encode `@` to `%40` using `encodeURIComponent()`, the AT symbol is preserved. This data corruption bug doesn't exist if using Lucee as the entire value is available without having to encode. (NOTE: This could be problematic as code written for Lucee may lose data with Adobe ColdFusion if client-side cookies aren't encoded correctly.)

Past research on parenthesis truncation issue (`a(b)c` becomes `a`) revealed that Adobe may not have configured [Tomcat for RFC 6265 compliance by default](https://tomcat.apache.org/tomcat-8.0-doc/config/cookie-processor.html) and could be still using legacy cookie processing.  Tomcat 8.0.15 (with better processing) was released in 11/2014. ColdFusion 2016, 2018 & 2021 are all using a version of Tomcat that supports it, but is it enabled?  If not, would it be problematic to enable it?  If not, how would it be enabled?  Or is it possible that I'm ignoring a best practice when it comes to client-side cookie generation?

__NOTE:__ I'm using the [Florian cookie.js library](https://github.com/florian/cookie.js). Here's my contribution for enabling it to generate ColdFusion-friendly cookies:

https://github.com/florian/cookie.js/issues/49

While testing using CommandBox 5.5.1, Adobe ColdFusion 2016-2021 returned all client-side cookies, but Lucee 5.3.9 (w/Java JRE 11.0.15) refused to acknowledge anything unless the cookie was created using CFCookie. I didn't see any difference in the browser's F12 developer tools (under `Application | Storage | Cookies`).

Anyone have any advice?

## No encoding required:

| Code   | Char   |
|:------:|:------:|
| %23    | ##      |
| %24    | $      |
| %26    | &      |
| %2F    | /      |
| %5E    | ^      |
| %60    | `      |
| %7C    | \|     |

## Encoding required:

| Code   | Char   |
|:------:|:------:|
| %2B    | +      |
| %3A    | :      |
| %3C    | <      |
| %3D    | =      |
| %3E    | >      |
| %3F    | ?      |
| %40    | @      |
| %5B    | [      |
| %5D    | ]      |
| %7B    | {      |
| %7D    | }      |
A way to simplify reducer
Tags: react, redux, noreducer
Published: 2022-05-10 01:09:44

Hello everyone, 

I am a web developer who works on medium and small projects. Because I want to simplify the way to work with reducers, I created a helper package named **no-reducer** which automatically add/edit/delete/find objects in the reducer for me.

![No Reducer ](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zb6pq3ysi9tlr1d9kpp1.png)
As illustrated, the “no-reducer” with a tiny robot arm is an add-on in between Redux flow, which receives commands from Action and works on Reducers.

[ LIVE Demo - Todo list ](https://codesandbox.io/s/no-reducer-5sydfd?file=/actions.js)

[Github](https://github.com/vnseattle/no-reducer)

Please give me feedback on it, and you are welcome to join me if you like this and you want to improve it.

Thank you for your time.
VS Code Tip of the Week: Fonts for Languages
Tags: vscode, vscodetips
Published: 2022-05-10 01:03:37

This week's tip of the week is care of my old co-worker @citizen428. He mentioned that you can set a different font for a specific programming language. So, for example, in [Go](https://go.dev/), there are [fonts](https://go.dev/blog/go-fonts) that work really well with this language.

This is really cool, and as I was looking into this, I realized you can set all kinds of settings for a particular language. Looking into my own settings, I had already done this for certain things.

![VS Code settings file open showing different formatters for different languages](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xkslmrl4yytaym146ja6.png)

Check out the [Language-specific editor settings](https://code.visualstudio.com/docs/getstarted/settings#_languagespecific-editor-settings).

Thanks for the tip, Michael and Happy VS Coding!

P.S.: If you're looking for a community that’s all about VS Code, come on over and say hi at [vscodetips.com](https://vscodetips.com)!
Day 31: No more code
Published: 2022-05-10 00:00:25

Hi!
we are already in the second month and this could technically be another day one but the target is day 500 and more. today I wanted to write a major article about the main benefits I realized with writing but time doesn't seem to be my best friend these days things have escalated and matter of fact I may not be writing code for a a day or two due to the paper defense deadline getting more close. but tomorrow there will be no code that's confirmed. today was a one for errors I was trying to fix yesterday issues with testing with no success. I ended up deleting all tests and went back to Enzyme but finally bac to react testing library. maybe I will continue looking into that later 
about tomorrow I will be working on only the paper but I will be back for later

signing off...
Doesn't work refresh page on react app
Tags: javascript, react, programming, webdev
Published: 2022-05-10 00:48:37

Hi everyone,
I have one question.
I am building react app with "react-scripts": "4.0.3".
After uploaded and built on netlify, when refresh the page with param (https://corsac-v2-marketplace.netlify.app/collection/0x5ac4c0970a00e89944e7e69d6e27efc1e65ac4d8), it returns white blank page. (will attach screenshot with console)
But, on local dev(yarn start), it does work (http://localhost:3000/collection/0x5ac4c0970a00e89944e7e69d6e27efc1e65ac4d8).
So, I googled for a few hours in order to fix this issue, but, I couldn't get any solutions.
I tried added /_redirects file and .htaccess file. (it doesn't work)

How can I fix this issue?
Hope your quick help.

Best,,,

https://user-images.githubusercontent.com/82189148/167477183-d523a3d1-0d29-4602-a6a8-07d7143fd83c.png
How to easily make every property in a type alias or interface to optional properties in TypeScript?
Tags: typescript
Published: 2022-05-10 00:00:00

---
  title: How to easily make every property in a type alias or interface to optional properties in TypeScript?
  published: true
  tags: TypeScript
  date: Tue May 10 2022 05:30:00 GMT+0530 (India Standard Time)
  canonical_url: https://melvingeorge.me/blog/easily-make-every-property-type-or-interface-to-optional-typescript
  cover_image: https://melvingeorge.me/_next/static/images/main-64130aaf0b94ac183ae0ed4c9eda9de2.jpg
  ---
  [Originally posted here!](https://melvingeorge.me/blog/easily-make-every-property-type-or-interface-to-optional-typescript)
  
To easily make every property on a `type alias` or `interface` to optional properties, you can use the `Partial` utility type and pass the `type alias` or `interface` as the first type argument to it using the angled brackets symbol (`<>`).

### TL;DR

```ts
// a simple type
type Person = {
  name: string;
  age: number;
};

// make all the properties in the
// `Person` type to be optional
type OptionalPerson = Partial<Person>;

// contents of the `OptionalPerson` type
/*
{
  name?: string | undefined;
  age?: number | undefined;
}
*/
```

For example, let's say we have a type called `Person` with 2 properties called `name` having the type of `string` and `age` having the type of number like this,

```ts
// a simple type
type Person = {
  name: string;
  age: number;
};
```

Now to make all the properties in the `Person` type to be optional we can use the `Partial` utility type and pass the `Person` interface as the first type argument to it using the angled brackets symbol (`<>`).

It can be done like this,

```ts
// a simple type
type Person = {
  name: string;
  age: number;
};

// make all the properties in the
// `Person` type to be optional
type OptionalPerson = Partial<Person>;

// contents of the `OptionalPerson` type
/*
{
  name?: string | undefined;
  age?: number | undefined;
}
*/
```

Now if you hover over the `OptionalPerson` type you can see that all the properties are now optional which is what we want to happen.

See the above code live in [codesandbox](https://codesandbox.io/s/easily-make-every-property-type-or-interface-to-optional-typescript-l0894q?file=/src/index.ts).

That's all 😃!

### Feel free to share if you found this useful 😃.

---
Build A Balloon Pop Game (Unity, free!)
Tags: unity3d, gamedev, 3d, tutorial
Published: 2022-05-09 23:55:45

Recreate the fun of a carnival in 3D by playing a famous carnival game: balloon pop! This game was create with Unity and [**echo3D**](http://www.echo3d.co/)-- You can play or build it your self by following the instructions below (the demo can also be found on echo3D's [GitHub](https://github.com/echo3Dco/Unity-echo3D-BalloonPop)).

Register
========

Don't have an API key? Make sure to register for FREE at [echo3D](https://console.echo3d.co/#/auth/register).

Setup
=====

See the complete step-by-step README [here.](https://github.com/echo3Dco/Unity-echo3D-BalloonPop#readme)

*   Clone this repo: [https://github.com/echo3Dco/Unity-echo3D-BalloonPop](https://github.com/echo3Dco/Unity-echo3D-BalloonPop)
*   [Install](https://docs.echo3d.co/unity/installation) the echo3D Unity SDK.
*   Find the 3D models in 'Models' folder in the repo.
*   Go to [echo3D console](https://console.echo3d.co/#/pages/contentmanager) and click "Add to Cloud" and upload the models.
*   Change the metadata in the echo3D console to match the README.
*   In the Unity Hierarchy, go to the "Background" and "RedBalloonObject" objects. Add your API key and entries to the echo3D script from the inspector.

Video Tutorial
==============

Watch the video tutorial here:

{% youtube SZ9hfoTivdQ %} 

Learn More
==========

Refer to our [documentation](https://docs.echo3d.co/unity/) to learn more about how to use Unity and echo3D.

Click or scan here to see something cool! [**https://go.echo3d.co/Aw54**](https://go.echo3d.co/Aw54)

![](https://miro.medium.com/max/1154/1*SectN6bSvUrXrdF9z5Zo8w.png)

Support
=======

Feel free to reach out at support@echo3D.co or join our [support channel on Slack](https://go.echo3d.co/join). 

Screenshot
==========

![](https://miro.medium.com/max/1400/1*IkWn2iKE_0so9pBQofc2Lg.png)
<center> Credit: [brgfx / FreePik](https://www.freepik.com/free-vector/three-game-boothes-circus_4667452.htm)</center>

More Tutorials
==============

To learn how to make other similar projects, try one of these:

*   [Make a Valentine's Day Slideshow in AR (No code)](https://medium.com/echo3d/make-a-valentines-day-slideshow-in-ar-free-and-no-code-c1e35a4206d4)
*   [Get a Quarantine Dog--in AR! (No Code and Free)](https://medium.com/echo3d/get-a-quarantine-dog-in-ar-8383ea55376b)
*   [Quick and Easy AR Retail Apps with echo3D!](https://medium.com/echo3d/quick-and-easy-ar-retail-apps-with-echo3d-12640e21e5d9)
*   [How to Create 3D Content and See It In AR (No Code and Free)](https://medium.com/echo3d/how-to-create-3d-content-and-see-it-in-ar-free-no-coding-required-369e5b4a4b3e)

***

> _**echo3D** ([www.echo3D.co](http://www.echo3d.co/); Techstars '19) is a cloud platform for 3D/AR/VR that provides tools and network infrastructure to help developers & companies quickly build and deploy 3D apps, games, and content._

![](https://miro.medium.com/max/1400/0*bO1kmplfMgo1gmZi.png)
DDD Módulos
Tags: braziliandevs, ddd, beginners, todayilearned
Published: 2022-05-09 22:52:47

### Today I Learned 09/05/2022


[Módulos](#módulos)

## Módulos
> Em um contexto DDD, Módulos em seu modelo servem como contêineres nomeados para classes de objetos de domínio que são altamente coesas entre si. O objetivo deve ser baixo acoplamento entre as classes que estão em módulos diferentes. Como os módulos usados no DDD não são compartimentos de armazenamento anêmicos ou genéricos, também é importante nomear adequadamente os módulos.
VERNON, Vaughn. Implementando Domain-Driven Design

- Respeitar a linguagem universal
- Ter baixo acoplamento
- Um ou mais agregados somente devem ficar juntos se fizerem sentido
- Organizado pelo domínio/subdomínio e não pelo tipo de objetos
- Devem respeitar a mesma divisão quando estão em camadas diferentes

Atualmente as pastas estão divididas da seguinte forma: ![Estrutura de pastas](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tp8xofsl8k3023mqnfg4.png)
 
onde está separado pelo tipo de objeto e não pelo domínio/subdomínio

![Exemplo de como organizar](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lklpavjrua00dy535ix6.png)

Dessa forma podemos organizar pelo subdomínio dá pra fazer analogia com as gavetas de uma casa, onde por exemplo antes estávamos organizando por tipo de material `vidro, aço, porcelana` e agora estamos organizando pelo o que é aquele objeto `copos, talheres, panelas, pratos`

> Ainda estou aprendendo sobre DDD e se quiser ver melhor o código pode dar uma olhada nesse [Repositório](https://github.com/Yansb/full-cycle-course/tree/master/domain-driven-design)