teleren/devto huggingface dataset:
Pigshell x Appwrite Hackathon
Tags: appwritehack, webdev, javascript, react
Published: 2022-04-14 14:50:10

Recently, I came across the Appwrite hackathon. It seemed a cool way for me to get better acquainted with the Appwrite service, since I have been seeing it a lot on Dev news. 
So here I am with the idea for my submission.

## What am I building?
Being in my 3rd year of `CS Engineering`, I have been introduced to image processing. It is really an interesting domain to work in.

So to get familiar with it, and what better way that building something in hackathon, I have decided to build a Web App.
It is a really simple one : _a pixel to ASCII filter_.

Great projects have **awkward** names. So I decided to name it :

## Pigshell
Sounding familiar? Well, pixel, pigshell. 
<img width="100%" style="width:100%" src="https://media.giphy.com/media/rdma0nDFZMR32/giphy.gif">

## The basic features include :
 
1. Uploading an image and converting it into ASCII image.
2. Saving it in the users account.
3. Retrieving them from any where.

## Tech Stack
| Tech       | Used for |
|------------|----------|
| ReactJS    | Frontend |
| Appwrite   | Backend  |
| CSS        | Styling  |
| Javascript | Language |

## Follow Ups
 
In a distant or near future, I will also try to integrate video conversion from pixels to ASCII.
Also, add a video recording and uploading to account option.

You can checkout my [Github Pigshell](https://github.com/thevinitgupta/Pigshell) repository for code updates!!

Happy Hacking.
code comparing?
Tags: devjournal, programming, webdev, beginners
Published: 2022-04-14 14:48:36

When I first started coding, I wanted to learn everything at the same time. this is the programmers guide to first mistake. - it's literally impossible. So, avoiding this is the 101.

When realizing the time you have, you must then define what career to define for you. - This shouldn't take that long.

Afterwards, have an overview of what languages and technologies exist in that career (e.g: front= html,css,js most of the time).
Realizing what works, what's "new", what's a stable line of work, can increase your learning curve exponentially.

When you have decided what you want to work on, focus on it and grab courses, videos, books, etc. - this will help you reach your goals faster. - However, I must point out that you WILL change some of these later on in your carrer. For some, because you will find out there are better and cleaner ways of coding, for others because they want to grow out of that single line of work. this **WILL** happen to you, at some point or another. but make sure you have a concrete idea of the language you will be "dropping" for the time being. it's better to know a good amount before trying new things.

I guess you can say this is part1.
Upgrade your JHipster project to Java 17
Tags: java, jhipster, spring, backend
Published: 2022-04-14 14:39:24

# Run and deploy a JHipster project with Java 17

Created: April 5, 2022 9:38 AM
Tags: java, jhipster, spring

In this short article, I’ll explain how to run and deploy a JHipster project using another version than the standard version which is used by JHipster (Java 11 currently).

## Step 1: Make it run on the targeted Java version

### Use the right Java version locally

Firstly, you need to have the targeted Java version on your local environment. If you are using [SDK man](https://sdkman.io/) you can run:

- `sdk list java`
- Once you have found the target version inside, install it with `sdk install java 17.0.2-open` (for instance)
- Finally, run `sdk use java 17.0.2-open` to use it in your current terminal

<aside>
💡 SDK man is a great tool to manage multiple Java versions on your environment. It allows to easily install versions and switch between versions

</aside>

### Set the right Java version for the project

Once you are using the right Java version locally, you just have to change the target release in the project. If you’re using Maven, you just need to change `<java.version>17</java.version>` in the `pom.xml`

🎉 You are now ready to go, you can try to run the project with `./mvnw`

<aside>
💡 If you see an error saying “Invalid target release 11”, it’s probably that your local and project version are out of sync. They have to be the same (17 in my use case)

</aside>

## Step 2: Fix the CI

If you are using a CI and your CI is using the `jhipster/jhipser:latest` Docker image to run the project and the tests, it won’t work anymore because this Docker image is based on `eclipse-temurin:11-jre-focal` which is using Java 11.

It means that you will have to recreate your own Docker image based on Java 17, but don’t worry, it’s not complicated:

- Clone the [generator-jhipster](https://github.com/jhipster/generator-jhipster) project on Github
- Open the Dockerfile which is at the project’s root
- Edit the base image to `eclipse-temurin:17-jre-focal`
- Create a repository on the docker hub. Let’s assume it’s called `myOrganization/jhipster-java-17`
- Build the new image with `docker build . -t myOrganization/jhipster-java-17:latest`
- Push the brand new image to the hub with `docker push myOrganization/jhipster-java-17:latest`
- Finally, change the docker image used in your CI to `myOrganization/jhipster-java-17:latest` and when your CI reruns, it will succeed.

## Step 3: Edit your Cloud environment

At [BearStudio](https://www.bearstudio.fr/en), we are using [CleverCloud](http://clever-cloud.com) which allows to edit the target Java version very easily thanks the `CC_JAVA_VERSION` environment variable, which set up to 17 before saving your changes.

**You’re done, your JHipster project should now run on Java 17 🎉**

<aside>
If you don’t use JHipster yet, you can learn how to generate your first project with JHipster with [this article](https://www.bearstudio.fr/blog/developpement/jhipster-generateur-projet-hipsters) (which is in French).
</aside>
Which JavaScript framework should I choose?
Tags: anonymous, help, discuss, javascript
Published: 2022-04-14 14:38:59

_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._

***

Angular, React, Vue, Ember, Node... there's quite a few different JS frameworks out there.

How would you go about choosing a JavaScript framework to learn or to use in a new project?
Azure Data Bricks
Published: 2022-04-14 14:26:36

Azure Databricks is a fully managed, cloud-based Big Data and Machine Learning platform, which empowers developers to accelerate AI and innovation by simplifying the process of building enterprise-grade production data applications. Built as a joint effort by the team that started Apache Spark and Microsoft, Azure Databricks provides data science and engineering teams with a single platform for Big Data processing and Machine Learning.

By combining the power of Databricks, an end-to-end, managed Apache Spark platform optimized for the cloud, with the enterprise scale and security of Microsoft's Azure platform, Azure Databricks makes it simple to run large-scale Spark workloads.

**<u>Optimized environment</u>**
To address the problems seen on other Big Data platforms, Azure Databricks was optimized from the ground up, with a focus on performance and cost-efficiency in the cloud. The Databricks Runtime adds several key capabilities to Apache Spark workloads that can increase performance and reduce costs by as much as 10-100x when running on Azure, including:

High-speed connectors to Azure storage services, such as Azure Blob Store and Azure Data Lake
Auto-scaling and auto-termination of Spark clusters to minimize costs
Caching
Indexing
Advanced query optimization
By providing an optimized, easy to provision and configure environment, Azure Databricks gives developers a performant, cost-effective platform that enables them to spend more time building applications, and less time focused on managing clusters and infrastructure.
Django Tutorial Part 4 -- admin ページでテーブルの中身を編集する
Tags: django
Published: 2022-04-14 14:14:28


https://docs.djangoproject.com/en/4.0/intro/tutorial02/#introducing-the-django-admin

---

## DB管理ページ用のスーパーユーザーを作る

https://docs.djangoproject.com/en/4.0/intro/tutorial02/#creating-an-admin-user

```php
docker-compose run web \
python manage.py \
createsuperuser
```

createsuperuser を打つ

```php
Creating rest0406_web_run ... done

Username (leave blank to use 'root'): kaede0902
Email address: kaede0902js@gmail.com

Password: 
Password (again): 

Superuser created successfully.
```

* ユーザー名
* メアド
* パスワード

これらを要求されるので入力して作成した。

---

## localhost:8000/admin にアクセスして Django の DB 管理ページにログインする

```php
docker-compose up
```

runserver で動かす

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

```php
localhost:8000/admin
```

にアクセスすると

```php
http://localhost:8000/admin/login/?next=/admin/
```

`login/?next=/admin/` にリダイレクトされて管理画面のログイン画面が出る

ユーザー名とパスワードでログインできる。
メアドとパスワードではログインできない。


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

Groups と Users のテーブルができている。

Users のテーブルにアクセスしてみる。

---

## Users のテーブルを Django Admin から編集する

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

ここで ADD USER を押すことで

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

新しいユーザーを作成できる。
createsuperuser コマンドで作る時よりバリデーションが厳しい。

permissin や First/Last name やメアド、最終ログイン日時を編集できる。

```php
web_1  | [14/Apr/2022 13:46:56] "GET /admin/jsi18n/ HTTP/1.1" 200 3195
```

サーバーを見ると　GET /admin/userId/ が動いてる

---

## polls アプリを admin ページに反映させる

https://docs.djangoproject.com/en/4.0/intro/tutorial02/#make-the-poll-app-modifiable-in-the-admin

前回のチュートリアルで作成した polls アプリの Question や Choice のテーブルは admin ページには反映されていなかった。Groups と Users しかなかった。

なので反映させる設定を書く必要がある。

なので `polls/admin.py` のページに

```py
from django.contrib import admin

from .models import Question

admin.site.register(Question)
```

django の contrib ライブラリから admin をインポートして
models から Question のテーブルをインポートして

admin のサイトに Quesion のテーブルを登録する。


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

リロードすると Quesiton テーブルが Polls アプリのものとして表示されている。


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

アクセスすると Question テーブルの中身のリストが見れて

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

一つ一つ編集できる

追加も削除もできる。
Beginner’s Guide to Laravel API Resource
Tags: laravel, beginners, tutorial, php
Published: 2022-04-14 13:58:43

In this tutorial, we’ll learn what Laravel API Resources are, and how to use them in our Laravel project. We are going to create a user and post API resource in this project example.

## Working with Laravel API Resource
For more, you can go and read the Laravel documentation about API resources.

## Watch the video for more details.

Create User Resource
Resources are created on top of an eloquent model. So this means that we need to create a resource for every eloquent model separately.

To create a resource we need to run the following command on the terminal.
`php artisan make:resource UserResource`
Read more at [blog.laraveller.com](https://blog.laraveller.com/beginners-guide-to-laravel-api-resource/)
How to Find Your WiFi Password and Share It With Others Through a QR Code in Bash!
Tags: bash, npm, tutorial, linux
Published: 2022-04-14 13:50:37

Did you ever forget your WiFi password? Or did you ever have guests over and needed an easy way to share your WiFi? 
Well in this mini-tutorial, I'll show how you can easily find your WiFi password and share it with others through a QR code using a command-line tool.

##Installing the Tool
The tool that is going to allow you to do this needs to be installed through [NPM](https://www.npmjs.com/) so make sure you have NPM installed. You can use this guide for [installing NPM](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm).

Once you have NPM installed, install the **wifi-password-cli** module using:
```bash
npm install --global wifi-password-cli
```

##Using the Tool
Now that you have the module installed, use the following to see its usage:
```bash
wifi-password --help
```
You will see the following output:
```bash
usage: wifi-password [options]

optional arguments:
  -h, --help            show this help message and exit
  --show-qr, -show      Show a ASCII QR code onto the terminal/console
  --save-qr [PATH], -save [PATH]
                        Create the QR code and save it as an image
  --ssid SSID, -s SSID  Specify a SSID that you have previously connected to
  --version             Show version number
```

You can simply display your WiFi password through the terminal using:
```bash
wifi-password
```
This will prompt you with a security sudo user confirmation window:
![Security prompt](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dw5xgi2b1vvx96fr6hki.png)

I have a macOS, but you will see a different prompt depending on your OS. Enter the required information and your WiFi password will be displayed in terminal!

You can use the following command to generate and display a QR code of your WiFi password for guests to scan:
```bash
wifi-password --show-qr
```
You can save this QR code as an image using the following command:
```bash
wifi-password --save-qr [PATH]
```
You can choose where to save the image by varying the path argument at the end, for example:
```bash
wifi-password --save-qr /usr/local/images
```

##Conclusion

I hope this will come in helpful ;)
Um jovem, um negro, uma mulher, uma pessoa trans não são cotas, é uma necessidade nas empresas.
Tags: diversidade, inclusão
Published: 2022-04-14 13:49:47

Nos últimos dias tenho conhecido e falado com muitas pessoas da área de tecnologia, que têm feito trabalhos incríveis de inclusão daqueles que não são vistos nas empresas, o que chamamos de minorias. 

> 53% dos millennials deixariam seus empregos por uma empresa mais inclusiva - Deloitte, 2018

Nós precisamos entender que quanto mais diversidade a gente proporciona nos ambientes de trabalho,  muito mais vantagens competitivas estamos criando, melhores serão nossos produtos, mais eficientes se tornam nossas relação com nossos clientes,  e mais duradouras nossas relações com funcionários ou colaboradores (não importa como queira chamar).

Valorizar as diferenças tem um investimento que precisa ser encarado como necessário, não devemos fazer apenas para cumprir uma legislação, mas devemos realizar porque somos maduros e entendemos a necessidade.

> 34% da receita de empresas mais diversas vem de produtos e serviços inovadores, contra 25% das empresas do grupo de comparação - BCG & TUM, 2017

Ambientes diversificados tem colaboradores 17% mais dispostos e a ocorrência de conflitos é menor que 50%, segundo alguns estudos.

Se você lidera uma empresa, um time, um grupo na escola, uma ong, você precisa urgente realizar atividades que promovam a diversidade, você precisa ser o agente de mudança de mentalidade das pessoas que estão ao seu redor.

> 67% dos profissionais consideram Diversidade como um importante fator ao escolher um empregador - Glass Door, 2014

Um bom começo para isso é olhar pessoas através das suas soft skills, ter um olhar para além dos hard skills, como inteligência emocional e capacidade de liderança. Toda e qualquer característica pode ser treinada, mas precisamos de modelos para que isso seja possível.

Diversidade é uma estrada fundamental no caminho estratégico que deve estar no radar de todo e qualquer tipo de negócio, seja ele social ou não. 

Comece já a implementar a mudança.
Adding proxy config to the single spa angular
Tags: singlespa, angular, microfrontend, webpack
Published: 2022-04-14 13:25:57

- In this post, I am going to explain how you can configure proxy for interacting your backend api from your angular front end services.

## Common proxy config in an angular app
- while working with angular application, We always create `proxy.config.json` file and will serve the proxy config while application running. 

- But, why does the same config fail when we run single spa (micro-frontend) angular app?

1. Because, We are building our angular application using [webpack](https://webpack.js.org/).
2. While serving application, we are sharing our application as a **remote** module or component or library in different port which need to be consumed by **host/shell/root-config**.
3. Let say, your are serving your angular app in port 5000 and the host is running in port 7000.

4 . You need to register your angular app port with host port by using `system-importmap` and `registerApplication()

5 . As we know, [single-spa](https://single-spa.js.org/) host app here is going to route the other micro-frontend apps, we need to handle proxy inside `webpack.config.js` file

6. Inside the `webpack.config.js`, we have add proxy config and then re-run the host

`webpack.config.js`


![SPA-PROXY](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/49vfgc7mkxigc745tiwo.PNG)


For reference click here [Webpack Proxy](https://webpack.js.org/configuration/dev-server/#devserverproxy).

Thanks for reading :)
How to Add Content to Your Body
Tags: react, typescript, tutorial, webdev
Published: 2022-04-14 13:23:05

## Welcome Back!
**Where we left off** - [GitHub](https://github.com/samp-reston/my-website/tree/d1aac8da5e053d39d12e442b0a8342aa308827da)

**What we're doing today**:
- Adding content to the main body

---

## Time for the chit chat
Now we have divided our component into a component tree and developed the areas in the DOM specifically for the content (body and footer), we can add the content.

First things first, following the principles of TDD we need to write a test within `Title.test.js` for the secondary heading as per the design.

```js
test('secondary header is visible', () => {
  render(<Title />)

  const secondaryHeading = 'Full-Stack Engineer'
  screen.getByText(secondaryHeading)
})
```

Now running the test will fail due to us not adding the content into the Title component. However, before we can do that we need to check the design.

When creating my design I first what is called a wireframe.
> Wireframing is a way to design a website service at the structural level.

From the wireframe I researched the standard pixel height for the different heading levels and using those standards designed with those specific headings in mind.

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

Now we can reference that wireframe with the correct heading, which for the secondary heading is `<h3>`.

```js
function Title() {
  return (
    <div>
      <h1>
        Samuel Preston
      </h1>
      <h3>
        Full-Stack Engineer
      </h3>
    </div>
  )
}
```

Now the test passes because the content is visible when the Title component is mounted. However, the Title component isn't where we want it on the DOM:
![Non CSS](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1xwhh7k2pbuzgnwn3j95.png)
To fix this we need to create a Title.css file and import it, I have already developed the CSS ahead of time, so here it is:
```css
.title {
  color: white;
  text-align: center;
}

.main-title {
  padding-top: 1rem;
  padding-bottom: 0.5rem;
}
```
This produces still not the nicest looking style but it will do until we add our font later:
![Post CSS](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ntd2uloozngjybxt42hp.png)

We will continue this process for the rest of the components within the body:

- About Me
- My Skills
- Portfolio
- Blog

When it comes to the detailed components such as the Project and Post child components we'll add those at the end.

## GitHub
To view where we're at you can follow this [link](https://github.com/samp-reston/my-website/tree/1e56ba24ce769664b96e5d48bffb354f654588b8) to the final commit at the end of each post to follow along!
Senior Blockchain Engineer
Tags: blockchain, vacancyblockchai, webdev
Published: 2022-04-14 13:13:31




About company
Company provides Web3 infrastructure for easy, accessible and affordable deployment of blockchain nodes, API’s, decentralized staking infrastructure and Layer 2 scaling solutions, designed to lower the entry barrier for everyday people, enterprises, and developers to contribute to blockchain ecosystems.

**Responsibilities:**
- Design, code and implement business applications
- Integrate blockchains with our platform
- Work with APIs and microservices
- Design and verify cryptographic protocols deployed on the blockchain
- Define requirements, prototype and design new features for product users
- Effectively communicate technical details via documentation and demonstration

**Requirements**
- Proven track record of developing modern, secure, scalable complex applications
- Practical experience with crypto tokenomics, blockchain consensus protocols, P2P networks, cryptographic principles, key management, encryption algorithms
- Ability to use Web3 tech stack
- Familiarity or ability to use Solidity, EVM or Polkadot Substrate
- Back-end: GoLang (Go) (or C++/Rust)
- Great listener and communicator
- Bilingual or high fluency in English
- Leadership and teamwork skills
- Able to provide open-source code samples

CV
tg: @kamilla_tek_RedCode
Creating a Wordle Clone (or How I Learned to Stop Worrying and Love the Vowel)
Published: 2022-04-14 13:12:23



###### *Disclaimer, I've never seen the film. Just love the title.

## I had this [idea](https://github.com/CharleeBrown/CrossUp-WordGame)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2jwzzoo2sucwe6x9oli5.jpg)
for a wordle clone of sorts.
Well, it is and it isn't a clone.
My idea is to take the aspect of a crossword and merge it with the wordle idea.

Rules are : you get one guess, but you do get a hint.
I'm struggling with two main things at the moment.

- I'm not sure how i want to style the inputs
- I'm not sure If it should be one try and three
:	One try may make the user more annoyed.
:	Three tries may be too many.

Let me know your thoughts in the comments.
DB2 backup/restore schema
Tags: db2, backup
Published: 2022-04-14 13:07:58

---
title: DB2 backup/restore schema
published: true
description: 
tags: db2, backup
---

# Creating the backup

Exporting DDL from EXAMPLE schema:
```
db2look -d MYDB -z EXAMPLE -e -o EXAMPLE.sql
```

Exporting data from schema:
```
db2move MYDB export -sn EXAMPLE
```

The `db2move` command will create a lot of files, incluing `db2move.lst`.

It contains internal tables like EXPLAIN_* and ADVISE_*. If you don't need them just delete de corresponding lines from `db2move.lst`.

# Restoring backup

Creating objects:
```
db2 -t -f EXAMPLE.sql
```

Restoring data:
```
db2move MYDB import

db2move MYDB import -io insert_update
```