teleren/devto huggingface dataset:
H3C HCL与WSL2共存
Tags: huawei, hcl, h3c
Published: 2022-08-11 15:22:15

## Background

由于Windows10 开启WSL2后无法和 *eNSP* 做到兼容，但是 *H3C HCL* 在版本 **HCL_v2.1.2.1** 提供了 **VirtualBox 6.0.14** 作为虚拟化后端，理论上来说可以做到 WSL2 与 HCL 共存。

并且开启了WSL2后并于其他虚拟化平台（VirtualBox, Vmvare）做到兼容的情况下，这种情况大部分禁止套娃（虚拟化下在虚拟化），通过安装虚拟机的方式再安装 *eNSP* 发现启动不报错，但是很长时间起不来。

> Notes <sup><a href="#1">[1]</a></sup>：HCL官方给的建议是，对于windows7装的版本为*HCL_v2.1.1*；对于Windows10 并且开启了 *Hype-v* 或者 *Dokcer-Desktop*，推荐使用 *HCL_v3.0.1.1*

下载地址：[HCL Download](http://www.h3c.com/cn/Service/Document_Software/Software_Download/Other_Product/H3C_Cloud_Lab/Catalog/HCL/)

## 安装过程

下载好安装时，直接下一步直至完成即可，VirtualBox已被内嵌至安装包内了。

![image](https://img2022.cnblogs.com/blog/1380340/202208/1380340-20220811202313664-1874954401.png)

<center>图：HCL安装界面</center>

> Notes：如果需要抓包，自行安装*Wireshark*，安装好后，在*HCL*设置中配置 `wireshark.exe` 的路径即可

## VirtualBox启用hyper-v支持 <sup><a href="#2">[2]</a></sup>

进入VirtualBox安装目录, 确定当前目录下存在VBoxManage.exe文件, 在当前目录打开powershell. 或者你将VBoxManage.exe所在目录加入环境变量, 任意路径下打开powershell.

```powershell
# 或指定vbox所有虚拟系统开启
./VBoxManage.exe setextradata global "VBoxInternal/NEM/UseRing0Runloop" 0
```

开启后，HCL所有的设备就工作正常了，这种情况下也不用牺牲*WSL2*或者*Dokcer-Desktop*。因为eNSP官方没有再更新，导致hype-v与VirtualBox无法兼容，暂时无解。

> **Reference**
>
> <sup id="1">[1]</sup> [H3C Cloud Lab](https://www.h3c.com/en/d_201811/1129464_294551_0.htm)
>
> <sup id="2">[2]</sup> [Windows 10 (2004) 启用wsl2, 并与VirtualBox 6.0+共存](https://blog.csdn.net/qq_36992069/article/details/104750248)
mariabak: Making MariaDB and MySQL backups a breeze
Tags: backup, mariadb, mysql, php
Published: 2022-08-11 15:18:31

---
title: mariabak: Making MariaDB and MySQL backups a breeze
published: true
description: A program/script to help to perform some operations using mysqldump
tags: backup,mariadb,mysql,php
cover_image: https://i.imgur.com/q7kb96H.jpg
# Use a ratio of 100:42 for best results.
---

## About

**mariabak** is a opensource command-line program frontend for `mysqldump` to make MariaDB and MySQL databases backups. Some operations are easier using `mariabak` than using `mysqldump` directly.

## Project page

https://github.com/llagerlof/mariabak

**Let's see some of the goodies:**

- You can opt-out dump data from specific tables. The good news: the tables structure will be preserved (`mysqldump` doesn't have this as a native option so you need to execute more than one command to do this).

- You can perform backup of all databases at once, or just some chosen databases, creating one dump file for each database (`mysqldump` put all databases into one single dump file).

- One directory with a timestamp will be created for each `mariabak` execution (more than one file is generated for each backup, so let's keep things organized).

- It backups all the user grants, system variables and events to separate files.

## Hands-on

![Demonstration](https://user-images.githubusercontent.com/193798/184143085-23380ab9-03da-4d66-8ba8-1aaa1650f3ea.gif)

## Usage examples

**List databases:**

```shell
$ mariabak -list     # default localhost, user root, empty password
```

**Backup all databases. A directory will be created in current directory:**

```shell
$ mariabak --databases=*
```

**Backup one database, asking for the server password interactively:**

```shell
$ mariabak --databases=db1 --host=localhost --user=root -p
```

**Backup some databases, ignore some tables data but preserve its structure:**

```shell
$ mariabak --databases=db1,db2,db3 --ignore-tables=db2.table1,db2.table2,db3.table_a --user=root -p
```

**Backup one database, passing the server password inline:**

```shell
$ mariabak --databases=db1 --host=localhost --user=root --port=3306 --password=hunter2  # Caution with this one. The shell can save command history.
```
[Cloud Build] Failed to trigger build: generic::invalid_argument: invalid build: invalid image name
Tags: googlecloud, cloudbuild
Published: 2022-08-11 15:11:00

TL;DR If you see the error message in this article title when you run Cloud Build trigger, the Docker image name is too long to handle for GCP.
 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/e4iv929amyg4kvael87p.png)


# Details

The default inline `cloudbuild.yaml` which is auto-generated when we create Cloud Run service, defines docker image names as like the following.

```
$_GCR_HOSTNAME/$PROJECT_ID/$REPO_NAME/$_SERVICE_NAME:$COMMIT_SHA
```

However, the image name can be so long like

```
asia.gcr.io/your-long-project-id/repository-name/service-name:87caefacca50d6d64288732070b522a92690dde0
```

Seems like GCP has the limit for handling Docker image name and it is 100 characters at max. So, if the default definition does not work for your case, you can remove an element from the template like `$REPO_NAME`. If the Docker image name gets shorter than 100, the build pipeline should work.

Hope this shorten your debug time !
Ideas on improving array element access and making web apps performant
Tags: javascript, webdev, array, optimisation
Published: 2022-08-11 15:08:32

> Tiny things matter when it comes to the performance of a web application. 

Let's take a very intuitive problem where we wonder how web developers will access the last element from an array of items that contains ~1 million items in it. 

The obvious thoughts are using the slice, pop array methods or via accessing the index or in many other ways below:-

let data = [...] => ~millions of items.
```
let last = data.slice(-1)[0]
```

```
let last = data[data.length - 1]
```

```
let last = [...data].pop()
```

```
let last = data.reduceRight(x => x)
```

```
let last = data.at(-1)
```
or by using external libraries like lodash and any jQuery methods.

After running some tests on these sets of instructions for an array of millions of items we have got a performance benchmark!

![](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5im93of5rbjtxnw8osz5.png)

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

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

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

Conclusions - It's recommended to use 
```
let last = data[data.length - 1]
```
which is the fastest cross-browser solution among all possible solutions.
After that my personal choice will be to use 

```
let last = data.at(-1)
```
and 
```
let last = [...data].pop()
```
Although, [...data].pop() takes an extra space of O(N) and time to create a shallow copy of the big data array but it's faster.
Solutions using jQuery are the slowest on all browsers.
Thanks to StackOverflow and Kamil Kiełczewski. 
[](https://stackoverflow.com/users/860099/kamil-kie%c5%82czewski)
Avoid those awkward moments in public places or meetings in 1-click
Tags: productivity, apps, mac, showdev
Published: 2022-08-11 15:02:34


**Problem**

- Have you ever been in a strange situation in public where you thought your speakers were on mute but they weren’t?
- Have you ever accidentally shared private information in public?
- Have you ever been embarrassed in a presentation meeting by showing apps or windows that were not supposed to be presented?

_Do you wish to avoid those problems in the future? If so, then you are in the right place. 👇
_

**Solution**
With a single click away, you can focus on the task at hand in any situation.


## Zen Mode — Hide Everything. Mute Everything.

> **Checkout here: https://bit.ly/3PmxDcc**

Tech stack
- Supabase: To manage license mgmt and feedback mgmt
- Swift: Design frontend
- Apple-script
- Shell script


![Zen Mode macOS app](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z2yzaltp3swo8dca9cey.png)


![Raycast - 1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5cld9naphgzx3cyeigo2.png)


![Raycast - 2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qb1uylcegyfh7976ikbo.png)

> **Checkout here: https://bit.ly/3PmxDcc**
custom clothing manufacturers
Published: 2022-08-11 14:50:54

Viz Apparel is a innovator in the tradition apparel manufacturing, contribution all dimensions of clothing manufacturers a one-stop workshop for their customized supplies. Affix is conscious of how stimulating it can be [bikini manufacturer usa](https://vizapparel.com/swimwear) to find trustworthy apparel manufacturers, so we deliver you with a complete answer. We offer a wide variety of customization choices composed by the greatest modest valuing on the marketplace.
NAKIVO Backup & Replication Review
Tags: webdev
Published: 2022-08-11 14:36:36


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1pz12viq824tnrl0ah9x.jpg)
There are many backup solutions, each with their own pros and cons. It is hard to find one, though, that lets you effortlessly switch between physical workstations, virtual machines, multiple sites, the cloud, and SaaS settings. NAKIVO, a U.S.-based solution provider, straddles the entire backup value chain with its wide range of offerings and multi-tier subscriptions.

Full article: https://www.maketecheasier.com/nakivo-microsoft-365-backup-review/
أكثر مجالات البرمجة طلبا في سوق العمل في السنوات القادمة
Tags: beginners, tutorial, discuss
Published: 2022-08-11 14:25:00

### 1. برمجة المواقع 
> عبارة عن كتابة تعليمات وتوجيه أوامر بهدف إنشاء أو بناء صفحة  أو عدد من صفحات الويب، وذلك باستخدام أحد لغات برمجة الويب المتاحة, كما يمكن ربط هذه الصفحات مع قاعدة بيانات، بحيث تتحول بذلك من مجرد صفحات ويب إلى سكربت مميز .
[مقالة عن برمجة المواقع
](https://jusoor.com.sa/2018/02/21/%D8%A8%D8%B1%D9%85%D8%AC%D8%A9-%D8%A7%D9%84%D9%85%D9%88%D8%A7%D9%82%D8%B9/) ![web development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/it74bh7xkdy5rtfjgwaz.png) 

---
### 2. برمجة تطبيقات الهاتف 
> برمجة تطبيقات الموبايل من أكثر الوظائف المطلوبة في سوق العمل هذه الفترة، وتنقسم إلى عدة أنواع
> [فيديو مفيد عن برمجة تطبيقات الموبايل
> ](https://www.youtube.com/watch?v=0Yrqa_qIAps)
![app development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yxxgbhwrjsqtiimd1jv8.png)
---

### 3. مجال تطوير الالعاب
> مسؤول عن التطوير والبرمجة وتحويل الأفكار إلى لعبة، وعملية تطوير الألعاب وظيفة تتطلب معرفة بكيفية البرمجة والتفكير بطريقة إبداعية.
> تطوير الالعاب مجال مطلوب في وقتنا الحالي بشكل كبير
> [مقالة عن كيفية بدا في هذا المجال](https://6wrni.com/how-to-be-game-developer/)
![game development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8yqpe2xfmfwa9nz3wygu.png)
 


---

### 4. مختص قواعد البيانات
> مدير قاعدة البيانات هو الشخص المسؤول عن تنصيب وإعداد وترقية وإدارة ومراقبة وصيانة قواعد البيانات في منظمة ما. وتشمل وظيفته تطوير وتصميم استراتيجيات قواعد البيانات ومراقبة حالة النظام وتطوير أداء قاعدة البيانات وسعتها. بالإضافة إلى التخطيط لأي طلب توسعي في المستقبل.
> [فيديو عن قواعد البيانات
> ](https://youtu.be/kPaXp8e95X8)![database manager](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wo88ej9r1w335mv713dr.png)


---


---
### 5. الذكاء الاصطناعي
في أحدث قائمة أعلن عنها موقع "لينكد إن" لأسرع الوظائف 

> الناشئة نموا في الولايات المتحدة خلال خمس سنوات (2012-2017) حظيت وظيفة مهندس 
> تعلم الآلة على المرتبة الأولى لتزايد 
> إقبال المشغلين على توظيف المتخصصين في تعلم الآلة، 
> سواء شئت ام ابيت تعلم 
> الالة تتكون من اهم 
> وظائف
 تطلبا في 
> ![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vj8p7fnq7jcgtnbbdw0u.png)
---



<center>هذا كان بعض التخصصات المهمة عن البرمجة في عالم العربي</center>
Typing React Components: React.FC or JSX.Element?
Tags: react, reactnative, typescript, javascript
Published: 2022-08-11 14:23:06

Typing a React/React Native component is not always necessary, the type usually is implicit by the return statement, but sometimes we need to, and there are some approaches to type it.

Probably the most common is using the interface already provided by react: **FC**, which means Functional Component, if the component accept props we only need to add the prop types on it: **FC<MyProps>**.

The other which is implicit by the return type is JSX.Element and widely used as well, and, before React 18, this approach was more reliable.

**Cons of using React.FC**

Before React 18 there were a potential issue using FC, it has an implicit children props on it as default, so anyone using a component with the FC type could pass a children on it:

{% embed https://gist.githubusercontent.com/BenHurMartins/488f0b0dd4a0e8b879ff6e525cdd9549 %}
That is not an issue anymore, since in React 18 it got removed, so if your project runs on 18 or higher, no need to worry about that.

**Cons of using JSX.Element**

This is the implicit return type if you don't declare it. But let's suppose your component will not always return a valid JSX.Element, sometimes we want to return null or just a piece of string, JSX.Element will not be enough and we will start to add other return types: JSX.Element | null:

{% embed https://gist.github.com/BenHurMartins/169a6c708f8120081256c9f078c1ca53 %}

**Not typing components**

This is also an option, and probably will work fine, typescript can understand and work with implicit types, only won't work if your project enforces eslint rules that requires to type explicitly everything.

**Usage exemples**

A basic exemple with the same button type with the same function and two different types:

{% embed https://gist.github.com/BenHurMartins/dffe6991974f20a3d6d17a03002160d1 %}

**Conclusion**

I can't see a good reason to use one option over another, JSX stills have the useage more strict by not allowing returning strings or null values, but it also is not a big deal to not use it. In the end it is more a matter of what type we want to use in our project or even not typing stills a choice.

My personal choice is using React.FC, most of the new typescript users find it easier to use, and in my opinion it makes the code easier to read.
JavaScript vs Python 👨‍💻
Tags: discuss, javascript, programming, python
Published: 2022-08-11 14:14:00

In the last article [What programming language to learn first](https://dev.to/youssefmic/what-programming-language-to-learn-first-3pgd)
I said that JavaScript was better than Python in my opinion but why?? Today we are gonna battle them out and see who will beat the other to be the GOAT of programming languages 
First, let’s see who the competitors are:

Python:

On the blue side, we have Python this dynamically typed language that can do whatever you throw at it, Backend Web Development... Yes,
Cross Platform App Development... Yes, AI and Machine Learning... Of course! 
It’s super mega popular between the beginners and the advanced and is labeled as “The single best programming language to learn”.

JavaScript:

On the yellow(red) side we have JavaScript, also a dynamically typed language that has a framework to do anything, Frontend web development... Reactjs(I know this is the library don’t kill me guys ok??) Backend Web Development... Nodejs of course and Cross Platform App Development... Indeed you have tools such as Ionic or React Native.
It’s the only language to develop web applications (assuming you are not brain dead to use something like Dart or C# Blazor or this anti-JavaScript stuff). It has a traditional curly brace syntax and is loved by a lot of programmers (including me!)

Now let’s start the battle

- **Performance**

In the real world, JavaScript is known to be not that fast of a language, but on the other hand, Python doesn’t beat this. They are both compiled to C so, you can say that they are both at the same speed but in comparing the time consumption in 100 million iterations:

```
# Python

sum = 0 
for i in range(100000000): 
    sum += i 
print(sum) 

```

```
// JavaScript
let sum = 0 
for(let i=0; i > 100000000; i++){
    sum+=i
}
console.log(sum)
```
Nodejs managed to be 75 times faster than Python. But performance isn't very important because you should focus on code optimization instead of choosing the best language depending on performance.

- **Syntax**

JavaScript follows a curly-braced traditional type of syntax, but Python -eh- has a space-based one which for me isn't that good.

- **Popularity**

In the [StackOverflow Survey 2022](https://survey.stackoverflow.co/2022/) JavaScript ranked 1st and Python ranked 4th. But both languages are... Pretty Popular.

- **Conclusion**

I am very happy with JavaScript and in [1 year of full stack development](https://dev.to/youssefmic/1-year-of-learning-full-stack-development-i09) I said that I tried Python and I didn't learn it right. Does that mean that I won’t give it another shot hell No. For me, JavaScript is the GOAT I am not against Python.
Let me know your opinion in the comments below!
Define a PostgreSQL database connection in JSON and import it in PGAdmin 4
Tags: pgadmin4, connections, import
Published: 2022-08-11 14:00:00

---
title: Define a PostgreSQL database connection in JSON and import it in PGAdmin 4
published: true
date: 2022-08-11 14:00:00 UTC
tags: PGAdmin4, connections, import
canonical_url: https://ftisiot.net/posts/create_json_connection_pg_admin4/
---

Yesterday I updated my PGAdmin 4 and found an interesting option to manage database connection via the **Tools** -> **Import/Export Servers**, allowing to pass almost all the parameters required (it doesn't export/import the password) to connect to a database via JSON files.

The question is: how can I define a connection in JSON so it can pick it up and imported in PGAdmin 4? It's actually pretty simple, all you have to do is, substitute all the parameters in the following example

```json
{
    "Servers": {
        "1": {
            "Name": "CONNECTION_NAME",
            "Group": "GROUP_NAME",
            "Host": "HOSTNAME",
            "Port": PORT,
            "MaintenanceDB": "DATABASE_NAME",
            "Username": "USERNAME",
            "Password": "PASSWORD",
            "SSLMode": "SSLMODE"
        }
    }
}
```

Where

* `CONNECTION_NAME` is the logical name you want to give to the connection
* `GROUP_NAME` is the logical group name that you can use to group more connections
* `HOSTNAME`, `PORT`, `DATABASE_NAME`, `USERNAME`, `PASSWORD`, `SSLMODE` are the usual parameters to connect to the database.

You can also add more than one database connection in the mix, E.g.

```json
{
    "Servers": {
        "1": {
            "Name": "CONNECTION_NAME1",
            "Group": "GROUP_NAME1",
            "Host": "HOSTNAME1",
            "Port": PORT1,
            "MaintenanceDB": "DATABASE_NAME1",
            "Username": "USERNAME1",
            "Password": "PASSWORD1",
            "SSLMode": "SSLMODE1"
        },
        "2": {
            "Name": "CONNECTION_NAME2",
            "Group": "GROUP_NAME2",
            "Host": "HOSTNAME2",
            "Port": PORT2,
            "MaintenanceDB": "DATABASE_NAME2",
            "Username": "USERNAME2",
            "Password": "PASSWORD2",
            "SSLMode": "SSLMODE2"
        }
    }
}
```

## Import the JSON definition in PGAdmin 4

Once you have the above config stored in a JSON file, you can then import in PGAdmin4 with:

* select **Tools** -> **Import/Export Servers**
* select **Import**
* select the connections you want to import and click on **Next**
* click on **Finish**

And done! you imported all your JSON connections
What is the difference between computer software and a computer program?
Tags: anonymous, discuss, help, beginners
Published: 2022-08-11 13:42:20

_This is an anonymous post sent in by a member who does not want their name disclosed. Please be thoughtful with your responses, as these are usually tough posts to write. Email sloan@dev.to if you'd like to leave an anonymous comment or if you want to ask your own anonymous question._ 

***
Do we need Axios having the fetch API everywhere?
Tags: javascript, axios, fetch
Published: 2022-08-11 13:38:00

What do you prefer?
Is there a reason to use Axios these times?

In my opinion there is almost no reason to do so and I would suggest to get rid of another dependency, making things more lean and easier to understand.

At least thank you for your work Axios team. It helped a lot in the old times before fetch.
Migrating a nodejs, webpack project from JavaScript to TypeScript
Tags: typescript, webpack, javascript, node
Published: 2022-08-11 13:35:00

Hi, I'm not used to writing blog posts but recently I was looking for ways to migrate my nodeJs project from Javascript to typescript. I realised there are not many articles for projects that uses webpack.This is my attempt to share my learnings in this topic.

Here are few simple steps:

Add tsconf.js file in the root of your project. Add following configuration to this file

```
{
    "compilerOptions": {
        "outDir": "./dist",
        "allowJs": true,
        "target": "es5"
    },
    "include": [
        "./src/**/*"
    ],
    "exclude": [
        "node_modules"
    ]
}
```

npm install awesome-typescript-loader. 

```
npm i awesome-typescript-loader
```

Add following to your `webpack.config.js` file

```
module{
rules:[{ test: /\.(t|j)sx?$/, use: { loader: 'awesome-typescript-loader' } },]

```
and 

```
 resolve: {
        extensions: ['.ts', '.js'],
    },
```

Change the source file name from `.js to .ts`

Changing the file extension to .ts will highlight some type errors in your file. I would recommend going through a basic tutorial for typescript to understand why you are getting those type errors. And how to fix them. 

Once you have fixed the highlighted errors in your source files run your build tool as you normally do.
JavaScript Primitive & Non Primitive Data Type
Tags: javascript, programming, webdev, beginners
Published: 2022-08-11 13:26:00

Normally when we hear data types in any programming language, integer, string, etc... jumps to our mind. 

Although all of these things are data types, there are two umbrellas contains most of the JavaScripts data types.

**Primitive Data Types** & **Non Primitive Data Types** 

## Non Primitive Data Types

- **Array** which is used for storing different elements, 
Ex:
```
arr = [1, 3, 5, 'jack']
```

- **Object** which is a standalone entity, with properties and type,
Ex:
```
client = {
  name: "Harry Potter",
  age: 20,
  eyeColor: "blue"
};
```

## Primitive Data Types

- **Number** which is used for floating-point numbers, 
Ex:
```
num = 1;
```

- **String** which is used for sequence of characters,
Ex:
```
name = 'Mike';
```

- **Boolean** which is used for logical type that can be only true or false,
Ex:
```
flag = true;
```

- **Undefined** which is used for a variable that got declared and yet not assigned to a value (empty value),
Ex:
```
value;
console.log(value)     // undefined
```

- **Symbol (ES2015)** which is used for value that is unique & cannot be changed,
Ex:
```
client = {
  name: "Harry Potter",
  age: 20,
  eyeColor: "blue"
};
id = Symbol('id');
client[id] = 101959; // you added an id to client named 'Harry Potter'
```

- **BigInt (ES2020)** which is used for larger integers than the number type can hold,
Ex:
```
bigNum = BigInt("123456789012345678901234567890123456789");
```
 
Note: 
> in both the array & the object can contain different types of data.