teleren/devto huggingface dataset:
[5] JavaScript – Spread operator
Tags: webdev, codenewbie, javascript, react
Published: 2020-11-02 12:40:23

In the last couple of days, I was trying to intensively learn JavaScript. So, in the few next posts will be some thoughts about useful functions, methods, and syntax features. Today I will start with the javascript spread operator.

##Spread syntax

The javascript spread operator could be a pretty useful tool that saves space and improves the syntax. In the first example below, I am using it for passing **args** array to the **newArgs** on line 5. Next, on lines 7 and 8, I am passing those arrays to **fn** function.

```javascript
fn = (x, y, z, a = 4, b = 5, c = 6) => {
  console.log(x, y, z, a, b, c)
 }
var args = [1, 2, 3]
var newArgs = [...args, "four", "five", "six"] // [1, 2, 3, four, five, six]

fn(...args) // 1 2 3 4 5 6
fn(...newArgs) // 1 2 3 four five six
```

The next example is slightly different. Here I am creating a function, which uses **…args** as a parameter. Inside the function, we have a for-loop that iterates through the list of arguments. In principle, there can be as many arguments as you need. Finally, when the function is being called, it takes all arguments that have been given, 1, 2, or 100, etc.

```javascript
sumAll = (...args) => {
    let sum = 0
    for (let arg of args) {
        sum += arg
    }
    console.log(sum)
}

sumAll(1) // 1
sumAll(1, 2) // 3
sumAll(1, 2, 3) // 6
```

We could also use the spread operator for something like this:

Iteration through the string.

```javascript
const str = "Hello"
var letters = [...str]
console.log(letters) // [ 'H', 'e', 'l', 'l', 'o' ]
```

Dividing an array into a number (**z**) and an object (**w**), which is, in fact, another array. (More about JS Data Types [here](https://create-react-app.com/javascript-data-types/)).

```javascript
var [w, ...z] = [1, 2, 3]

console.log(w, z) // 1 [2, 3]

console.log(typeof(w)) // number
console.log(Array.isArray(w)) // false

console.log(z[1]) // 3
console.log(typeof(z)) // object
console.log(Array.isArray(w)) // true
```

Or even iterating through the object:

```javascript
var object = {
    a: 1,
    b: 2,
    c: 3,
    *[Symbol.iterator]() {
        for (let key of Object.keys(this)) {
            yield this[key]
        }
    }
}

console.log(...object) // 1 2 3
console.log(typeof(object.a)) // number
```

The latest example can be also done in the following way. But in this case, it returns an array:

```javascript
var object = {
    a: 1,
    b: 2,
    c: 3
}

var x = Object.values(object)
console.log(x); // [1, 2, 3]
console.log(typeof(x)) // object
```

***

[Original post 24.07.20 @ create-react-app.com](https://create-react-app.com/5-javascript-spread-operator/)

Site https://proj.create-react-app.com/
GitHub https://github.com/villivald
A Light Music Player For Your Audio Projects
Tags: webdev, vue, audio, javascript
Published: 2020-11-02 12:37:20

---
title: A Light Music Player For Your Audio Projects
published: true
description: Add audio playing functionality to your professional or side projects using this light audio player.
tags: webdev, vue, audio, javascript
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/z4qixwaf1w2vdq3b4pns.jpg
canonical_url: https://jamesinkala.com/blog/a-light-music-player-for-your-audio-projects/
---

If you are working on either a professional or a side project where you need audio playing functionalities, look no further, I created a vue plugin - [xns-audio-player-simple](https://github.com/xinnks/xns-audio-player-simple) just for that. It is as light (37.3 kb unpacked and 7.9 kb zipped) as it is easy to setup.

{% github https://github.com/xinnks/xns-audio-player-simple %}

## Using xns-audio-player-simple

**Install plugin**
```sh
$ npm i xns-audio-player-simple
```

**Import and initiate the plugin on your entry js file within your vue project**
```js
import Vue from 'vue'
import XnsAudioPlayerSimple from 'xns-audio-player-simple'
 
Vue.use(XnsAudioPlayerSimple)
...
```

All you need to start playing audio files is an array of music objects with the following properties.
```js
songs: [
  ...
  { 
    audio: 'audio.mp3', // String: audio file url
    artist: 'Superstar', // String: artist's name
    tittle: 'Funky Disco House', // String: audio/song's title
    album: 'Alpha Zulu', // String: audio/song's album title
    cover: 'cover-art.jpg' // String: audio/song's art
  }
]
```

Pass the array to the ` :playlist ` attribute

```vue
<xns-audio-player-simple :playlist="songs"></xns-audio-player-simple>
```

Then, enjoy playing music on your project.  
  
***xns-audio-player in action***  

![xns-audio-player-simple small width](https://dev-to-uploads.s3.amazonaws.com/i/5tiopnq9hr4crggt0k65.gif)

![xns-audio-player-simple large width](https://dev-to-uploads.s3.amazonaws.com/i/j3xp38psgfd08gqxi2ft.gif)
Day 3 - 5 | Stuck... in Series Track
Tags: ruby, 100daysofcode
Published: 2020-11-02 12:33:05

Greeting,

I had stuck with the **Ruby track | Series chapter** for 2 days ago.

But I had solved it already.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/vq7efh3hlc92qz5bpayw.png)

I had never known about the `.each_cons` method

Here is my solution before know about `.each_cons`

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/imueugyuny6lldn1lkgk.png)

But this is the good ruby magic solution.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/2aqoc9l5e07j1ljc2dks.png)

I have learned.

🤮 Two days for this !!!
Cost to Develop Hotel Booking App
Tags: hotelbookingapp, nativeappdevelopment, hybridappdevelopment, crossplatformappdevelopment
Published: 2020-11-02 12:30:53

In today’s era hotel industry needs to go with hand on hand with latest technologies. There are many hotels which has different tools to attract the clients. A five star hotel has lots of amenities and facilities that will make your vacation exciting and fabulous.

Making inquiries via phone or going to different hotels to get information about what they can offer would be time consuming which really doesn’t work in this fast moving life style. But using this way also leaves some questions that you would still want to know because we are not able to get every detail from leaflets and brochures.

The hotel app can help you to choose best one from the list of hotels by just going over the hotel app on your mobile device. Using the mobile device can give you access to the different hotels in just one swipe or click. From there you’ll be able to view everything that you want to know about hotel accommodations and facilities they provide.

Developing a hotel app will be always customized process for each hotel according to their need and facilities they are providing hence the development cost will be high, but the price that you pay for the development of your hotel app would be compensated as more people will notice your hotel and more guests and visitors coming in to get the exceptional services your hotel can give.
But you must wonder about the cost to develop a Hotel booking app. So Vibidsoft is here with the approximate cost of developing a hotel app which is between $5k-12k.

You can contact us for any detailed information and an Instant quote for you hotel.
How IoT Integrated Web Applications Can Make a Difference in the Future
Tags: webappdevelopmentservices, webapplicationdevelopment, webappdevelopmentservicesinusa
Published: 2020-11-02 12:25:17

IoT is like the backbone of the grand technological revolution that lies ahead. It offers a connected system of devices and has become a significant age-defining technology in the modern ecosystem. Because of its wide-range effects, it is affecting all walks of life and it has already started impacting mobile and web app development services. It is making ground-breaking changes in design and development.

https://millie-jack-updates.medium.com/how-iot-integrated-web-applications-can-make-a-difference-in-the-future-15f491e5f046
Day 2 - Variables for Text [Python for Students]
Tags: python, programming, student
Published: 2020-11-02 12:22:39

You have observed how you can print a simple text into the python window. However, there is a small challenge, if you have to type the same text again and again, you need to either copy and paste it into your print function every time or type. If we can use a small indicator to store the whole text then every time we can just simply use that indicator to print it. It's like a roll number given to a student. When a teacher discusses about student they can mention the roll number instead of calling out the full name or all the features of that individual. That's why we use names for everything. Same happens in programming language, we use a name to store the whole string and that name is often known as **variable**.

We will see how differently we can use our greetings and print them by their name.

```python
gm = "Good morning"
print(gm)
```

In Above `gm` is the variable name which can be used later as well. Every time you don't need to type the whole text. Just use the name wherever needed.  

## Watch the video

{% YouTube TmcfL5JH6u0 %}
## Day 2 - Exercise

1. Create a variable with a name `myname` and assign the value of your name. Then call the variable in `print()` function.
2. Create a variable for your favourite movie and `print()` it.
3. Clear all the output.
Smartcontract deployed on XDC Network.
Tags: blockchain, xdc
Published: 2020-11-02 12:19:19

Deployed a solidity code #SmartContract on XinFin Network in injected web3 environment.

Check my network transaction here: https://explorer.xinfin.network/tx/0x9832356c0c6ba433fddb7e8cad649728fe3fa8cb3903329410970d750469dce3
How stringify Proxy to JSON
Tags: javascript, proxy, json, fundamentals
Published: 2020-11-02 12:04:42

If you ever had to deal with a [`Proxy`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/Proxy) then you might come to the point where you need to stringify their returned values.

Fortunately, the [JSON implementation](https://github.com/douglascrockford/JSON-js/blob/master/json2.js) in ECMA Script allows to define a custom `toJSON` method on Objects. A good built-in example is [`Date.prototype.toJson`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toJSON). With `toJSON` you can fine-tune what exactly will be part of the stringified Object.

On a Proxy you might want to have direct access to the underlying Object and rather define your custom JSON in a get trap.

The following example solves this easily:

```javascript
const personProxy = new Proxy({}, {
  get: function (target, key) {
    if (key === 'toJSON') {
      return () => ({ name: 'bar' })
    }

    if (key === 'name') return 'foo'
  }
})
```

If you directly call the `name` value on the proxy, it will return `name`.

However, when passing the Proxy instance to `JSON.stringify` it will try to call `toJSON` on the Proxy. Since our get trap handles `toJSON` as function, the stringify implementation can actually call it as if it would be a member function.

```javascript
console.log('name', { name: personProxy.name })  // "name" "{ name: 'foo' }"
console.log('json', JSON.stringify(personProxy)) // "json" "{'name':'bar'}"
```
Browser Testing and Tools WG Meeting @ TPAC 2020
Tags: standards, testing, selenium
Published: 2020-11-02 12:03:38

It's that time of the year where working groups from the W3C meet up to discuss the various standards that
are being worked on.

Within the Browser Testing and Tools Working Group, there are 2 different standards.

We have:

* [WebDriver](https://w3c.github.io/webdriver/)
* [WebDriver-Bidi](https://w3c.github.io/webdriver-bidi)

The first is what is commonly supported by the Selenium Project and has support from Apple, Mozilla, Microsoft, and Google in their browsers. It is also supported by various Selenium in the cloud providers like Sauce Labs and BrowserStack.

As the world has moved on we have felt the need to add new APIs and move Selenium to be more event-driven. This is where we are learning, and collaborating, with projects like Puppeteer to make sure that we can improve the Browser Automation space. This is where the [WebDriver-Bidi](https://w3c.github.io/webdriver-bidi) Specification comes in. It has broad support from the browser vendors so you can use official browsers and not be limited by the JavaScript sandbox. Some of the newer frameworks can't guarantee that.

If you're curious about we discussed this week, feel free to read it up on the [W3 Wiki](https://www.w3.org/wiki/WebDriver/2020-TPAC).
Excel Formulas to Count Cells that contain Specific Text!!
Tags: excelformula, excelformulas
Published: 2020-11-02 12:06:33

---
title: Excel Formulas to Count Cells that contain Specific Text!!
published: true
date: 2020-11-02 11:58:50 UTC
tags: ExcelFormula,Excelformulas
canonical_url: https://geekexcel.com/excel-formulas-to-count-cells-that-contain-specific-text/
---

Here, we will show the **Formulas to count the number of cells that contain specific text in Excel Office 365** with basic syntax and explanations. Let’s get into this article!! Get an official version of **MS Excel** from the following link: **[https://www.microsoft.com/en-in/microsoft-365/excel](https://www.microsoft.com/en-in/microsoft-365/excel)**

[![Formulas to count cells that contain specific text](https://eadn-wc04-371788.nxedge.io/cdn/wp-content/uploads/2020/11/Formulas-to-count-cells-that-contain-specific-text.png)](https://geekexcel.com/excel-formulas-to-count-cells-that-contain-specific-text/formulas-to-count-cells-that-contain-specific-text/#main)<figcaption id="caption-attachment-16679">Formulas to count cells that contain specific text</figcaption>
## General Formula:

- The below formula will help to count the number of cells that contain specific values or text in Excel.

**=COUNTIF(range,”\*text\*”)**

## Syntax Explanations:

- **COUNTIF** -The Excel COUNTIF Function is used to count the number of cells that match a single condition or criteria.
- **Range** -It represents an input range given in a worksheet.
- **Comma (,)** – It is a separator which helps to separate a list of values.
- **Parenthesis ()** – The main purpose of this symbol is to group the elements.
- **Text** – It is the criteria to count the cells that contain specific values.
- **Asterisk (\*)** – It is a wildcard in Excel that means  “match any number of characters”.

## Example:

- First, you need to give the input values.
- Then, apply the formula in the formula bar section.
- After entering the formula, you can get the result.
- In the below image we will show the results in **Column E**.

![Example](https://eadn-wc04-371788.nxedge.io/cdn/wp-content/uploads/2020/11/Example.png)<figcaption id="caption-attachment-16677">Example</figcaption>

## Closure:

From this article, you can get to know the **Formulas for counting the number of cells that contain specific values or text in Excel Office 365**. Hope that this article is useful to you. Kindly, drop your feedback in the below sections. Thank you so much for Visiting Our Site!! Continue learning on **[Geek Excel](https://geekexcel.com/)!! **Read more on [**Excel Formulas**](https://geekexcel.com/excel-formula/) **!!**

### Read Ahead:

- **[Formulas to count cells that contains more than 100 characters in Excel!!](https://geekexcel.com/formulas-to-count-cells-that-contains-more-than-100-characters-in-excel/)**
- **[Formulas for counting the cells that contain Errors in Excel Office 365!!](https://geekexcel.com/wp-admin/post.php?post=16545&action=edit)**
- [**Excel Formulas for Counting Cells that Begin with Some Value!!**](https://geekexcel.com/wp-admin/post.php?post=16515&action=edit)
Excel Formulas for Counting Cells that do not contain certain text!!
Tags: excelformula, excelformulas
Published: 2020-11-02 12:06:17

---
title: Excel Formulas for Counting Cells that do not contain certain text!!
published: true
date: 2020-11-02 11:57:18 UTC
tags: ExcelFormula,Excelformulas
canonical_url: https://geekexcel.com/excel-formulas-for-counting-cells-that-do-not-contain-certain-text/
---

In this short tutorial, you can get to know the **Formulas for counting the number of cells that do not contain certain text or values in Excel Office 365**. You can also learn the basic syntax and explanation with its best example. Let’s see them below!! Get an official version of ** MS Excel**  from the following link: [https://www.microsoft.com/en-in/microsoft-365/excel](https://www.microsoft.com/en-in/microsoft-365/excel)

[![Formulas to count cells that do not contain certain text](https://eadn-wc04-371788.nxedge.io/cdn/wp-content/uploads/2020/11/EXCEL_za81saOc3D.png)](https://geekexcel.com/?attachment_id=16744#main)<figcaption id="caption-attachment-16744">Formulas to count cells that do not contain certain text</figcaption>
## General Formula:

- Use the below formula to count the cells that do not contain certain text in Excel.

**=COUNTIF(Range,”<>\*text\*”)**

## Explanations for Syntax:

- **COUNTIF** – In Excel, COUNTIF Function is used to count the number of cells that match a single condition or criteria.
- **Range** -It represents an input range given in a worksheet.
- **Text** – It is the criteria to count the cells that do not contain certain values.
- **Asterisk (\*)** – It is a wildcard in Excel that matches any number of characters.
- **Comma (,)** – It is a separator which helps to separate a list of values.
- **Parenthesis ()** – The main purpose of this symbol is to group the elements.

## Example:

- In the below screenshot, we will give the input range in **Column B**.
- Then, enter the given formula in the selected area.
- After applying the formula, it will show the output in **Cell E4**.

![Example](https://eadn-wc04-371788.nxedge.io/cdn/wp-content/uploads/2020/11/Example-3.png)<figcaption id="caption-attachment-16705">Example</figcaption>

## A Brief Summary:

Here, you can get some clarification on the **formulas for counting the number of cells that do not contain certain text or values in Excel Office 365**. Hope that this article is useful to you. Don’t forget to drop your valuable **feedback** in the below section. Thank you so much for Visiting Our Site!! Continue learning on **[Geek Excel](https://geekexcel.com/)!! **Read more on [**Excel Formulas**](https://geekexcel.com/excel-formula/) **!!**

### Read Ahead:

- [**Excel Formulas to Count the Cells Less than a Given Number!!**](https://geekexcel.com/wp-admin/post.php?post=16409&action=edit)
- **[Formulas for Counting the Cells that are Blank in Excel Office 365!!](https://geekexcel.com/wp-admin/post.php?post=16472&action=edit)**
I've created a Pixel Art game to tell my love story
Published: 2020-11-02 11:54:49

I built a game for my wedding's "save the date". 
http://deboraejoao.com/savethedate

There is only one way out for our guests: they have to run with our characters, jump over enemies and obviously pick up the rings - or no date for them!

All React, all Pixel Art. Try to take us to the venue!

I had to learn a [lot about Pixel Art](https://www.coursera.org/learn/pixel-art-video-games) and also a bunch of techniques for smooth React animations like [using requestAnimationFrame with hooks](https://css-tricks.com/using-requestanimationframe-with-react-hooks/).

It's all set in Florianópolis, the city where the Wedding will take place (hopefully in 2022). I tell a more detailed story and where I got the inspiration from in this post: https://medium.com/@jotamartins/turning-a-life-love-story-into-a-pixel-art-game-aba6a92ae4c5
Formulas for Counting Cells that Contain any Text in Excel Office!!
Tags: excelformula, excelformulas
Published: 2020-11-02 12:05:27

---
title: Formulas for Counting Cells that Contain any Text in Excel Office!!
published: true
date: 2020-11-02 11:50:49 UTC
tags: ExcelFormula,Excelformulas
canonical_url: https://geekexcel.com/formulas-for-counting-cells-that-contain-any-text-in-excel-office/
---

This page will describe the **Formulas for counting the number of cells that contain any text in Excel Office 365** with a suitable example. Let’s get started!! Get an official version of ** MS Excel**  from the following link: [https://www.microsoft.com/en-in/microsoft-365/excel](https://www.microsoft.com/en-in/microsoft-365/excel)

[![Formulas to count cells that contain any text](https://eadn-wc04-371788.nxedge.io/cdn/wp-content/uploads/2020/11/Formulas-to-count-cells-that-contain-any-text.png)](https://geekexcel.com/formulas-for-counting-cells-that-contain-any-text-in-excel-office/formulas-to-count-cells-that-contain-any-text/#main)<figcaption id="caption-attachment-16693">Formulas to count cells that contain any text</figcaption>
## General Formula:

- To count the number of cells that contain any text in Excel, use the below formula.

**=COUNTIF(Range,”\*”)**

## Explanations for Syntax:

- **COUNTIF** -The Excel COUNTIF Function is used to count the number of cells that match a single condition or criteria.
- **Range** -It represents an input range given in a worksheet.
- **Asterisk (\*)** – It is a wildcard in Excel that means  “match any number of characters”.
- **Comma (,)** – It is a separator which helps to separate a list of values.
- **Parenthesis ()** – The main purpose of this symbol is to group the elements.

## Example:

- Let’s consider the below image to count the cells that have any text.
- You need to enter the input values.
- After that, you need to enter the given formula in the selected field.
- Finally, you get the outputs as shown in the image.

![Example](https://eadn-wc04-371788.nxedge.io/cdn/wp-content/uploads/2020/11/Example-1.png)<figcaption id="caption-attachment-16691">Example</figcaption>

## Wind-Up:

Here, we explained the **Formulas to count the number of cells that contain any text in Excel Office 365** with its basic syntax. Hope that you like this article. If you have any **suggestions,** feel free to share it with us. Thank you so much for Visiting Our Site!! Continue learning on **[Geek Excel](https://geekexcel.com/)!! **Read more on [**Excel Formulas**](https://geekexcel.com/excel-formula/) **!!**

### Read Also:

- **[Formulas for Counting the Cells that are Blank in Excel Office 365!!](https://geekexcel.com/wp-admin/post.php?post=16472&action=edit)**
- **[Formulas for Counting the Cells that are Non-Blank in Excel Office!!](https://geekexcel.com/wp-admin/post.php?post=16486&action=edit)**
Optional?.Chaining 🤩 - A great gift for Devs
Tags: javascript, react, node
Published: 2020-11-02 11:41:14

Traditional way of validating a condition which has nested objects

```js
if(
   person && person.education && 
   person.education.highSchool &&
   person.education.highSchool.mark &&
   person.education.highSchool.mark.maths
) {
   console.log('😭');
}
```

Okay! why we need to right like this? Because, if we didn't validate each key for `undefined` then there's a huge chance of errors and your program crashes! To avoid we need to validate every **key's value** for `undefined`!

Otherwise, we may get one of the following errors
1. `Error: cannot read property education of undefined`
2. `Error: cannot read property highSchool of undefined`
3. `Error: cannot read property mark of undefined`
5. `Error: cannot read property maths of undefined`

Also, these errors may occur not only for `undefined`, but also for `null` value too.

This can be hard if you have nested object of depth more than 4 😭

> **How to get rid of this?**
we can use Optional Chaining


Modern way!

```js
if(person?.education?.highSchool?.mark?.maths){
    console.log('Life saver! 🤩');
}
```
> **Note:** Modern browsers supports *Optional Chaining*, for **nodejs** projects you should have *nodejs v14.x* version installed.

Or (simple hack without Optional Chaining)😉
```js
if(((((person || {}).education || {}).highSchool || {}).mark || {}).maths) {
   console.log('Looks weird! but easy!')
}
```

That's it instead of coding person person person..... Blah blah 🤥

You can code like this! 🌟

Try this on your project and comment your thoughts!