teleren/devto huggingface dataset:
Remove /web from URL in Drupal
Tags: php, drupa, webdev, programming
Published: 2022-09-20 17:30:16

By default, when you create your Drupal project using composer it will create project under `/web` directory.

When you’re using shared hosting for your Drupal website which points your domain to `/public_html` folder and you’re not allow to change that pointing directory

Now whenever your targeted audience will have to visit your website, they must open it like this `http://example.com/web`. and which is not a good user experience to add /web at the end of your URL to view home page of your website.

So, how can we serve our website from `/public_html/web` folder but no need to append /web in URL by your targeted audience?

Here is the summary, which I learned:

**1- Move all files and folders from `web` to root folder**
**2- Open `composer.json` remove `/web` and add `./`**
```
"drupal-scaffold": {
 "locations": {
    "web-root": "./"
 }
},
```
**3- Remove `/web` from composer.json in `installer-paths`**
```
"installer-paths": {
  "core": [
    "type:drupal-core"
   ],
  "libraries/{$name}": [
   "type:drupal-library"
  ],
   "modules/contrib/{$name}": [
     "type:drupal-module"
   ],
   "profiles/contrib/{$name}": [
     "type:drupal-profile"
    ],
    "themes/contrib/{$name}": [
     "type:drupal-theme"
     ],
     "drush/Commands/contrib/{$name}": [
      "type:drupal-drush"
     ],
     "modules/custom/{$name}": [
       "type:drupal-custom-module"
     ],
     "profiles/custom/{$name}": [
       "type:drupal-custom-profile"
    ],
    "themes/custom/{$name}": [
       "type:drupal-custom-theme"
      ]
  },
```

**4- Open file `autoload.php` replace code with:**
```php
return require __DIR__ . '/vendor/autoload.php';
```

5- Remove `vendor` and `core` folders and run this command:
```bash
$composer install
$drush cr
```

> If there is a better way than this, please let me know in the comments. Thanks
Autentifikácia v Ionic (ver.5) aplikácii cez REST API (1.časť) - requesty
Tags: ionic, laravel
Published: 2022-09-20 17:16:42

V nasledujúcich niekoľkých postupoch ukážem, ako si implementovať autentifikáciu (tj.registráciu, prihlásenie a odhlásenie) v Ionic aplikácii (vo verzii framework-u 5) cez REST API služby (ktoré mám urobené nad MySQL databázou cez Laravel backend-ovú aplikáciu).

Pre potreby tohto Ionic projektu mám vypublikované tieto REST API servisy:

1.) **registrácia nového používateľa**: 
typ requestu: POST
URL: 
```
http://127.0.0.1:8000/api/register
```
odovzdávané/posielané parametre: **name**, **email**, **password**

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/svdfh9m6gse2hin60csw.PNG)
V prípade úspešného vykonania tohto request-u je vrátené (niečo takéto):

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


2.) **prihlásenie existujúceho používateľa**:
typ requestu: POST
URL: 
```
http://127.0.0.1:8000/api/login
```
odovzdávané/posielané parametre: **email**, **password**

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n516qbywfmx3vwbt498g.PNG)
V prípade úspešného vykonania tohto request-u je vrátené (niečo takéto):

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

3.) **odhlásenie prihláseného používateľa**:
typ requestu: POST
URL: 
```
http://127.0.0.1:8000/api/logout
```
odovzdávané/posielané parametre: **token** (získaný pri prihlásení)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nrmsabfqtax7nbbx3tb8.PNG)
v prípade úspešného vykonania tohto request-u je vrátené:

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


a ešte na overenie fungovania (a test):

4.) **navrátenie informácii o prihlásenom používateľovi** (cez GET):
typ requestu: GET
URL:
```
http://127.0.0.1:8000/api/user
```
odovzdávané/posielané parametre: **token** (získaný pri prihlásení)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/idy2aze6pp4px8wvpytk.PNG)
V prípade úspešného vykonania tohto request-u je vrátené (niečo takéto):

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

5.) **navrátenie informácii o prihlásenom používateľovi** (cez POST):
typ requestu: POST
URL:
```
http://127.0.0.1:8000/api/me
```
odovzdávané/posielané parametre: **token** (získaný pri prihlásení)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0znldz3ku9thy32h4tjw.PNG)
V prípade úspešného vykonania tohto request-u je vrátené (niečo takéto):

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y64d2vczeaqb1w1iydov.PNG)
SARAL: The mission control for your influencer program
Tags: influencer, media, relationship, managementcreator
Published: 2022-09-20 16:59:12

SARAL is the simple, affordable, and user-friendly influencer marketing tool built specifically for small and emerging DTC brands. 

With SARAL, influencer marketing boils down to 3 simple steps. 

1. Find influencers (with metrics and contact info) using their chrome extension. 

2. Send automated and personalised cold outreach campaigns. 

3. Build and manage long-term relationships with creators. 

It's a one-stop-shop for all your influencer marketing needs. With SARAL, you actually systemise your influencer marketing efforts, which is what gets you results.  

We don't do unfair upfront annual contracts, or have a month-long onboarding process. 

If you're still using google sheets or some other tool to manage influencers, you're wasting HOURS each week on stuff that does not move the needle. It's time to get SARAL to automate the boring work and make some real money with influencers. 

Simply sign up and take advantage of the 7-day free trial for your brand! 

https://www.getsaral.com
3 WordPress Plugin Boilerplate
Tags: plugins, tutorial, wordpress
Published: 2022-09-20 17:18:46

---
title: 3 WordPress Plugin Boilerplate
published: true
date: 2022-09-20 16:55:54 UTC
tags: Plugins,Tutorial,WordPress
canonical_url: https://blog.kamalhosen.me/3-wordpress-plugin-boilerplate/
---

WordPress plugins are a great way to add custom functionality to your site. However, they can also be a great way to add clutter and bloat to your site if you’re not careful. That’s why it’s important to start with a plugin boilerplate. A plugin boilerplate is a set of files and folders that contain the minimum amount of code needed to create a working WordPress plugin.  
There are many different ways to set up a WordPress plugin boilerplate. In this post, we’ll take a look at four of the most popular methods

## WP CLI

The wp-cli plugin scafold is a command line interface tool that allows you to quickly generate a plugin scaffold. This is a great tool for developers who want to create a new plugin quickly and easily. The plugin scaffold will create all of the necessary files and folders for you, so all you need to do is fill in the code.

```
wp scaffold plugin my-plugin
```

Please note that this script must be run within your WordPress plugins directory else it will throw an error. All available commands [here](https://developer.wordpress.org/cli/commands/scaffold/plugin/)

## [WP Strap](https://github.com/wp-strap/wordpress-plugin-boilerplate)

This open-source project offers a well-organized and object-oriented boilerplate for WordPress plugin development and testing. The Boilerplate is based on the [Plugin API](https://codex.wordpress.org/Plugin_API), [Coding Standards](https://codex.wordpress.org/WordPress_Coding_Standards), and [Documentation Standards](https://make.wordpress.org/core/handbook/best-practices/inline-documentation-standards/php/) and can be installed using Composer. It includes Codeception (unit/acceptance tests), TravisCI (continuous integration), and PHP\_CodeSniffer (code style checks).

```
npx wp-strap plugin
```

This package includes Composer, Codeception (unit/acceptance testing), PHPCodeSniffer with WordPress Coding Standards to validate your code, TravisCI configuration for automatic testing & continuous integration, and Webpack 5 for front-end development with BabelJS v7, BrowserSync v2, PostCSS v8, and PurgeCSS v3.

## [WPPB.me](https://wppb.me/)

![](https://blog.kamalhosen.me/wp-content/uploads/2022/09/image-1024x504.png)

This project was started by Tom McFarlin’s WPPB foundation plugin and is now maintained by Devin Vinson. It provides a simple form for specifying plugin details and generating a zipped folder containing the plugin files.
Release NPM Package With Automatic Versioning
Tags: npm, node, devops, javascript
Published: 2022-09-20 16:52:23

I know there are many ways to automate the package release workflow, but sometimes all you need is a simple one line script that takes care of versioning and publishing.

```json
{
  "name": "my-awesome-package",
  "version": "1.0.0",
  "scripts": {
    "release": "npm version $(semver $npm_package_version -i minor) && npm publish --tag latest",
  },
  "devDependencies": {
    "semver": "^7.3.7"
  }
}
```

This **release** script increments the version number of the package and publishes the package to the NPM registry (or other registry). To correctly increment the version number, npm's [semver](https://www.npmjs.com/package/semver) package automatically finds the next version number according to the specified level **minor** (major/minor/patch).

One can, of course, create three scripts for each semver level major, minor, and patch:

```json
{
  "name": "my-awesome-package",
  "version": "1.0.0",
  "scripts": {
    "release:major": "npm version $(semver $npm_package_version -i major) && npm publish --tag latest",
    "release:minor": "npm version $(semver $npm_package_version -i minor) && npm publish --tag latest",
    "release:patch": "npm version $(semver $npm_package_version -i patch) && npm publish --tag latest"
  },
  "devDependencies": {
    "semver": "^7.3.7"
  }
}
```

## Prelease Package With User Suffix
If you are working in a team and need to release a package to test it in another project, you may want to release that package as an alpha or beta version first to avoid your colleagues accidentally installing the latest update. This intermediate version is called **prerelease**, like **1.0.0-1**. Of course, this version could still clash with an existing version from another teammate. To make the version truly unique, we can append the username to the version suffix. This results in version numbers like **1.0.1-zirkelc.1** with **zirkelc** as the username.

```json
{
  "name": "my-awesome-package",
  "version": "1.0.0",
  "scripts": {
    "release:beta": "npm version $(semver $npm_package_version -i prerelease --preid $(npm whoami) ) && npm publish --tag beta",
  },
  "devDependencies": {
    "semver": "^7.3.7"
  }
}
```

The command [`npm whoami`](https://docs.npmjs.com/cli/v8/commands/npm-whoami) returns the npm username of the currently logged-in user. This works also with private registries like GitHub Registry. The flag `--tag beta` is required because npm publishes packages with [**latest**](https://docs.npmjs.com/cli/v8/commands/npm-publish#tag) tag by default. To install this prerelease version in another package, the command `npm install my-awesome-package@beta` must be executed with the tag **beta** instead of **latest** (default tag if omitted).
Vue3 Challenge: Array Editor
Published: 2022-09-20 16:51:59

---
title: Vue3 Challenge: Array Editor
published: true
description: How to use props, watchers and emitters in Vue3? #vue #webdev #100daysofcode #challenge
cover_image: https://images.unsplash.com/photo-1541474583361-bc9527eb46d6?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1114&q=80
---

As a Developer I need a component `XArray` that can edit arrays of strings.

## Acceptance criteria

1. `XArray` accepts array of strings in v-model
2. It renders each string as separate input
3. When value of input is changed, it's written back to the array
4. If value is empty the element is removed from array
5. There is always one extra input shown, so that it is possible to add new values
6. Last input is not loosing the focus on typing and new extra input is shown below it
7. Examples in `App.vue` work as expected

## Example

Let's say that `myArray=['one', 'two']`
Given **Vue Template** should result into **Resulting HTML**.

### Vue Template
```html
<XArray v-model="myArray" />
```

### Resulting HTML

```html
<div>
  <input value="1">
  <input value="2">
  <input value="">
</div>
```

## How to submit?

1. Write in the comments "Challenge accepted".
2. Fork [stackblitz project](https://stackblitz.com/edit/vitejs-vite-sqvsky?file=README.md) and send a new link with your solution as a reply to your original comment.

Unit tests are good to have, but optional.

Share useful articles in the comments.

In a meantime I will start working on a tutorial and a solution. Don't miss it - subscribe to discussion and follow me.

## Tips

- If you are new to Vuejs, start with [tutorial](https://vuejs.org/tutorial/)
Kotlin 基礎 Part 5 -- open クラスと abstract クラスと interface の違い
Tags: kotlin, class, abstract, interface
Published: 2022-09-20 16:48:50


## why

SOLID の依存性の逆転のために真ん中に依存させる何かが欲しい！
そのために作りたい機能のクラスを作るための 「継承/実装」元の 3 つを比較してみる。

1. 通常のクラスをオープンにして関数の本体を書く
1. 抽象クラスに抽象関数のガワだけを書く
1. インターフェースに関数のガワだけを書く


---

## 通常のクラスをオープンにして関数の本体を書く


```kotlin
	open class Animal {
		open fun walk() {
			println("てくてく")
		}
		open fun eat() {
			println("もぐもぐ")
		}
	}
	class Human: Animal() {
		override fun walk() {
			println("二足歩行")
		}
	}

	val kaede = Human()
	kaede.walk()
	kaede.eat()
```

> 二足歩行
> もぐもぐ

Kotlin では open をつけたクラスは継承できる。
これを使って既に有るメソッドを上書きできる。

今回では Animal クラスを継承した Human クラスを使って
kaede というインスタンスを作成した。
上書きした walk を使うと 二足歩行が使える。
一方、上書きしてない eat も使える。

```kotlin
	val fromOpen = Animal()
```

しかし、オープンクラス自体からもインスタンスをはやせてしまう。

```kotlin
	open class Animal {
		fun walk()
	}
```

> Function 'walk' without a body must be abstract

さらに、本体はいらないのに、関数の中身を必要とされてしまう。


---

## 抽象クラスに抽象関数のガワだけを書く

```kotlin
	abstract class Animal {
		abstract fun walk()
		open fun eat() {
			println("もぐもぐ")
		}
	}
```

抽象にすれば、中身を書かなくても定義できる。
これのほうが実装と分離して書ける。

```kotlin
	val fromAbs = Animal()
```

> Cannot create an instance of an abstract class


抽象クラスからはインスタンスが作れなくなる。
これでオープンクラスのときのように元から作れる問題は解決

```kotlin
	class Human: Animal() {
		override fun walk() {
			TODO("Not yet implemented")
		}
	}
```

継承先で override で作るべき関数がない場合は赤線がでて
誘導に従えば TODO 状態で作ってくれる。かなり書きやすい。

```kotlin
	abstract class Bisinessman {
		abstract fun earnMoney()
	}

	class Human: Animal(),Bisinessman() {
	}
```

> Only one class may appear in a supertype list

また、kaede が Animal の walk,eat だけでなく
Bisinessman の earnMoney も使いたくなった時
クラスなので複数の継承元を使うことはできなくて困る。

---

## インターフェースに関数のガワだけを書く

上記の全ての問題はインターフェースを使うことで解決する。

```kotlin
interface Animal {
	fun walk()
	fun eat()
}
interface Businessman {
	fun earnMoney()
}
```

これを使ってクラスを作って中身を作る時は

インターフェースの中身を「実装」する。
抽象クラスの中身を「継承」するのではなく。


欠点を強いていえば、何かのクラス内部に作ってしまうと

> 'Animal' is an interface so it cannot be local. Try to use anonymous object or abstract class instead

インターフェースは外に出せとエラーになるくらい。

```kotlin
interface Animal {
	fun walk() {
		println(
			"んぽ"
		)
	}
	fun eat()
}
```

一方、上書きして実装しないときのデフォルトの挙動もインターフェースで書けてしまう。これをエラーにしたい時に何を使えばいいかは要検証。
Building social media for developers.
Tags: webdev, programming, showdev, javascript
Published: 2022-09-20 16:48:02

### Introduction
Currently, I am building a social media for Developers where developers can share what they have built and see what other developers are building. It's "**Devshub**".

{% embed https://devshub.xyz %}

For now, it is in the beta phase and I am listing projects from developers' portfolios but very soon Signup/Login feature will be introduced which will allow developers to share their projects themselves.

Not just signup/login but many features like "Real-time messaging, Project Analytics, Review & Feedback" is in the pipeline.

### Some glimpse of **Devshub**
1. Feeds Page
![Feeds Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c5uu339l53juhcsqpbyo.png)
2. Project Page
![Project Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zyurn70jz985kcsttrla.png)
3. Developer Profile Page
![Developer Profile Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pe860qfijbyiuwpfnb6v.png)

### Tech Stacks

- Frontend: Vue JS, Nuxt JS
- Backend: Supabase(now) -> Soon shifting to custom backend using Fastapi
- Deployment: Netlify

Just wrapping up there. I hope you will like this project and provide feedback and share with your other developer you know.

Thank you 👋👋
🗞 Rapyd Developer Newsletter: September, 2022
Tags: fintech, payments
Published: 2022-09-20 16:24:31


[**Join the Rapyd Developer Community**](https://community.rapyd.net) and solve puzzles for fun prizes, a trip to the edge of space, or $130,000 USD. 

[**Complete this survey**](https://rapyd.sjc1.qualtrics.com/jfe/form/SV_6sVd0n93fIs2Y3c) and share your input to help improve the Rapyd Developer Community. 

[**Rapyd Hackathon: Build the Galaxy’s Best Super App**](https://htg3.devpost.com/) ended September 19 @ 5:00 pm EDT. 

OMG you have to watch this video - this is pure comedy...
{% embed https://youtu.be/Ijs6lndmRgw %}

[**Say hi to Rapyd in Croatia at Infobip Shift 2022**](https://shift.infobip.com/). Stop by and meet the team, win prizes and learn about Rapyd APIs in our developer lounge. 💻

## Changelog ♻️
[Client Portal Updates]
[**Payment Links**](https://docs.rapyd.net/client-portal/docs/payment-links) has been added to the Client Portal to generate a reusable link to accept payments from your customers. You can create a set amount or an open amount where the customer can edit their own amount to pay.

The Client Portal has been updated to include a Report Settings page, which allows clients to edit the reconciliation report type and format of the CSV document. 

The [**Plugins page**](https://docs.rapyd.net/works-with/docs) has been redesigned in the Client Portal. Refer to the Plugins Guides for more details.

---

[**Join 50K+ Devs talking FinTech.** 🤓](https://community.rapyd.net)

---

## Discover 🔍
[**Seamless Payment Messaging App**](https://community.rapyd.net/t/seamless-payment-messaging-app/55266) `/community`
Learn how to create a secure PCI-compliant payment using credit cards, then save the tokens of the card and create a payment using these tokens.

[**How to Issue a Card In Sandbox**](https://community.rapyd.net/t/how-to-issue-a-card-in-sandbox/55455) `/community`
Learn how to Issue a Card in the Sandbox Environment with Rapyd. 

[**Rapyd Hack the Galaxy: Meet Mission One Winner Omri**](https://youtu.be/UqH_XNkcy2s) `/videos`
“This is all due to the hard work of developers…we make things smarter, better, easier. This is what we do”.

 
[**Hosted Checkout Page with additional fees**](https://www.youtube.com/watch?v=aOEz01f-BjA) `/videos`
Learn how to generate a hosted checkout page and include additional fees to accept from customers.

---

Want an email of Rapyd Developer Newsletters? ⏩
Click [**here**](https://go.rapyd.net/dev-newsletter) to subscribe.

---

###### Rapyd is an API first, developer focused company. The Rapyd Dev Community makes it easier to get started building payment and fintech experiences that makes global commerce possible.
Pridanie servisu do Ionic aplikácie
Tags: ionic
Published: 2022-09-20 16:23:39

V [predchádzajúcom postupe](https://dev.to/jurajchovan/vytvorenie-kostry-aplikacie-v-ionic-framework-ver5-4bhi) som si vytvoril základnú kostru Ionic (ver.5) aplikácie. [Ďalší postup](https://dev.to/jurajchovan/pridanie-stranky-do-ionic-aplikacie-4jio) ukazuje pridanie stránky do tejto Ionic aplikácie.
Teraz si vytvorím kostru servisu (ktorý bude neskôr obsluhovať autentifikáciu aplikácie).
Servis sa bude nazývať "auth". V adresári, kde mám vytvorenú túto Ionic aplikáciu spustiť príkaz:

```
ionic generate service services/auth
```

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y4n7iumjnprawjmg9dwb.PNG)
Súbory servisu "auth" sú vytvorené v adresári "../services/auth":

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9ohha8muik2wobd1csg4.PNG)
Pri tejto príležitosti si ešte vytvorím jeden servis "env", kde budem uchovávať niektoré parametre potrebné pre túto Ionic aplikáciu.

```
ionic generate service services/env
```
A len pre info - v IDE "Visual Studio Code" vidím teraz takúto štruktúru tohto projektu Ionic aplikácie:

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1vhy1cdvck9evxtenwev.PNG)
[Desafio] - Diminuir Problemas de Acoplamento
Published: 2022-09-20 16:11:03

> Conteúdo original em https://twitter.com/zanfranceschi/status/1572256034340868097

---
Ei dev,

Pra você que curte um desafio de System Design, pega esse aqui!

O desafio é melhorar uma integração com muitas falhas com um parceiro; idealmente diminuindo o acoplamento temporal.

Cola mais pros detalhes.

cc @sseraphini
 
↓

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

---

VISÃO GERAL

Esses desenhos mostram um pouco da integração entre DOLLARZ (o serviço do seu time) e COTAÇÃO DO DÓLAR (o serviço de terceiros que oferece a cotação do dólar do dia).

(Pra simplificar o desafio, a premissa é de que o dólar é cotado diariamente apenas.)

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

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

---

Rápida explicação sobre a nomenclatura CACHE MISS (e HIT):

CACHE MISS: é quando a informação não é encontrada no cache, seja pela expiração do item, seja pela aplicação não estar "aquecida".

CACHE HIT: quando a informação é encontrada no cache.

---

PROBLEMA

O horário do dia em que a cotação muda é instável (pode ser de manhã, de noite, ninguém sabe... esse serviço de cotação do dólar é realmente ruim). O melhor que o seu novo time pôde fazer foi manter um cache de uma hora, mas mesmo assim há muitas falhas (HTTP 500).

---

Essas falhas refletem no aumento das chances de mostrar a cotação errada do dólar para seus usuários. E isso acarreta em muita operação para correção e frustração dos usuários (as compras com a cotação incorreta são desfeitas).

---

DESAFIO

Tendo a liberdade total de mudança/criação do seu lado (DOLLARZ), o que poderia ser feito para melhorar a experiência do usuário e diminuir a operação de correções de inconsistências?

---

PREMISSAS

- Nada pode ser alterado no serviço COTAÇÃO DO DÓLAR;

- A área de engenharia preza pelo desacoplamento temporal ou, pelo menos, sua diminuição – tente ir nessa linha;

+

---

- O seu time notou que quando as falhas começam a ocorrer na integração (respondendo com erros HTTP 500), após cerca de 20 requisições, o serviço se restabelece (é, estranho mesmo).

---

O que DOLLARZ faz realmente não está bem descrito, mas isso não deveria ser um problema pra esse desafio fictício – foque no problema específico da integração. Não existe o jeito certo, não tem pegadinha. É apenas um exercício e faça como quiser!

---

Seria legal demais se postasse aqui seu desenho da solução.

Se leu até aqui, dá um abraço aqui ó 🫂

Muito obrigado pela moral! ♥️