Image for post
Image for post

In this article, I’m going to discuss very basic topics of Vue.js that is needed to start learning Vue.js framework. The topics I’m going to cover today are given the followings:

1. Basic Installation
2. Vue Instance
3. Attribute Binding
4. Conditional Rendering
5. List Rendering
6. Event Handling

Let’s begin…

1. Basic Installation

If you want to use Vue.js in your projects, you need to create javascript files and in the body tag of HTML file, you have to add the following scripts.

<!-- production version, optimized for size and speed -->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>

This is the easiest way by which you can install Vue.js …


Image for post
Image for post

Top HTML & CSS interviews questions with answers are given below —

#HTML

  1. What is an image map?

Image map lets you link to many different web pages using a single image. You can define shapes in images that you want to take part in an image mapping.

2. How do you create links to sections within the same page?

Links can be created using the <a> tag, with referencing through the use of the number (#) symbol. For example, you can have one line as <a href=”#topmost”>BACK TO TOP</a>, which would result in the words “BACK TO TOP” appearing on the webpage and links to a bookmark named topmost. …


Image for post
Image for post

After listening to the word ‘Algorithm’, first things that may come to mind is that what the algorithm is. Well, an algorithm is a set of well-defined instructions in sequence to solve a problem. We can consider algorithms that it’s a good quality if —

  • Input and output are defined precisely.
  • Each step in the algorithm is clear and unambiguous.
  • Algorithms are most effective among many different ways to solve a problem.
  • The algorithm is written in such a way that it can be used in different programming languages.

1. Factorial

In mathematics, the factorial of a non-negative integer n, denoted by n!, is the product of all positive integers less than or equal to n. …


Data may be organized in many different ways, the logical or mathematical model of a particular organization of data is called a data structure. The choice of a particular data model depends on two considerations. These are —

  • First, it must be rich enough in structure to mirror the actual relationships of data in the real world.
  • Second, the structure should be simple enough that one can effectively process the data when necessary.
Image for post
Image for post

Let’s see some data structures that every JavaScript developer needs to know.

1. Array

The simplest type of data structure is a linear or one-dimensional array. It is the most basic of all data structures. An array stores data in memory for later use. Each array has a fixed number of cells decided on its creation, and each cell has a corresponding numeric index used to select its data. …


Image for post
Image for post

In this article, I’m going to discuss some topics of react that should know as a beginner. Let’s begin….

1. Things that required for most basic React app

The most basic react app requires three things. These are the followings -

  • ReactDOM.render() to render our app
  • A JSX element (called a root node in this context)
  • A DOM element within which to mount the app (usually a div with an id of root in an index.html file)

2. Components

There are two types of components in react. One is class component and the other is function components.

The syntax of class components -

import React from "react";
// class component
// (classes are another type of function)
class Header extends React.Component {
// class components have more boilerplate (with extends and render method)
render() {
return <h1>Hello React</h1>;
}…


Image for post
Image for post

In this article, I’m gonna discuss react hooks and its basic functionality. Let’s begin…..

1. What is React Hooks

React hooks are functions that let us hook into the React state and lifecycle features from function components. It allows us to easily manipulate the state of our functional component without needing to convert them into class components. By using hooks, we can totally avoid using lifecycle methods, such as componentDidMount, componentDidUpdate, componentWillUnmount.

2. Basic Built-in Hooks

Some basic built-in hooks are given below -

useState — It returns a stateful value and a function to update it.

useEffect — It lets us perform side effects in function components.

useContext- It accepts a context object and returns the current context value, as given by the nearest context provider for the given context. …


Image for post
Image for post

In this article, I’m going to discuss JSX, default props, unit tests, and test-driven development.

Let’s begin……

1. React Must Be in Scope

The React library must also always be in scope from JSX code as JSX code compiles into calls to React.createElement.

Example -

import React from 'react';
import CustomButton from './CustomButton';
function WarningButton() {
// return React.createElement(CustomButton, {color: 'red'}, null); return <CustomButton color="red" />;
}

Despite being not directly referenced from JavaScript, both React and CustomButton are necessary in the example above code.

2. Dot Notation for JSX Type

It is possible to refer to a React component using dot-notation from within JSX. …


Image for post
Image for post

In this article, I’m going to discuss some fundamental topics of React js. Let’s begin…….

1. React Tree Reconciliation

The process by which react updates the DOM is called Reconciliation. When a state of a component changes, react creates a new tree which is the Virtual DOM. The virtual DOM contains the new state. React then compares the virtual DOM and old DOM and from the comparisons it figures out the difference. After getting the differences, react makes an update to the different part only.

2. ReactDOM.render

ReactDOM.render is the entry point for a React application into the browser’s DOM. It has 2 arguments.

ReactDOM.render(element, document.getElementById('ID OF THE…

21 must-know topic of JavaScript
21 must-know topic of JavaScript

In this article, I’m going to discuss some important topics of Javascript that a beginner Javascript Programmer should know of. This article is for you if you are at a beginner level of Javascript. Let’s begin —

1. Higher-Order Function

After seeing the title higher-order function, one question that may come to your mind is what the higher-order function is. The answer to that question is that a higher-order function is a function that —

  • either accepts a function as an argument
  • or returns a function as a result.

Let’s see an example of a function that accepts a function as an argument…


21 must-know topic of JavaScript
21 must-know topic of JavaScript

In this article, I’m going to discuss block binding, function, destructuring, and class. Let’s begin….

1. Var Declarations and Hoisting

If a variable is declared using var in the outside of a function, then the variable is treated as if it is at the top of the function regardless of where the actual declaration occurs. It is called hoisting. For instance,

Image for post
Image for post

The variable value is actually still accessible from within the else clause and it would just have a value of undefined because it hasn’t been initialized.

2. Constants vs Let Declarations

Both the keywords const and let works in the same way but there is a difference. The difference between them is that if we attempt to change the value of a variable that is declared with const then it will throw an error. …

About

Md. Akhtaruzzaman

I’m a junior front end web developer

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store