Implementing Socket.io with ReactJS ES6

Question

I\'m having trouble incorporating SocketIO client into my project as I have me project set up isomorphically. After including the socket file in my base html, I try to call

Answer 1

There are likely other solutions, but the following works for me:

1) npm install the socket client side package

2) import socket into the most root component of all components that need socket functionality

3) hookup server side socket event listeners in one of the lifecycle events (constructor / componentWillMount, componentDidMount)

4) pass down socket object through props if it makes sense to handle certain server events in child components

example:

import io from 'socket.io-client'
let socket = io(`http://localhost:8000`)

class App extends Component {
  state = { data: {} }

  componentDidMount() {    
    socket.on(`server:event`, data => {
      this.setState({ data })
    })
  }

  sendMessage = message => {
    socket.emit(`client:sendMessage`, message)
  }

  render () {
    return (
      
    )
  }
}