responsivereact.js

responsivereact.js

import React, {Component} from 'react'
import ReactDOM from 'react-dom'

import App from './components/App'
import Mobile from './components/Mobile'

class Main extends Component {
  state = {
    width: window.innerWidth
  }

  componentDidMount() {
    window.addEventListener('resize', this.handleWindowResize)
  }

  componentWillUnmount() {
    window.removeEventListener('resize', this.handleWindowResize)
  }

  handleWindowResize = (e) => {
    this.setState({
      width: window.innerWidth
    })
  }

  render() {
    if (this.state.width <= 1024) {
      return <Mobile />
    } else {
      return <App />
    }
  }
}

ReactDOM.render(<Main />, document.getElementById('root'));

Thank you for your analysis. It is new and different aspects I know before. Looking forward to reading more of your posts wingsio