In this article, we are going to learn how we can communicate between components in Vue.js. There are 5 ways we can do it. Here’s how.
Every framework has its own unique architecture but they have one thing in common. The entire page is divided into small components where the component has its own functionalities and UI. And sometimes, we need a way to communicate between these components.
Generally, we use Vuex (State management tool) to store the data and use it across components. But sometimes, we need a way to send the data from one component to another without…
Recently I worked on a project where we had to make a custom image gallery. The requirement needed me to place many components like icons, texts, another image, and many other things on the image. While doing that, I learned about the steps to overlay the components on the image which I would like to share. Let's build a video player page to understand how the overlaying of icons works in CSS.
Let’s consider the below template. …
I was working with a rich text editor the other day and needed to strip the HTML tags from the string and store it in the database. In doing so, I learned a few different methods to achieve this. I wanted to share this information with you as it could come in handy for anyone who is trying to do the same.
What we are trying to do is remove the tags from the string and make the string printable as plain text. Let’s dive in and see how it works.
This method is a simple and efficient way to…
I was building a form the other day in Vue and I had to write number validation for the field so had to write the logic to check whether the input value is number or not. I wanted to list out the few ways I learnt which might be helpful to others.
-Infinity are numbers too - though, we'll be ignoring those values.
An array is an ordered collection of values: each value is called an element, and each element has a numeric position in the array, known as its index.
This one is just equating the variable to…
Let’s dive deep into what it is and how it works.
!true // returns false
!false // returns trueisTrue = true //…
length property returns the number of elements in that array. And if we equate this to 0, we will be able to empty the array elements. This method is quite popular but not the fastest way to do the job.
baratheon = ["Robert", "Renly", "Stannis"]baratheon.length = 0console.log(baratheon) // expected result:  console.log(baratheon.length)…
12), or as a type string (ex.
'12'). At times while coding we might have to convert the data from one type to other. I would like to list few of the methods I know of data conversion from number to string and vice-versa.
There is a default string method that converts the data to string. The toString() method returns the value of a String object.
myNumber = 100
myNumber.toString() // expected result: '100'noNumber = NaN
noNumber.toString() // expected result: 'NaN'decNum = 122.33
The most common solution would be to use
hasOwnProperty() which is one of the common object methods…
Package.json is a file in the root directory of a Node.js project that holds various information relevant to the project. This file gives information to npm that allows it to identify the project as well as handle the project’s dependencies.
It can also contain other metadata such as a project description, the version of the project in a particular distribution, license information, even configuration data — all of which can be vital to both npm and the end-users of the package.
A package.json file: