The Development Factory

  Introduction JSX is a javascript syntax extension which allows you to write html code and javascript together . JSX is a simple html code that you can assign to a variable in javascript file. But many people are confused that how we are able to write html in the javascript file. There is a library name babel which is a javascript compiler that converts the JSX to javascript object and then render the react application . Please check out this link for BABEL   that converts your javascript code to html. You can even create you webhook for the babel and can do the create-react-app which already has the babel compiler installed into it .  This is the jsx code in the app component which is returned in the root.render() with the create root function. Now, let's convert this code in the React.createElement() which is the transformation of the jsx code and further transforms into the javascript object to execute in the browser. This is the code transformation of jsx into React....

  What is Expression? Expression in javascript is a slot in the statement which output some value , without expression the statement is incomplete in javascript . Expression include ternary operators , passing value to variable , mutation in array by array methods , or some logical or relational calculation in the value. What is Statement? Statement in javascript which execute some instruction and called as a program . Statement is incomplete without a expression and carried a slot for the expression to fit in . Declaring a variable needs some value which is a expression that makes the complete statement. Statement doesn't carries a value whether the expression is a value and combination of expression into the statement makes the program start its execution and it forms the complete statement. Statements like if-else conditional statements , for loops , Declaring some variable , functions etc. Expression as Statement In the above paragraph , we understood that expression is a value...

  Introduction React is a javascript library and if you know some javascript basics and have build some projects , you will learn react very smoothly and didn't have to bother learning react. There are some concepts in javascript , if you learn before jumping to react library then react will seemed to be as plain javascript and you only need to learn some particular concepts in react that are specific to the library which are only few. 1.  Scoping This is the one basic but important concept in javascript where  before ES6 has introduced , it has only Global scope and Function scope means variable declare in the function cannot be access in outside environment and gets local to the functions . After ES6  , block {} scope has also introduced where the variable declared in the block cannot be access outside the block. 2. Callbacks Javascript functions are executed in the sequence they are called not in the sequence they are defined which introduced the callback concept ...

  Exploring New Features of ECMAScript 2023 As  javascript continuously to evolve , we as a javascript developers eagerly would like to explore and use in our projects to increase the productivity in writing the code and achieving efficiency. So, let's explore the ECMAScript 2023 Javascript features. 1) .with() Earlier when we want to update some changes , the original array is altered and we get to see some side effects due to the same array changed . But .with() method can return the duplicate array with the changes.  In this example , you can see the old way of updating the array and with the use of new feature the array can be easily update without altering the original array.   2) .toSpliced() This method in javascript is used to pull out the specific element and with the number of number of element to pull out is mentioned in the parameters . Earlier , with the splice()  method the array is altered with the desired result but can cause some side effects. S...

Introduction We have discuss core redux basics , now it's the time to explore redux in react at the basic level . Let's look at the redux step by step deeply in the sample project of react. In this project , we will have the increment , decrement and show toggle actions which will manipulate the counter state and display the state accordingly. First step , would be to create the store with the reducer function of the redux which will handle the change in the component and maintain the state across the react application. In this example ,  we will declare the initial Values and set the counter = 0 and show = true whenever some action is dispatched ,  these default values  changes accordingly though the reducer function . If we don't specify the initial values that will bring result and error because the initial values are undefined or not declared as you are changing value which is not even defined, so it will obviously produce an error. After declaring intialValues , it w...