teleren/devto huggingface dataset:
JavaScript
Published: 2021-12-22 12:40:10

**Double equal (==) vs triple equal (===):**

Double equal (==) just compare values and triple equal (===) compare values and types.

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

_Here this code number and StringNumber look similar. Here values are the same but type is not the same for this reason, when just checking values it returns true but when checking values and types it returns false._

**What is an API, the purpose of API, GET, POST:**

> API means data connection from one software product to another one. Sometimes in our projects we use api. We collect data from the internet and sometimes we also send some data to reuse in future. 
> Get is used to request data from a specified resource.
> Post is used to send data to a server to create or update a resource.


**Scope, block scope, window, global variable, global scope:**

> Scope determines the visibility or accessibility of a variable or other resource in the area of your code.
> Block scope:  A variable when declared inside the if or switch conditions or inside for or while loops, are accessible within that particular condition or loop.
> Global scope: The variable can be accessed from any part of the code.

**Closure:**

> The combination of a function bundled together (enclosed) with references to its lexical environment surrounding state.
> Closures are created every time a function is created, at function creation time. To use a closure, define a function inside another function and expose it. The inner function will have access to the variables in the outer function scope, even after the outer function has returned

**Prototype chain:**

> In JavaScript every object has a private property which holds a link to another object called its prototype. That prototype object has a prototype of its own, and so on until an object is reached with null as its prototype. By definition, null has no prototype, and acts as the final link in this prototype chain.


**Bind, call and apply:**

> Bind, call and apply are three important functions in javaScript.
> Bind creates a function.
> Call and apply call a function. 
> Call method pass arguments individually and apply method as an argument array. 

**Event bubble, Event delegate and purpose of Event bubble:**

> A method where JavaScript allows DOM elements to be nested inside each other. In such a case, if the handler of the child is clicked, the handler of the parent will also work as if it were clicked too.
How to Set Locale and Add-Type in Krayin?
Tags: opensource, github, programming, news
Published: 2021-12-22 12:35:10

You can change language and time zone from the <a href="https://crm.bagisto.com/admin/configuration/general">Krayin CRM</a> configuration setting. Here I will introduce “How to Set Locale and Add-Type in Krayin?” Follow these steps to change the locale information:
You need to go on Dashboard -> Configuration
For the <a href="https://crm.bagisto.com/admin/configuration/general">Locale</a> setting, you have to set the Language and Timezone from the drop-down.
**Note:** Krayin CRM supported default English language. 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q99k7fwd9nmw72mwt5t7.png)  
**How to add Type in Krayin?
What is Type?**
In <a href="https://crm.bagisto.com/admin/dashboard">Krayin CRM</a>, Type is basically the Subscription of product, Renewal of product, Support for 1 Year, Product Purchase, etc. So you have to select from the drop-down when you will Add Lead. For example, You have purchased a subscription to a Product, so this is the type of that lead.
There is another Type in the Activity section, where you need to select the type of activity like call, meeting. so don’t be confused because both are different.
**Add Type:**
Go to Dashboard -> Setting -> Type ->Add Type 
When you will create the lead or add some activity then you need to add a Type also. First of all, you have to add a type then you can select from there.
You can edit or delete the Type using the Actions tab.
**Use of Filter**
If there are so many types, so you can find out by using Filter Tab. You need to put ID and Name of the type, now you will find out your desire Type.
That’s all about “How to Set Locale and Add-Type in Krayin?”
Hope this article is helpful for you, comment below-
<a href="https://krayincrm.com/how-to-set-locale-and-add-type-in-krayin/">Read More</a>
React Music Player
Published: 2021-12-22 12:33:02

**[Reaplay](https://npmjs.com/reaplay)** is React [HOC](https://reactjs.org/docs/higher-order-components.html) for create your custom music player with any styles you like.

> give me your tracks list, and i'll give you must state, functionalities you need for create a music player




### **Install**

```shell
npm install --save reaplay 
```
```shell
yarn add reaplay
```

### **Usage**

```jsx
import React from 'react'
import {Reaplay} from 'reaplay'

export default function App() {
   const songList = [
     "songSrc", // url song (https://example.com/song.mp3)
     "songSrc", // url song
     require("./songSrc"), //local song,
   ]

   return (
     //                         optional ↓
     <Reaplay tracks={songList} startIndex={2}>
        {(player) => {
          
           console.log("loading :", player.isLoading)

           return (
              // your player
           )
        }}
     </Reaplay>
   )
}
```

> "tracks" prop is required but "startIndex" is optional prop

### some states of player (example)

`player.isLoading`
`player.duration`
`player.trackProgress`
`player.volume`
`player.isRepeat`
**and [more](https://github.com/Amir-Alipour/reaplay#props---properties) states for create your dynamically player ui**

### some functions of player (example)

`player.toNextTrack()`
`player.toPrevTrack()`
`player.setVolume(70)`
`player.setIsRepeat(true) | player.setIsRepeat((isRepeat) => !isRepeat)`
`player.playFast()`
**and [more](https://github.com/Amir-Alipour/reaplay#props---events) functionalities you can use for your own player events**

-----------------------------------------------------------------

### example 
you can clone [this](https://github.com/Amir-Alipour/reaplay/tree/master/example), or use little example in [codesandbox](https://codesandbox.io/s/blissful-frost-yl38y)

-----------------------------------------------------------------

For supporting me, Please click on the Star button on Github and Share this post and finally send the Repo to your friends.
Github Repo:
[https://github.com/Amir-Alipour/reaplay](https://github.com/Amir-Alipour/reaplay)
Elixir :: Pattern Matching
Tags: elixir, programming, tutorial, beginners
Published: 2021-12-22 12:22:36

Uma das coisas que inicialmente me deram um nó ao estudar Elixir foi o operador `=`. Apesar de ser utilizado para atribuir valores a variáveis, esse operador no Elixir é chamado de *`match operator`* 

Ao executar um trecho de código como este:

```elixir
iex> x = 1
1
iex> 1 = x
1
iex> 2 = x
** (MatchError) no match of right hand side value: 1
```

Podemos notar que a expressão `1 = x` é uma expressão válida e isso é possível porque ambos os lados (direito e esquerdo) representam o mesmo valor, que no caso é `1`. Entretando quando esses dois lados não dão match, um `MatchError` é retornado.

Só podemos atribuir valor para uma variável quando definida no lado esquerdo do operador `=`:

```elixir
iex> x = 1
1
```

Pattern Matching não funciona apenas para valores simples, você também pode utilizar para outros tipos, como:

```elixir
iex> {a, b, c} = {:hello, "world", 42}
{:hello, "world", 42}
iex> a
:hello
iex> b
"world"
```

Os dois lados (esquerdo e direto) devem ser do mesmo tipo, caso contrário um `MatchError` acontecerá, como no exemplo abaixo que tento fazer um match entre uma tupla e uma lista:

```elixir
iex> {a, b, c} = [:hello, "world", 42]
** (MatchError) no match of right hand side value: [:hello, "world", 42]
```

Para solucionar este problema, poderíamos fazer:

```elixir
iex> [a, b, c] = [:hello, "world", 42]
[:hello, "world", 42]
iex> a
:hello
iex> b
"world"
iex> c
42
```

Utilizar tamanhos diferentes entre os dois lados, também resultará em erro.

```elixir
iex> [a, b] = [:hello, "world", "aloha"]    
** (MatchError) no match of right hand side value: [:hello, "world", "aloha"]
```

Algumas vezes queremos mesmo ignorar certos valores em nosso matching, para isso o Elixir possui uma variável especial, que é o `_`. Essa variável nos possibilita ignorar certos valores em um pattern matching, ou seja, se quizermos ignorar o último elemento no matching entra as listas acima, poderíamos fazer da seguinte forma:

```elixir
iex> [a, b, _] = [:hello, "world", "aloha"]
[:hello, "world", "aloha"]
iex> a
:hello
iex> b
"world"
```

Pattern Matching vai além das variáveis, podemos utilizar isso com functions e muito mais, porém veremos como utilizar isto em um próximo post!
React Hooks
Tags: react, usestate, useeffect, usecontext
Published: 2021-12-22 12:13:12



**Hooks** are basically **functional components** of **React**. It doesn't work inside **classes**. They let us use React without classes. Now we will know about some **basic** and **additional** hooks.  

## Basic Hooks: 

**1. useState():**
  
It returns a **stateful value** and a function to **update** it. For example- 

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


**In the above code,** the initial rendering of the returned state **(state)** returned as the same value passed as the first argument **(initialState)**. 

And the **setState** function is used to update the state where it belongs. It **accepts** a new state value and enqueues a re-render of the component.

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

**2. useEffect():**
  
Basically useEffect hook allows us to perform side effects  in our components. Such as: **fetching data, directly updating the DOM and timer**. The useEffect hook accepts two arguments. Second argument is optional. For example- 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/66klcbtxvj2nk5g4pbvc.JPG)

**3. useContext():**
  
In React, Context is the **way to manage state globally**. It accepts an object which returns from **React.createContext** and returns the current context value for that context. Where current context value is determined by the value **prop** of the nearest **<MyContext.Provider>** below the calling component in the tree. 

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

It can be used together with the **useState** Hook to share state between deeply nested components more easily than with useState alone.



## Additional Hooks: 


1. useReducer ()
2. useCallback()
3. useMemo()
4. useRef()
5. useImperativeHandle()
6. useLayoutEffec()
7. useDebugValue()



**In my next blog I will discuss Additional Hooks briefly. **
Daily UI - #006 - User Profile
Tags: codepen
Published: 2021-12-22 12:06:28

<p>006 of the Daily UI exercises. Sign up for them here -- <a href="http://dailyui.co/" target="_blank">http://dailyui.co/</a>.</p>

{% codepen https://codepen.io/harunpehlivan/pen/OJxNZLm %}
Multitrack Chords
Tags: codepen
Published: 2021-12-22 12:00:27

<p>Uses a <a href="https://goo.gl/magenta/js">Magenta.js</a> MusicVAE model to interpolate between two musical "styles" while playing an editable chord progression.</p>

{% codepen https://codepen.io/harunpehlivan/pen/rNGjWEN %}
Minimal APIs Refactoring
Tags: minimalapi, net6, globalusing
Published: 2021-12-22 11:58:52

Video Link:
[Minimal APIs Refactoring](https://m.youtube.com/watch?v=7K0tJMbsq08)

In this video I will show you how we can refactor Minimal APIs.

- Endpoints Customization 
- Repository
- Define Service
- CRUD using Entity Framework Core
- Global Using
JAVASCRIPT STRING METHODS
Tags: javascriptstring
Published: 2021-12-22 11:57:53


Javascript string is a character it’s reprajent series of characters 

And javascript has a lot of string methods which is help to make complex things easy like:

charAt:  It’s a method which is provide the character value to specific index so that’s mens return the character in the specific index.

Concat: it’s doing a connection of tow or more then tow string and then return a new string.

Includes: javascript includes method is use for determine where is string pragent or not it’s a case sensitive method and it’s return boolean like true of false; 

Endswith: it’s follow the rule like where the specific character is ends and it’s always return true or false. 

indexOf: this keyword use for search index the creature where is it position in all and fiend it index. And it provide index number or if not it provide -1.

lastIndexOf: if provide the search character last position and it’s fast position is zero.

Replace:  it’s doing change or repleace a specific world of sentence to use replace method.

Slice:  this is use for sciceing many data how many data you want to show ui to use this method you can chose a number of data howavare you want just set quantity and then apply slice method that’s it. 

Split:  it’s work it’s abstring array and then return a newly created array. 

startsWith: it return true if string start with a specific string. it’s a case sensitive method.

Substr: this use case is fetch to given string to provide specific string position and length. 
toLowerCase: it’s mainly use if you need a world written capital letter but you need it lower case this situation you use this method and when apply this method you capital word or sentence is just convery lowercase. 

toUpperCase:  this method are same like this where you want to convery upper case to lower case and now you want to lowercase to uppercase so just use toUpperCase and it’s done.

Trim: this trime is remove to help white space in left or right if we fase whilte space in you left of right site and need to remove it just use this trim ane solve it cleanly. 

trimStart:  it’s use case is just remove starting whitespace not remove end white space

trimEnd: same thing are doing stimEnd it’s mens delete white space in the end site that it.

valueOf: it return primitive value of specific object. 

This are import string we use so many case to easser our coding and save mutch more time and a better code environment for acceptable all platform like asynchronous.
Multitrack Interpolation
Tags: codepen
Published: 2021-12-22 11:56:04

<p>Uses a <a href="https://goo.gl/magenta/js">Magenta.js</a> MusicVAE model to interpolate between two musical "styles", either randomly generated or imported from MIDI.</p>

{% codepen https://codepen.io/harunpehlivan/pen/ExwZZEW %}
CruxFinder -  Ecommerce Seller News
Tags: cruxfinder, ecommerce, seller, newsletter
Published: 2021-12-22 11:46:01

> One can not grow without guidance

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

[Cruxfinder](https://www.cruxfinder.com/) is one of the world’s leading email newsletter for ecommerce sellers. We publish highly relevant curated content for brands & individuals selling through online marketplaces like Amazon, eBay, Walmart, Shopify, Etsy etc. We aim to provide the most important & revenue impacting news for online sellers to grow their business directly or indirectly.

---

**What We have?**

- 2,00,00 subscribers
- 70,000 weekly newsletter
- 65% total open rate
- 150+ edition published

---

**Our Readers:**

- 100% highest content relevancy
- 80% readers open twice every week
- 99% content from trusted and official sources
- 100% sales growth opportunities & tools

---

Businesses of every size and type sell through online marketplaces, from individuals working at home to multinational brands with whole teams dedicated to marketplace ecommerce. We cater to all genuine businesses who want to improve and grow their online sales. Cruxfinder has a global audience, but focuses mainly on the USA as that is where most of our readers are based.

---

**Online Sellers:**

Many of our readers are retailers, buying existing branded products from wholesalers and distributors. They are often multichannel sellers, trading through several marketplaces and their own ecommerce stores. Operational challenges dominate for these businesses.

---

**Private Label Brands:**

A large part of our audience are businesses who create their own products, ranging from simple white labelling of generic items to designing and building completely new brands. Amazon is the main sales channel, and marketing and differentiation are key.

---

**Leading Brands:**

Our readers also include brick-and-mortar retailers, wholesalers and manufacturers, looking to diversify and grow through online marketplaces. Challenges include a steep learning curve, lack of customer contact and less control over how they sell.

---

**Individual Sellers:**

People starting out in business make up a diverse and exciting part of the Web Retailer audience. They often begin on Amazon using FBA, and sometimes use retail arbitrage or drop shipping. Business fundamentals need to be learned to avoid costly mistakes.

---

**Why Sellers Read CruxFinder?**

Cruxfinder is a trusted resource for thousands of ecommerce sellers, providing highly relevant, in-depth & practical information from official sources that helps them grow their business. We take that our sources very seriously & make sure the information is impacting. Our values help us put our readers first, maintain trust, and keep on curating the right information.

---

**What We Provide?**

- 100% highest content relevancy
- 80% readers open twice every week
- 99% content from trusted and official sources
- 100% sales growth opportunities & tools
Local Weather App
Tags: codepen
Published: 2021-12-22 11:52:21

<p>This is a weather app that gets your location and shows the current weather as well as weekly forecast. You can also search any location and get its weather information. The app uses the Darkskies and Google Maps API as its primary data source. </p>

{% codepen https://codepen.io/harunpehlivan/pen/abLWqGP %}
Principles and Practice of Accounting By CA/CMA Santosh Kumar
Tags: ca, education, commerce
Published: 2021-12-22 11:51:49

[Principles and Practice of Accounting Lectures By CA/CMA Santosh Kumar](https://www.coceducation.com/course/principles-and-practice-of-accounting-by-ca-cma-santosh-kumar). These Video Lectures are beneficial for CA Foundation. Study Material will be provided through the Downloadable Link & Pen drive Classes.  Live Classes Available along with Studio Recorded Classes with Best Price Guaranteed.

The topic which will be Covered: 

1. Accounting Theoretical Framework
2. Accounting Process
3. Journal Entries(Including GST)
4. Ledger and Trial Balance
5. Subsidiary Book and Cash Book
6. Rectification of Errors
7. Bank Reconciliation Statement
8. Inventories
9. Concept & Accounting of Depreciation
10. Accounting for Special Transactions
11. Preparation of Final Account of Sole Proprietors
12. Partnership Accounts (ALL)
13. Financial Statement of Non-Profit Organizations
14. Introduction to Company Accounts
15. Issue, Forfeiture & Re-Issue of Shares
16. Issue of Debentures

Take the Benefit and Learn Principles and Practice of Accounting by CA/CMA Santosh Kumar
Make your Website's text look cool
Tags: html, css, beginners, codepen
Published: 2021-12-22 11:45:34

I am writing a blog after a long time. So, today let us see something that will make your website look **cool** and **beautiful**.

Now what actually am I talking about?

So, today we are going to make a text filled with **gradient colors**!

Let's get started!
Step 1. We need our as always HTML:
```html
<!DOCTYPE html> 
<head> 
<title>Gradient Text</title> 
</head> 
<body>
 <h1>Welcome to my World</h1> 
</body> 
</html>
```
Step 2. CSS

We will give our h1's  background a gradient look.
```css
h1 {
  font-size: 72px;
  background: -webkit-linear-gradient(#0040ff, #00ffff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
```
Now look at the codepen below for an example:
{% codepen https://codepen.io/tilak6/pen/xxXXxpB %}

So, that is it for this blog.
[My Github](https://github.com/tilakjain123)

Please if you like this post give it a heart and share it with your friends. Bye!
Back to Front Linked List
Tags: java, algorithms, 100daysofcode, programming
Published: 2021-12-22 11:44:05

# [Description](https://binarysearch.com/problems/Back-to-Front-Linked-List)

Given a singly linked list `node`, reorder it such that we take: the last node, and then the first node, and then the second last node, and then the second node, etc.

Can you do it in `O(1)` space?

**Constraints:** 

- `0 ≤ n ≤ 100,000` where `n` is the number of nodes in `node`

## Example 1

### Input

```
node = [0, 1, 2, 3]
```

### Output

```
[3, 0, 2, 1]
```

---

# Intuition

1. find the mid
2. reverse the right half
3. create a new head pointer to build a new linked list

# Implementation

```java
import java.util.*;

/**
 * class LLNode {
 *   int val;
 *   LLNode next;
 * }
 */
class Solution {
    public LLNode solve(LLNode node) {
        LLNode fast = node, slow = node;
        while (fast != null && fast.next != null) {
            slow = slow.next;
            fast = fast.next.next;
        }
        LLNode left = node, right = reverse(slow);
        LLNode prev = new LLNode();
        LLNode dummy = prev;
        while (left != null && right != null) {
            prev.next = right;
            right = right.next;
            prev.next.next = left;
            left = left.next;
            prev = prev.next.next;
        }
        prev.next = null;
        return dummy.next;
    }

    private LLNode reverse(LLNode node) {
        LLNode prev = null, curr = node, next;
        while (curr != null) {
            next = curr.next;
            curr.next = prev;
            prev = curr;
            curr = next;
        }
        return prev;
    }
}
```

## Time Complexity

- Time: O(n)
- Space: O(1)
Minimal APIs CRUD
Tags: minimalapi, net6, crud
Published: 2021-12-22 11:42:18

Video Link:
[Minimal APIs CRUD](https://www.youtube.com/watch?v=0MOuYsRPckw)

Minimal APIs are architected to create HTTP APIs with minimal dependencies. They are ideal for microservices and apps that want to include only the minimum files, features, and dependencies in ASP.NET Core.

> var builder = WebApplication.CreateBuilder(args);
> var app = builder.Build();
> app.MapGet("/", () => "Hello World!");
> app.Run();
How can Meta think about the Metaverse?
Published: 2021-12-22 11:36:22

In the company’s conference 2021 Connect, Zuckerberg introduced viewers to his company’s vision of the metaverse, which combines the 3D and 2D worlds into one virtual world.

Its metaverse will integrate the current Meta products, such as WhatsApp and Messenger however, it will also offer many new tools such as virtual offices, virtual homes and e-commerce possibilities for content creators and businesses. Meta’s metaverse is a world of imagination users will have total imaginative control of their own virtual universes creating everything from houses with water views to space stations in which you can collaborate, chat with your friends, or even study.

Utilizing VR, AR, and the latest technology tools the metaverse will blend the digital and physical realms. This will be a major growth of Facebook Horizon, now known as Horizon Worlds, which was developed in the year 2019 to be an immersive VR game and game-making platform, accessible through the Facebook Oculus VR headsets. In 2021, a test Version of Horizon Workrooms was added to the project, which allows remote teams to work.

In the Connect event, Meta announced its elusive “Project Cambria,” yet to be launched as a premium VR headset which users are expected to use to enter the metaverse. Meta also plans to launch a smartwatch that could be connected to the latest VR hardware.