It is not financial advice. I myself have $57 worth of Etherium and maybe BTC 0.0019 locked in my PC because I forgot the password of my Bitcoin wallet. I bought these Bitcoins probably in 2016, just for fun, and didn’t bother to write down the password. I can see them on my PC but can’t do anything with them.
If you ask me, I would not advise you to buy Bitcoin for the same reason I will not ask you to buy a lottery. …
In our last tutorial, we studied the functional component. We learned how to create functional components and how JSX works inside of it. Today, we are going to learn about props. You will use props a lot in ReactJS and it is necessary to understand what they are and how they work.
Create a new app by typing the following command in the terminal.
$ npx create-react-app props-example
$ cd props-example
Create a new folder in the src and name it ‘components’. The whole point of React is to make it easier for us to create the front-end of the…
React is the most famous library in JavaScript and its demand growing pretty rapidly in the last few years.
Environment Setup
We will be using the VS studio code editor and MAC operating system. If you are using any other operating system, for the most part, you won’t face any difference. The only difference is installing some of the packages, so just go to the respective documentation and you should be good.
After installing node and npm, we are ready to write our first code.
go to the folder of…
To start a project, please type the following commands in the terminal ( please see my first tutorial on Django to initialize the virtual env and project setup ).
(env) Mac:back-end saran$ django-admin startproject ecom(env) Mac:back-end saran$ cd ecom/(env) Mac:ecom saran$ django-admin startapp home
This is a reference to a great book Understanding Redux by Emmanuel Ohans. You can follow the link and get the book. The event described in a book which can be understood very easily by any 5 years old goes something like this.
Consider someone who has given you a task to get some money out of a bank. The intention ( action ) you have in your mind is to withdraw money from the bank. In JavaScript, we can represent it as WITHDRAW_MONEY. The first step when you enter the bank is to talk to a cashier and ask…
In this tutorial, we will introduce the core concepts and principles to use Redux in your app.
According to the official website, Redux can be defined as:
Redux is a pattern and library for managing and updating application state, using events called “actions”.
Redux is a centralized store where each and every component can access the state of the application. Redux helps to manage the global state and this state is needed across multiple parts of the application.
function Counter() {
// State: a counter value
const [counter, setCounter] = useState(0)// Action: code that causes an update to the…
By using this Hook, you tell React that your component needs to do something after rendered the component. React will remember the function you passed and call it later after performing the DOM updates. In this effect, we set the document title, we could also perform data fetching or call some other imperative API.
In the future when we will fetch data from an API, if we are using functional-based components, we will need to use useEffect hook. Let’s see an example of how it works.
Add the following code to App.js
import React, {useEffect, useState} from 'react';function App()…
Finding passion is so hard that most of us couldn’t find it. It’s so awkward nowadays to say that we don’t have a passion for something. Maybe because with the help of the internet, people turned their passions into money-making machines. Those who could dance, became an online choreographer, those who were crazy about filmmaking became vloggers.
And the rest of us couldn’t find our passions and we got stuck at 9–5. So, to have a good life, we must need passions? I would say we should start with choices. We should try more things ( even random ) as…
Hooks are functions that let you “hook into” React state and lifecycle features from function components. Hooks allow you to use React without classes. It means you can use state and other React features without writing a class. React provides a few built-in Hooks like useState, useEffect, etc.
If you write a function component and realize you need to add some state to it.
This method is invoked immediately before a component is unmounted and destroyed. Perform any necessary cleanup in this method, such as invalidating timers, canceling network requests, or cleaning up any subscriptions that were created in. This is executed just before the component gets removed from the DOM.
componentWillUnmount() {}
add the following code to student.js
import React, {Component} from 'react';export default class Student extends Component {componentDidMount(){console.log("Student Mounted");}componentWillUnmount(){console.log("App Unmounted");}render() {return (<div><h1>It's Student Component</h1></div>)}}
add the following code to App.js
import React, { Component } from 'react';import Student…
I write tutorials on Python, JavaScript, React, Django, and CSS.