---
# System prepended metadata

title: life cycle methods

---

# life cycle methods

```javascript=
import React from "react";
import "./styles.css";

class App extends React.Component {
  constructor(props) {
    super(props);

    this.state = {
      name: ""
    };

    console.log("1. constructor - Mounting");
  }


  static getDerivedStateFromProps(props, state) {
    return {// give in return
      name: props.name
    };
  }

  componentDidMount() {
    console.log("3. Didmount - Mounting");
  }

  render() {
    console.log("2. render - Mounting");
    return <div>{this.state.name}</div>;
  }
}

export default App;

```