The Development Factory

  Why to use Prop Types in React ? Props are used to pass down the data from the parent component to the child component but as our application grows the props we pass to the child components sometimes validate wrong and we get the wrong result also it hard to debug where we are lacking. For example we want age in number datatype in the child component instead we pass age in the string data types so, we get the wrong result just by the wrong data type we passed. So, in this type of case we need validation to ensure we use correct datatype for the props and we can also ensure what kind of data we want to put in the prop whether default or must have values. How and When to use Prop Types in React ? When working with functions , we pass arguments into the functions and when we pass wrong argument , it throws an error . Just like , we want to know where we are doing the wrong validation so we can correct at the point and specify those validation into our react app . In this case , the ...

  Introduction There are three main component in web development HTML , CSS , Javascript where to include external , internal , inline  CSS is quite easy but when Facebook release the React there jsx is born which is a hybrid of javascript and html that makes to style component bit differently and many developers find it difficult to include CSS in React . That's why in this blog we will discuss about some methods for how to include CSS in  React Let's get started ! 1. Internal CSS Internal CSS is used when you want to design the particular element and which is quite straight forward . You just specify the attribute style and include CSS properties in the camelCase and values in the string to be placed in the object which enclosed in later jsx object which is used to style the element . You can also specify the pre-defined object of CSS in the in the jsx object. Look at the below example of using the internal CSS in react   CSS styles may be event created in obj...

  Introduction In React , the modularity of components where all the logic is separate and not dependent on each other but as you know, the parent component and child component are connected as the child component called in the parent component . When they wanted the values from parent component , they will just use props to pass the state between the components. Props play a important role in passing data from one component to another component and that's how modularity achieves. Props are the html attribute that takes the value in the left side where you can also pass the state in the jsx object and any value that is achieved in the parent component. By it's name it is properties which in short called props as they play a role like html properties which used as the properties of component.   As, you can see in the picture below the addNewTodo is the value which is passed to addNewTodo prop that will be accessed in the Todo component by the argument. You will access the ...

  What is Document Object Model ? Document Object model is the web api which manipulates the elements , content of the web page . It is a kind of structure of node or objects which work like a interface in programming languages . A web page is a document contains the html content and the whole body with CSS while Document Object Model is there to manipulate the elements of the document. DOM And Javascript Document Object Model is a web api which is not a programming language but it is a independent api which can be used in any programming languages to manipulate DOM . Javascript is nothing without the document object model , because of which the elements can be changed , styled or created and manipulated with the javascript without the html and CSS used. Only with DOM api (web based)  javascript is so popular and widely used anywhere with such flexibility Accessing the DOM elements You can access the DOM api by internal and external script in the html page and with those scrip...