teleren/devto huggingface dataset:
How to use Simple Icons on Laravel Blade
Tags: laravel, svg, blade
Published: 2021-04-11 17:55:25

# Blade Simple Icons

A package to easily make use of [Simple Icons](https://simpleicons.org/) in your Laravel Blade views.

## Requirements

- PHP 7.4 or higher
- Laravel 8.0 or higher

## Installation

You can install the package via composer:

```bash
composer require ublabs/blade-simple-icons
```

## Usage

Icons can be used as self-closing Blade components which will be compiled to SVG icons:

```blade
<x-simpleicon-laravel />
```

You can also pass classes to your icon components:

```blade
<x-simpleicon-laravel class="w-6 h-6 text-red-500"/>
```

And even use inline styles:

```blade
<x-simpleicon-laravel style="color: #FF2D20"/>
```

### Raw SVG Icons

If you want to use the raw SVG icons as assets, you can publish them using:

```bash
php artisan vendor:publish --tag=blade-simple-icons --force
```

Then use them in your views like:

```blade
<img src="{{ asset('vendor/blade-simple-icons/laravel.svg') }}" width="10" height="10"/>
```

{% github ublabs/blade-simple-icons %}
Salesforce: Scratch Orgs
Tags: salesforce
Published: 2021-04-11 17:49:52

*Salesforce has so much terminology it can be a bit overwhelming in the beginning. I am starting a series of short posts to help me learn the definitions.*

-----

##
**Scratch Orgs**
##
A disposable deployment of Salesforce code and metadata. scratch orgs are used to:

- Start a new project or a new feature branch.
- Test a new feature.
- Start automated testing.
- Perform development tasks directly in an org.

You can read more in the [scratch org docs](https://developer.salesforce.com/docs/atlas.en-us.sfdx_dev.meta/sfdx_dev/sfdx_dev_scratch_orgs.htm)
3-2-1 Newsletter: A video tutorial that lets you change the code inside the video!
Tags: javascript, node, programming, tutorial
Published: 2021-04-11 17:40:19

### Hi There!👋🏾

🙏🏾 Welcome to my blog newsletter where every week, I share a 3-2-1 **curated list** consisting of my content and also what resonated with me over the last week. 

👉🏾 In this week's post, we have **3 tweets**, a tutorial site that lets you modify the code (**being displayed in a video!**), and **a video** that digs into promisifying functions!

### 3️⃣ tweets

1] A single page #sketchnote created to explain the concept of polyfilling in JavaScript. You can download it for free and print it if you'd like.

{% twitter 1380901116024475651 %}

2] The usage of Array.prototype.fill() in order to **fill** a JavaScript array with values in bulk without having to do it manually.

{% twitter 1379815809774546946 %}

3] To check if every element in a JavaScript array satisfies a particular condition without having to use `map()` or `forEach()`.

{% twitter 1379489002986774528 %}

### 2️⃣ sites to use as playgrounds
This is a list of sites that let's us run our code and play around with it.

#### 1] Scrimba

I am not sure how I did not know about [scrimba](https://scrimba.com/) before. They create tutorials in the format which they call a **Scrim** which means you can **pause** the video and edit the code that the author is working on and run it! Sounds unbelievable, right? You've got to try out one of their free courses to get a feel of it.

#### 2] Typescript playground

This is a [playground](https://www.typescriptlang.org/play) site that is hosted along with the official documentation of typescript. It lets you run the code that you want to, while allowing you to choose the version of TypeScript to target, the version of JavaScript to compile to and it also shows you the compiled JavaScript equivalent of your code. 

### 1️⃣ video that you might find interesting

In this week's video, we have a tutorial on promisifying a function so that we do not have to deal with callbacks. We create a wrapper **higher-order** function that returns a promisified version of the original function. Check it out here:

{% youtube o2BkWpQEWto %}

If you liked that curated list, make sure you **follow me** on [Twitter](https://twitter.com/Kokaneka) so that you get the resources in your feed the day I post it, instead of later down the week as a part of this newsletter.

[![My Twitter profile](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/si0akwh53r7b5103iqtz.png)](https://twitter.com/Kokaneka)

Hope that helped! As always, keep rocking.
Cheers :)
Add Your Open-Source Discord Bot To This List!
Tags: contributorswanted, opensource, discord, beginners
Published: 2021-04-11 17:31:34

I find it difficult to find a list where good open-source Discord Bot repositories are listed. Therefore I created a [GitHub Repo](https://github.com/gillesheinesch/opensource-discordbots) with a list of Discord Bots that we believe have potential and that developers who are looking for open-source projects can help.

Everyone can add their Discord Bot if it's open-source!
LINK: https://github.com/gillesheinesch/opensource-discordbots
Swiggy Clone App || Microservices || React || Node JS
Tags: node, react, microservices
Published: 2021-04-11 17:30:27

---
title: Swiggy Clone App || Microservices || React || Node JS
published: true
description: Swiggy Clone App || Microservices || React || Node JS
tags: nodejs, react, microservices
cover_image: http://img.youtube.com/vi/VJFm8XRn6AU/0.jpg
---

https://www.youtube.com/watch?v=VJFm8XRn6AU&list=PLIGDNOJWiL1-r0EBC_jnlL5-gIiRIOuwv
https://github.com/tkssharma/swiggy-clone

[![](http://img.youtube.com/vi/VJFm8XRn6AU/0.jpg)](http://www.youtube.com/watch?v=VJFm8XRn6AU "")

I am Building Swiggy Clone App to teach Nest JS with React using Different Microservices 

![App Arch](https://raw.githubusercontent.com/tkssharma/swiggy-clone/master/diag/swiggy-clone.png)

Technologies Used 
- React 
- Redux
- nestjs
- typeorm
- postgres
- nestjs microservices
- firebase 
- many more ...

It's really helpful for developers who are exploring the opportunity to build full-stack applications.

I hope you will find this helpful.
PAN-OS IPv6 Error: bgp peer local address 0:0:0:0:0:0:0:0 does not belong to interface
Tags: bgp, ipv6, panos, routingswitchingstud
Published: 2021-05-01 23:33:24

---
title: PAN-OS IPv6 Error: bgp peer local address 0:0:0:0:0:0:0:0 does not belong to interface
published: true
date: 2021-04-11 17:25:00 UTC
tags: BGP,IPv6,PANOS,RoutingSwitchingStud
canonical_url: 
---

 

[![](https://lh3.googleusercontent.com/-xPQZzYBJmVM/YHMu1EmZgcI/AAAAAAAABQg/8RUi5_YamdgSUQHqjPdk0zSnV2JM9XckQCLcBGAsYHQ/s16000/image.png)](https://lh3.googleusercontent.com/-xPQZzYBJmVM/YHMu1EmZgcI/AAAAAAAABQg/8RUi5_YamdgSUQHqjPdk0zSnV2JM9XckQCLcBGAsYHQ/image.png)
When encountering this error, please ensure that "Enable IPv6" is set under interfaces:

[![](https://lh3.googleusercontent.com/-uzwYov0A6Lo/YHMv4r1h_8I/AAAAAAAABQs/UqXdtrLwTagq8vtN8de33EjoS-SAzWhnACLcBGAsYHQ/s16000/image.png)](https://lh3.googleusercontent.com/-uzwYov0A6Lo/YHMv4r1h_8I/AAAAAAAABQs/UqXdtrLwTagq8vtN8de33EjoS-SAzWhnACLcBGAsYHQ/image.png)
  

Hope this helps! Happy IPv6ing!
Transcribe speech input to text on Azure Cloud
Published: 2021-04-11 17:01:07

## Introduction

The Speech-to-Text aspect of the Speech service transcribes audio streams into text. Your application can display this text to the user or act upon it as command input. You can use this service either with an SDK client library (for supported platforms and languages) or a representational state transfer (REST) API.

## Overview of speech-to-text

The Speech-to-text aspect of the Speech services, in Azure Cognitive Services, provides a real-time transcription of audio streams based on machine learning and artificial intelligence. The Speech services APIs allow developers to add end-to-end, real-time speech transcription to their applications or services.
Speech services are designed to perform real-time speech-to-text for scenarios like:

* Translation of live presentations
* In-person or remote translated communications
* Customer support
* Business intelligence
* Media subtitling
* Multilingual AI interactions

## Create a Speech Service
Before you can begin performing your speech-to-text translation, you need to create an Azure Speech resource. You can do this by using the Azure portal, the Azure CLI, or the Cloud Shell. This exercise will use the Azure portal.

1. Sign in to the Azure portal.

2. Select + Create a resource. In the Search the Marketplace box, type speech and press Enter.

3. In the Results list, select Speech. In the Speech pane, select Create.

4. Enter a unique name for your Speech Service resource.

5. Select an appropriate subscription.

6. Choose a location to host the resource. This is typically the region where the resource will be used.

7. For the Pricing tier, select a tier. The tiers may change but currently, you can selects F0 or S0. For testing, we selected F0.

8. Create a new resource group (RG) named mslearn-speechapi to hold your resources. You can also choose an existing RG if you wish

9. Select Create to create a subscription to the Speech Translation API.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1xelkx8z2njkfs1tluq3.png)
Editing your fish history
Tags: fish, shell, terminal
Published: 2021-04-11 17:16:20

Using your terminal history can save time or help you to remember commands you have not used in a long time. If you make typos in fish they still go into your history. There are a couple of ways to remove commands from your fish history.

Get a list and delete some or all of the commands that match the string:
```
history delete --contains "search string"
```

example:
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b0w3ngfcu0mc4semmki4.png)

-----

Open your history file. You can delete the command and time stamp for any commands you want to remove.
```
code ~/.local/share/fish/fish_history
```
-----


wipe everything clean:
```
history clear
```
-----

docs:
https://fishshell.com/docs/current/cmds/history.html
CentOS ve RHEL'de VirtualBox 6.1 Kurulumu
Tags: centos, redhat, virtualbox, installation
Published: 2021-04-11 17:02:24

Virtualbox, Oracle tarafından yayımlanan ve geliştirilen, açık kaynak kodlu bir sanallaştırma programıdır.
Oracle VM VirtualBox 5.2 sürümünden bu yana, SSE2 CPU uzantısı gerekmektedir.  Oracle VM VirtualBox kernel modülleri: vboxdrv, vboxnetflt, ve vboxnetadp bu kurulum ile veraber gelmektedir ve bu modüller sayesinde çalıştırılmaktadır.

## Virtualbox deposunu eklemek

```shell
$ sudo dnf -y install wget
$ wget https://download.virtualbox.org/virtualbox/rpm/el/virtualbox.repo
$ sudo mv virtualbox.repo /etc/yum.repos.d/
```

## Oracle depo imzasını içeri aktarmak

```shell
wget -q https://www.virtualbox.org/download/oracle_vbox.asc
sudo rpm --import oracle_vbox.asc
```

## Ek paketleri kurmak

Bu adım EPEL deposunun eklenmesini gerektirir.

```shell
sudo dnf -y install binutils kernel-devel kernel-headers libgomp make patch gcc glibc-headers glibc-devel dkms
```

## Virtualbox kurulumu


```shell
sudo dnf install -y VirtualBox-6.1
```

## Son ayarlamalar

```shell
sudo usermod -aG vboxusers $USER
sudo /usr/lib/virtualbox/vboxdrv.sh setup
```
CentOS ve RHEL'e Mainline Kernel Kurulumu

Tags: redhat, linux, centos, kernel
Published: 2021-04-11 17:01:46


CentOS veya RHEL kullananlar bilir ki, bu iki işletim sistemi sürekli en uyumlu ve en optimal sürümleri destekler. Çünkü bu iki işletim sistemi de özellik eklemekten ziyade kararlı kalmayı hedef almaktadır. Ancak benim gibi bazı sürücüleri sebebi son sürün kernel kullanmak isteyen (en azından 5.x sürümleri) kişiler kernel 4.x sürümülerine sahip olan bir işletim sistemini kullanmakta zorluk yaşamakta. İşte bu noktada yardımımıza EPEL depoları ve ElRepo-Kernel koşuyor.

## EPEL Kernel Deposunu aktifleştirmek

Başta GPG anahtarlarını ekleyelim.
```bash
rpm --import https://www.elrepo.org/RPM-GPG-KEY-elrepo.org
```

Şimdi de depoyu ekleyelim.
```
rpm -Uvh https://www.elrepo.org/elrepo-release-8.el8.elrepo.noarch.rpm
```

Ve depo kataloglarını yenileyelim.
```
yum update
```

## Mainline Kerneli Kurmak

Mainline Kernel en son sürüm kerneli ve bunun yamalarını içermekte. Kurmak için:

```bash
yum --enablerepo=elrepo-kernel install kernel-ml -y
```

dememiz yeterli. Eğer ki bu kernele ait header dosyalarına da ihtiyacınız varsa

```bash
yum --enablerepo=elrepo-kernel install kernel-ml kernel-ml-devel -y
```

komutu işinizi görecektir.


## LTS Kernel Kurmak


LTS çekirdeği Kernel topluluğu tarafıdan yamalar ve güvenlik düzenlemeleri ile desteklenen kernel sürümüdür. Kurmak için:

```bash
yum --enablerepo=elrepo-kernel install kernel-lt -y
```

dememiz yeterli. Eğer ki bu kernele ait header dosyalarına da ihtiyacınız varsa

```bash
yum --enablerepo=elrepo-kernel install kernel-lt kernel-lt-devel -y
```

komutu işinizi görecektir.
Pluralsight Courses That Will Help You Write Better Code
Tags: learning, pluralsight, freeapril
Published: 2021-04-11 16:55:20

---
title: Pluralsight Courses That Will Help You Write Better Code
published: true
description: This is description.
tags: #learning #pluralsight #freeapril
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sad5ihjl8i3bbt9eo23h.png
---
Now Pluralsight makes every courses FREE for the entire month (April 2021). You just need to apply on this link https://www.pluralsight.com/offer/2021/free-april-individual

After you logged-in, just join my playlist at [Pluralsight Courses That Will Help You Write Better Code](https://app.pluralsight.com/channels/details/931ee8d2-1c75-4404-aea3-626bf6e6f083?s=1)

Happy learning 😉 

![Pluralsight Courses That Will Help You Write Better Code](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hysibdtnzg3p5dxwwtqv.png)
*Big O Notation**
Published: 2021-04-11 16:50:59

I am studying data structures and algorithms. A big part of data structures and algorithms is Big O Notation. What is Big O Notation? At first you may think of this complicated math computation, but it can be broken down into simple terms.

 First lets give Wikipedia's definition and then I will break the definition down. ***Big O Notation*** is defined as a mathematical notation that describes the limiting behavior of a function when the argument tends towards a particular value or infinity. Big O is a member of a family of notations invented by Paul Bachmann, Edmund Landau and others. In computer Science big O notation is used to classify algorithms according to how their run time or space requirements grow as the input size grows.

Lets break the definition down a bit.  Big O notation is trying to answer a question and that question is if there are N data elements, how many steps will the algorithm take? Big O notation wants to tell a story about how the algorithms performance will change when the data increases.

****I am going to discuss three of the algorithms:****

 1. **O(1)** is referred to as constant time. For example, the steps that it takes to read from an array is  just one step. You only have to complete one step to do this  algorithm and that is why it is the fastest. The algorithm takes  a constant number of steps no matter how many elements are in the array.
 2. **O(N)** is referred to as having  linear time. This is a different type of algorithm because performance is affected as the data increases. The steps increases as the data goes up.
 3. **O(logN)** is referred to having a time complexity of log time. This is an algorithm that increases one step each time that data is doubled.

Those three algorithms are the main ones that are used. We have algorithms that have worse cases, but for starters it is good to have an understanding of three that I mentioned above. Once you understand those three then I think the other algorithms will be a lot more clear. I also would like to mention the great book that I got this information from and its called **A Common-Sense Guide to Data Structures and Algorithms by Jay Wengrow** this book has been helping me out tremendously with all the core concepts.

Happy coding!
Post editor: pre-publish confirmation
Published: 2021-04-11 16:38:01

Hey everyone! Does anybody else have a problem of accidentally publishing a post instead of saving a draft? It happened to me two times past two weeks. The action is immediate. You hit the publish button in the editor, realize that it was the wrong one in a moment, but it's too late: your post is published. 

I guess that could be a good idea to show any kind of a confirmation step before actually publishing: a modal, a 5-second undo option, anything that would save from unintentional action.

What do you think?
Ruby Predicate Methods
Published: 2021-04-11 16:26:35

 **What is a predicate method?**

A method that returns true or false is called a “predicate method”.
In Ruby, the naming convention for predicate methods ends with a question mark.
This improves readability by making Ruby code read more like English.
In this article, we are going to list the handiest predicate methods in ruby with examples.


**.odd?**
```
3.odd?
true
```

**.even?**
```
5.even?
false
```

**.between?**
```
7.between?(1, 9)
true

11.between?(1, 9)
false
```

**.zero?**
```
2.zero?
false

0.zero?
true
```

**.include?**
```
[1, 2, 3].include?(3)
true

[1, 2, 3].include?(4)
false

"Hello Ruby".include?("by")
true

"Hello Ruby".include?("m")
false
```

**.key? & .value?**
```
{ num: 9 }.key?(:wrong)
false

{ str: "Hello" }.value?("Hello")
true
```

**.has_key? & .has_value?**
```
{ num1: 9, num2: 7 }.has_key?(:num2)
true

{ lang1: "Ruby", lang2: "JavaScript" }.has_value?("Python")
false
```

**.start_with? & it's opposite  .end_with?**
```
"Hello Ruby".start_with?("by")
false

"Hello Ruby".end_with?("by")
true
```

**.is_a?**
```
4.is_a? String
false

"Hello".is_a? String
true
```

**.empty?**
```
[].empty?
true

[1, 2].empty?
false
```

These ones are the handiest ruby predicate methods and still, there are more please visit [Ruby-Docs](https://ruby-doc.org/core-3.0.1/) to see the whole list.
How to blink web browser tab
Tags: html, javascript, beginners, codenewbie
Published: 2021-04-11 16:14:14

***Hello, guys In this tutorial we will learn How to blink the web browser tab using JavaScript.***

First of all, we have to understand what <a href="https://blog.stackfindover.com/what-is-javascript/">JavaScript</a> is and how it works.

To blink the web browser tab, first of all, we need to add a library to our HTML file which is given below.

```html
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
```

###How to use it:###
1. Include the titleEffect.jquery.js file
`<script src="titleEffect.jquery.js"></script>`

2. Initialize the plugin Fade through the document titles by using the ‘blink’ mode.
```js
$(function(){
  $.titleEffect({
    effect: 'blink',
    titles: [
      'jQuery',
      'Script',
      'Net'
    ]
  });
});
```
###Blink web browser tab Step by step###
First, we need to create two files **index.html** and **style.css** then we need to do code for it.

###Step:#1###
Add below code inside index.html

```html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>How to blink browser tab</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <link rel="stylesheet" href="style.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="titleEffect.jquery.js"></script>
  </head>
  <body>
    <h1>How to blink browser tab</h1>

    <script>
      $(function(){
        $.titleEffect({
          effect: 'blink',
          titles: [
            'New Notification'
          ]
        });
      });
    </script>
  </body>
</html>
```

###Step:#2###
Then we need to add code for style.css which code I provide in the below screen.

```css
* {
    padding: 0;
    margin: 0;
    font-family: 'IBM Plex Sans', sans-serif;
}
body {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
}
```

###Blink web browser tab Video Output:###
{% youtube qFI7_A8Nuzw %}


###Download titleEffect library###
###<a href="https://bit.ly/3wNZl9l"> Download </a>###
Fix "too many connections" errors with database clients stacking in dev mode with Next.js
Tags: nextjs, javascript, api, memoryleaks
Published: 2021-04-11 16:03:14

Next.js constantly rebuilds your API routes in development mode, triggering each time the creation of new instances of databases and other third-party services your back-end relies on.

This is not a very well documented part, and I've spent many hours looking for a solution, both online and within the source code of Next.js, to finally find a very simple yet elegant one: [using `global`](https://github.com/vercel/next.js/issues/7811).

Indeed the server itself does not reload, so `global` is preserved across incremental builds. So here's the helper I use to prevent the server from stacking Redis, PostgreSQL and other SDK clients:

```js
/**
 * Register service.
 * @description Stores instances in `global` to prevent memory leaks in development.
 * @arg {string} name Service name.
 * @arg {function} initFn Function returning the service instance.
 * @return {*} Service instance.
 */
const registerService = (name, initFn) => {
  if (process.env.NODE_ENV === 'development') {
    if (!(name in global)) {
      global[name] = initFn();
    }
    return global[name];
  }
  return initFn();
};
```

Yep, that's it. To use it, simply call:

```js
import knex from 'knex';

export const db = registerService('db', () => knex({
  client: 'pg',
  connection: process.env.DATABASE_URL,
}));
```

Now you won't have to restart Next.js server every 10 minutes to flush out residual clients.
[PHP] Get information about a specific YouTube video
Tags: youtube, googlecloud, php, webdev
Published: 2021-04-11 15:53:11

If you want to get the video information of a specific channel or the playlist list, I think you will use YouTube API v3.
 With PHP, it's good to use the official Google library with Composer, but for **specific videos you can get the video information more easily**.

 Specifically, the JSON that stores the video information is called from the API.
 that's all!
# JSON URL Structure
**`https://www.googleapis.com/youtube/v3/videos?id=[VideoID]&key=[APIKey]&part=snippet,contentDetails,statistics,status`**

Enter the API key obtained from Google API in [API Key].
 There are many ways to get the key on the internet, so please check it yourself.
# Sample Code
Try to get the title of a specific video from YouTube API v3.

```php
$api_key = "API Key"
$video_id = "Video ID"
$url = "https://www.googleapis.com/youtube/v3/videos?id=$video_id&key=$api_key&part=snippet,contentDetails,statistics,status";
$json = file_get_contents($url);
$getData = json_decode( $json , true);
foreach((array)$getData['items'] as $key => $gDat){
    $title = $gDat['snippet']['title'];
}
// Output Title
echo $title;
```