teleren/devto huggingface dataset:
= = vs === in JavaScript
Published: 2022-02-11 12:10:37

**Type of Equals**
JavaScript has 3 types of equals which are different from each other.
= is known as an assignment operator.
== is used to compare loose equality.
=== is used to compare strict equality.

**What is a type coercion?**
Type coercion is the process of converting a value from one type to another (such as string to a number, object to boolean, and so on).
**these can be of two type :**
Implicit coercion
Explicit coercion
**Implicit coercion** — Type conversion is done implicitly by JavaScript that aren’t obvious (to you).
**Explicit coercion **— Type conversion is done explicitly in code using the inbuilt functions like Number(), String(), Boolean(). 
This is done by the user itself.
**Truthy Vs. Falsy Values**
**Truthy values** — A truthy value is a value that is considered true when encountered in a Boolean context.
**Falsy values** — A falsy value is a value that is considered false when encountered in a Boolean context.
**Falsy Values**
There are only 6 falsy values in JavaScript you should be aware of:
false — boolean false
0 — number zero

“” — an empty string
null
undefined
NaN — Not A Number
Double equals (==)
We use Double equals to compare loose equality. Double equals also perform type coercion.
Understanding the concept
4 == ‘4’ // true
It will show true. This is because of type coercion. JavaScript will try to convert our values into a like type this is called implicit type conversion. In this case, it succeeds. The string value of ‘4’ can easily be converted into the number value of 4. Since 4 equals 4, we get our answer as true.

Example :
column1
Flase == “” // true
“” == 0 // true
0 == false // true
column2
undefined == null // true
column3
NaN == any other value // false
NaN == NaN // false
Now every value will show true when it is compared with itself except NaN. Because Not-A-Number is Not equal to itself. But unlike the case with undefined and null where comparing an undefined value to null is true but a hard check(===) of the same will give you a false value, NaN’s behavior is because of IEEE spec that all systems need to adhere to.

**Triple Equals (===)**
We use Triple Equals to compare strict equality. This means both the data type and the value we are comparing has to be the same.
Understanding the concept: true
What if we compare number 4, both have the same type and value. As expected, true is returned. Both are numbers, and both share the same value.
4 === 4 // true

**Understanding the concept: false**
What if we compare number 4, both will have the same value but different datatype.This means our operands will have the same value, but a different type. This will return false
4 === ‘4’ // false (Number v. String)

**NOTE : Triple Equals is superior to double equals. Whenever possible, you should use triple equals to test equality. By testing the type and value you can be sure that you are always executing a true equality test.
**
**Thanks for reading! Hope this was helpful.**
Correlation without tears
Tags: python, correlation, statistics
Published: 2022-02-11 12:09:52

Assessing the degree of correlation between two numeric series is a notoriously challenging task in every scientific discipline, as well as a crucial aspect of every scientific research (ever wondered if there's a correlation between the usage of Internet Explorer and the murder rate?).

Different coefficients have been proposed over the years for different series with different properties (most notably, Pearson's, Spearman's and Kendall's coefficients), and the quest for a "universal" correlation coefficient has often been unproductive.

It took me a while to digest the math behind the new paper from Sourav Chatterjee (https://arxiv.org/abs/1909.10140), but once I modelled the proposed coefficient into Python code I was surprised by how well it performed on arbitrary numeric series (not necessarily monotonic) compared to most of the coefficients out there. And it's also very easy to calculate compared to other coefficients.

So I've put together a [Gist notebook](https://gist.github.com/bf5da64cca77916ee970f0432622adc0) that shows how the new coefficient works on some simple data with increasing levels of noise.

Feel free to reuse the code if you need it!
Host React JS App for FREE with GitHub Pages
Tags: react, github, host, webdev
Published: 2022-02-11 12:08:52

## Commands Used

**Step 1**
▶️ `git remote add origin [YOUR REPO LINK]`
▶️ `git add -A`
▶️ `git commit -m "Initial commit"`
▶️ `git push -u origin main`

**Step 2**
Add this code line to package.json file - 
▶️ `"homepage": "https://[USERNAME].github.io/[YOUR REPO NAME]",`

**Step 3**
▶️ `npm install gh-pages --save-dev`

**Step 4**
Add this scripts to package.json file - 
▶️ `"predeploy": "npm run build",`
▶️ `"deploy": "gh-pages -d build",`

**Step 5**
▶️ `npm run deploy`
Whatsapp a number without saving it : wameunknown
Tags: whatsapp, productivity, javascript
Published: 2022-02-11 12:03:41

Hello everyone, we all come up with a situation where we need to send a message via whatsapp for onetime. The main prerequisite is to save the number in contacts first then we used to send a message. Often it is frustrating to save in contact for just one time message.

So I was searching online how to do this without saving a number in contacts. I got some info on whatsapp APIs and its like more of typing a URL and add phonenumber to it. But saving a phonenumber is easier than typing a url with new number everytime.

So I made a small hack to it and deployed in github pages. All you need to do is go to this url and give phone number and message and click on the Button. 

Now your whatsapp will automatically open chat with given phone number and message. 

https://nyalla.github.io/wame/

Hope you will like it.

Note: Give the phone number with country code.
productos de limpieza
Published: 2022-02-11 11:57:51

Queremos promover el uso del [oxigeno activo](https://www.agerul.es/tienda/limpiadores-hogar/oxigeno-activo/) por su cero impacto medioambiental.


**El oxígeno activo en tu colada diaria**
Haz tu colada más ecológica gracias al poder del oxígeno activo. Lavar la ropa con agua y oxígeno activo reduce la necesidad de detergentes y suavizantes y, por tanto, eliminamos los productos químicos de nuestra colada pero sin renunciar a la limpieza y a la eliminación de las bacterias y los malos olores. Pero aún hay más y seguro que no lo sabes, al usar este potente producto limpiador vas a conseguir eliminar los residuos de los productos químicos utilizados en lavados anteriormente. Después de cada lavado toda tu ropa gozará de la mayor suavidad libre de productos químicos, ideal para las personas con hipersensibilidad y con alergias.

**Uno de los [productos de limpieza](https://www.agerul.es/) más versatiles**
Limpiar suelos, azulejos, lavabos, baldosas y duchas
Viene genial para eliminar el moho en los azulejos que muchas veces nos aparecen en los baños y en las cocinas. Porque a veces no basta con una buena ventilación y un control de la humedad, el moho siempre aparece en nuestras baldosas cuando es época de lluvias. Consigue eliminar el moho utilizando agua con oxígeno activo y verás que es una alternativa inocua, libre de tóxicos y respetuosa con el medioambiente.
What Is GitLab CI/CD And GitLab CI/CD Pipeline | GitLab CI/CD Tutorial | Part II

Tags: devops, git, cicd, tutorial
Published: 2022-02-11 11:52:36

{% youtube cAniuOQFd1Y %}


This video explains what is Gitlab CI/CD, what is GitLab CI/CD Pipeline, and how to get started with GitLab CI CD. [Start FREE Testing](https://accounts.lambdatest.com/register?utm_source=devto&utm_medium=organic&utm_campaign=feb11_sb&utm_term=sb&utm_content=tutorial_video)  

Run Selenium Tests In GitLab CI -: https://bit.ly/3C82MK2


GitLab CI makes the release process simple and easy, averting last-minute checks. It allows seamless integration with cloud-based tools like LambdaTest, an online Selenium Grid of 2000+ real browsers ensuring a seamless UI for web applications building a robust CI/CD pipeline.  

Want to get started with CICD? Well, here is a detailed CI/CD Tutorial by LambdaTest answers the following -:

◼  What is a GitLab CI pipeline?
◼  What is CI and CD in GitLab?
◼  How do you create a GitLab CI CD pipeline?
◼  How do you start GitLab
Not Only Metaverse. UX Trends 2022
Tags: design, ux, metaverse, trends
Published: 2022-02-11 11:19:10

{% youtube lxeYxdjEAhE %}
Hi!
Here we go with the Design Trends to watch out for in 2022. Paweł, our Head of Design, is presenting a list of the eight hottest UX and UI trends for 2022. Metaverse? NFT? Sure, but not only. Can’t miss this video 💡 

Enjoy! You can also read the article at [Frontend House](https://frontendhouse.com/experts-zone/not-only-metaverse-ux-trends-2022-experts-zone-11).
Adding Inline Javascript to a React App
Tags: javascript, react
Published: 2022-09-26 12:23:23

---
title: Adding Inline Javascript to a React App
published: true
date: 2022-02-11 11:16:32 UTC
tags: javascript, react
canonical_url: https://www.alexhyett.com/inline-javascript-react/
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8g1z9fh2ik4pb34343v3.jpeg
---

Let me start this with a disclaimer, I am not a React expert and I am sure there are probably other ways to do this. If you know of a better way then please let me know in the comments!

I have recently added [Giscus](https://www.alexhyett.com/privacy-focused-blog-services/#giscus) to my blog which is a great way to add comments to a static developer blog.

I use Gatsby.js on my website which is built on React. The problem I had was working out how to add the Giscus script to my website.

This is what the Giscus script looks like.

```
<script src="https://giscus.app/client.js"
        data-repo="[ENTER REPO HERE]"
        data-repo-id="[ENTER REPO ID HERE]"
        data-category="[ENTER CATEGORY NAME HERE]"
        data-category-id="[ENTER CATEGORY ID HERE]"
        data-mapping="pathname"
        data-reactions-enabled="1"
        data-emit-metadata="0"
        data-input-position="bottom"
        data-theme="light"
        data-lang="en"
        crossorigin="anonymous"
        async>
</script>
```

The script will load the comments wherever you place the script so it can’t be added to the header of your HTML file.

As you know with react it can’t just be added to your JSX as it is as it won’t compile. So I needed to change it to a React component that I could just import where I needed.

This is what I came up with for the Giscus component which works well for me:

```
import React, { Component } from 'react'

class Giscus extends Component {
	componentDidMount() {
		const script = document.createElement('script')
		script.src = 'https://giscus.app/client.js'
		script.dataset.repo = '[ENTER REPO HERE]'
		script.dataset.repoId = '[ENTER REPO ID HERE]'
		script.dataset.category = '[ENTER CATEGORY NAME HERE]'
		script.dataset.categoryId = '[ENTER CATEGORY ID HERE]'
		script.dataset.mapping = 'pathname'
		script.dataset.reactionsEnabled = '1'
		script.dataset.emitMetadata = '0'
		script.dataset.theme = 'light'
		script.dataset.lang = 'en'
		script.crossorigin = 'anonymous'
		script.async = true
		this.div.appendChild(script)
	}

	render() {
		return <div ref={(el) => (this.div = el)}></div>
	}
}

export default Giscus
```

This approach should work for any other scripts that load components where the script is added to the HTML.

For general external javascript libraries, I would just add them to the HTML or use something like [Helmet](https://github.com/nfl/react-helmet) to add them where needed.
Alcune risorse pre creare immagini del tuo Codice
Tags: javascript, onlinetool, italiano
Published: 2022-02-11 10:52:13

Alcuni servizi che trasformano il tuo codice in un'immagine

- [Carbon](https://carbon.now.sh)

- [Ray](https://ray.so)

- [Codeimg](https://codeimg.io)

- [Snappify](https://snappify.io)

- [Code keep](https://codekeep.io/screenshot)

Io utilizzo prevalentemente [Ray](https://ray.so).

Saluti e alla prossima
Level design for Botborgs
Tags: unity3d, blockchain, gamedev, web3
Published: 2022-02-11 10:43:35

2022 has been off to a good start & I'm now working with [Martian Games](https://MartianGames.com) on the Botborgs project. Learn more: [botborgs.com](https://botborgs.com) - [YouTube Playlist](https://youtube.com/playlist?list=PL9QBjNDhgNwQYrXaiRwC0RROYmkppbssY)

Looking forward to playing a role in creating some amazing worlds & experiences with the Martian Games team.
10 React Hooks Explained And How to Create You Own Hook
Published: 2022-02-11 10:39:15

React has many Hooks. Some people doesn't know all of these and their uses. So, to help you know hooks better and create your own custom hooks, here is video link : [10 React Hooks Explained // Plus Build your own from Scratch](https://youtu.be/TNhaISOUy6Q). This video is by a YouTube channel called _**Fireship**_ which is a good programming related channel.
Thank You For Your Time. Have A Nice Day.
Squarespace Integration: How It Benefits Your SaaS App
Tags: squarespace, webdev, programming, ecommerce
Published: 2022-02-11 10:32:26

eCommerce can be an effective and easy way to sell goods online, but as an online merchant, you may face challenges. Thanks to software-as-a-service, online retailers can perform many routine operations in a streamlined manner. 

Online store owners have a variety of ways to sell their products, from using many online marketplaces to selling digital goods through their own websites. The reasons for shopping platforms integration are easy to understand for SaaS software vendors.
 
Integrating with shopping platforms lets you grow your customer base and expand your market share.

Squarespace integration is one of the top integrations your software needs to support. In this article, you will discover more about its benefits and a simple way to develop it.

##Why Squarespace Integration Matters

The [Squarespace](https://www.squarespace.com/) platform makes it easy to build a website without coding knowledge. It offers affordable domains, SSL encryption, real-time carrier shipping, abandoned carts retrieval, automated discounts, and many other useful features. 

With [4.5 million sites built on the platform](https://trends.builtwith.com/cms/Squarespace), Squarespace integration can be a major opportunity for SaaS providers to attract more clients.

However, it is critical to be aware that attempting to access clients stores built on various systems requires considerable technological skill. Each system has its unique way of storing data, making it difficult to create a single integration method that works with all of them.

Difficulties You Could Face When Developing Shopping Cart Integration

Integrating with various shopping platforms can be a challenge for any business. Here are the main pitfalls:

* Integration development takes some time, and Squarespace integration is not an exception.
* It takes about a month for one person to build an integration with a commerce platform—imagine how long it takes for your development team to build integration with multiple eCommerce platforms.
* Shopping platforms release new versions of their products. Therefore, you will constantly have to update your integrations due to new changes.

To simplify the process of integrating with Squarespace, you should use a ready-made integration solution like API2Cart. It allows connecting to over 40 eCommerce platforms, including Squarespace. 

##The Easiest Way to Implement Squarespace Integration

As mentioned above, you can avoid all the challenges of integration with a [third-party solution](https://api2cart.com/how-it-works/?utm_source=dev.to&utm_medium=referral&utm_campaign=squarespaceintegrationkh.ol). It provides a unified API that allows you to integrate with Squarespace, Magento, Shopify, Amazon, and other popular shopping platforms at once. You will be able to get, add, update and synchronize various store data like orders, products, customers, etc.
Python tuple and tuple methods
Tags: python, tutorial, beginners, programming
Published: 2022-02-11 09:47:40

> [Sign up to my newsletter!](https://baransel.dev/newsletter/).


## What is Tuple?

If we explain what tuples are; Tuples are **immutable dats types** that can contain more than one data type, denoted by commas or parentheses.

## How to Use Tuples?

Let's show it with an example;

```python
tuple = ("Python", "PHP", "Flutter", "Go")
print(tuple)
('Python', 'PHP', 'Flutter', 'Go')
```

Or we can show it with commas;

```python
tuple = "Python", "PHP", "Flutter", "Go"
print(tuple)
('Python', 'PHP', 'Flutter', 'Go')
```

But there is a very important point that we need to pay attention to here, if we are going to use a comma and if the tuple has one element, when we do not put a comma at the end, the interpreter perceives it as a `String (character array)`.

Let me show you right now;

```python
tuple = "Python"
type(tuple)
<class 'str'>
```

Let's try using a comma;

```python
tuple = "Python",
type(tuple)
<class 'tuple'>
```

## How is Tuple Access?

Accessing tuple elements are the same as accessing elements with Lists

```python
tuple = "Python", "PHP", "Flutter", "Go"
tuple[2]
Flutter
```

Let's do another example;

```python
tuple = "Python", "PHP", "Flutter", "Go"
tuple[1:4]
('PHP', 'Flutter', 'Go')
```

### Tuple Methods

In the previous lessons of the Python lessons, I said that the tuple is an **immutable data type**, so the tuple can't be added, deleted, etc. If you want, let's show you with an example;

```python
tuple = ("Python", "Flutter", "Go", "JavaScript", "PHP", "Java", "Python")
tuple[1] = "PHP"
print(tuple)
```

We will come across a problem as follows. `'tuple' object does not support item assignment"` tuple object does not support member assignment.

Let's list the methods with the `dir()` function;

```python
['__add__', '__class__', '__contains__', '__delattr__', '__dir__', '__doc__',
 '__eq__', '__format__', '__ge__', '__getattribute__', '__getitem__',
 '__getnewargs__', '__gt__', '__hash__', '__init__', '__iter__', '__le__',
 '__len__', '__lt__', '__mul__', '__ne__', '__new__', '__reduce__', 
'__reduce_ex__', '__repr__', '__rmul__', '__setattr__', '__sizeof__', '__str__',
 '__subclasshook__', 'count','index']
```

Since methods such as `__X__` are private methods, we will not look at them for now.

### index Method:
Continue this post on my blog! [Python tuple and tuple methods](https://baransel.dev/post/python-tuple-and-tuple-methods/).


[Sign up to my newsletter!](https://baransel.dev/newsletter/).
HTML - Beginner to PRO!
Tags: html, beginners, markup, raftlabs
Published: 2022-02-11 09:40:18

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w5kof8zbxuafk1m2j03z.png)
#### **1\. HTML Tutorial for Beginners --- Crash Course**

It is a crash course tutorial on HTML, especially for Beginners. It discusses all major things to know in 1 hour. Everything related to HTML can be learned from here within less time.

This material is created by Programming With Mosh.

[More info](https://www.youtube.com/watch?v=qz0aGYrrlhU)

#### **2\. HTML/CSS: Making Web Pages**

This coursework is one of the best HTML/CSS tutorials available online, and it is entirely free of cost. The coursework will provide users with notes, Challenges and videos. A detailed explanation of everything is given. The coursework contains 9 units that will cover all the crucial topics about HTML5.

This material is created by Khan Academy.

[More info](https://www.khanacademy.org/computing/computer-programming/html-css)

#### **3\. Introduction to HTML5**

This course will appeal to a wide variety of people, specifically those who would like a detailed description of the basics. There are no prerequisites for this course, and it is assumed that students have no prior programming skills or IT experience. The course will culminate in a small final project that will require completing an elementary page with links and images.

It is primarily similar to the coursework people did in schools. There will be assessment tests after each chapter and a final project.

This material is created by Coursera.

[More info](https://www.coursera.org/learn/html?ranMID=40328&ranEAID=jU79Zysihs4&ranSiteID=jU79Zysihs4-ylMMQeVCWgWEuvXED7ZENA&siteID=jU79Zysihs4-ylMMQeVCWgWEuvXED7ZENA&utm_content=10&utm_medium=partners&utm_source=linkshare&utm_campaign=jU79Zysihs4)

#### **4\. HTML5 & CSS Development: learn how to build a professional website**

Excellent coursework that covers a lot of important features about HTML5. It also includes some beginner-level JavaScript and CSS.

This material is created by Udemy 

[More info](https://www.youtube.com/watch?v=5bMdjkfvONE)[‍](https://www.youtube.com/watch?v=C5QFHp1oAws)

#### 5\. Free Course: Beginner Web Design using HTML5,CSS & Visual Studio Code

A free YouTube course for beginners that enables the viewers to understand HTML5 and CSS. Viewers will also get to learn to use a professional tool like Visual Studio Code. The video covers all the important details about CSS and HTML5. It's a great introduction to the world of Web Design.

This material is created by Daniel Scott.

[More info](https://www.youtube.com/watch?v=C5QFHp1oAws)

*Originally posted at* [*raftlabs.co*](https://raftlabs.co/development/top-5-free-resources-to-learn-html5?utm_source=devto&utm_campaign=crosspost)
How to build an HTML-only accordion — no JavaScript required!
Tags: webdev, html, beginners
Published: 2022-02-11 09:30:15

If you've been watching [my Twitch streams](https://twitch.tv/whitep4nth3r) lately, you'll know I'm currently rebuilding, redesigning and reimagining the full [whitep4nth3r.com](https://whitep4nth3r.com) experience — and I'm trying to do this with *as little JavaScript as possible*. And whilst building the table of contents for the new blog page layout, I discovered a way to build an accordion **with no JavaScript** in just four lines of code! Let's take a look!

## Use the HTML details element

To build the markup for an HTML accordion, use the `<details>` element. Use a `<summary>` tag to provide the title for the accordion. Add your content, and you're done!

```html
<details>
  <summary>Section title</summary>
  <p>Here is the content!</p>
</details>
```

### Load the open accordion by default

By default, the `<details>` element loads in a **closed** state, and I always prefer to not hide content from readers when the page loads. We can load the accordion open by default by adding the open attribute to the `<details>` element. Perfect!

```html
<details open>
  <summary>Title</summary>
  <p>Here is the content that is open by default!</p>
</details>
```

Readers can click to close the accordion to minimise clutter if they so wish — especially when on a mobile device.

![A video showing the clicking of the table of contents that is opening and closing.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y0njp41wm3r3mrbu0zqo.gif)

## Browser support and accessibility

At the time of writing this article, there's [full modern browser support for the details element as reported by caniuse.com](https://caniuse.com/?search=details), apart from Internet Explorer (obviously!) and Opera.

I also confirmed that the `<details>` element is keyboard-accessible in Chromium, Firefox and Safari. Tab to the element and use space or enter to open and close.

## Further reading

If you're curious, you can [view the source code](https://github.com/whitep4nth3r/mk2-p4nth3rblog/blob/17e9eadc3f887c844cc8764779462d7bfe5bfbf8/src/_components/tableOfContents.js#L44) that creates the full table of contents. [Read more about the details element on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details) and have fun building with HTML!