In this post, I am going to share some quick pointers that I have created while learning ReactJS.

    1. Create React App
      • npx create-react-app. More about npx
      • npm start
    2. Type of Components
      • Class Components
        • Have state
        • Created using class keyword
        • Must have at least one method: render() to return Component UI
      • UI/Functional Components
        • Don’t Have state
        • Created using ES6 Function style
        • Render method isn’t mandatory as a Function can return only one value
    3. Props: To pass from Parent to Child Component
      • Passing state
      • Passing functions
      • Example:
         <Todos todos = {this.state.todos} deleteTodo = {this.deleteTodo} />  
    4. De-structuring Props in Nested Components
      • Class Component
        const localProps = { props };
        const todos = { props.todos };
        const deleteTodo = { props.deleteTodo };
      • Functional Components
        const Todos = ({ todos, deleteTodo }) => { 
        };
        
    5. Accessing this inside Component functions
      • Create Components using Fat Arrow
        myFunction = () => { 
        };
                  
    6. Component Lifecycle
      • constructor
      • render
      • componentDidMount
      • componentDidUpdate
ReactJS Quick Pointers -Part 1

Leave a Reply

Your email address will not be published. Required fields are marked *