megaphone icon We're improving your developer experience.
Edit on GitHub

Developer setup

Set up your development environment for building, running, and testing the Mattermost web app.

  1. Set up your development environment for the Mattermost server.

  2. Fork https://github.com/mattermost/mattermost-webapp

  3. Clone the Mattermost source code from your fork next to your mattermost-server directory:

    git clone https://github.com/$GITHUB_USERNAME/mattermost-webapp.git
    
  4. Link the client directory in your server with the dist directory in your webapp:

    mkdir -p mattermost-webapp/dist
    cd mattermost-server
    ln -nfs ../mattermost-webapp/dist client
    cd ../mattermost-webapp
    
  5. Install NVM and use it to install the required version of Node.js:

    • First, install NVM by following these instructions.

    • Then, use NVM to install the correct version of Node.js for the Mattermost web app:

      nvm install
      
  6. If you don’t have it already, install libpng:

    • On Mac, use Homebrew to install it:

      brew install libpng
      
    • On Linux-based operating systems, use your preferred package manager to install it.

  7. Ensure that the mattermost server is running. If it’s not, open a new terminal session, navigate into the mattermost-server directory, and start the server:

    cd mattermost-server
    make run-server
    
  8. Test your environment:

    cd mattermost-webapp
    make test
    
  9. When tests pass, run the app:

    make run
    

    Refreshing http://localhost:8065 should now load the UI.

    If you would like the webapp to automatically refresh as you edit the source code you can install and enable the live reload script injection extension for your web browser (Chrome | Firefox). Then, before running webpack run:

    export MM_LIVE_RELOAD=true