This repository are intended for learning purpose only. A simple collaborative editor over WebSocket using Ratchet PHP library. It features very simple editor and preview window for previewing HTML content.
Clone this project repository.
$ git clone https://github.com/rioastamal-examples/collaborative-editor-websocket-php
Next is to install all dependencies required by chat server using Composer.
$ cd collaborative-editor-websocket-php
$ composer install -vvv
We need to start two server first is the web socket server and second is normal web server. To start web socket server you can execute a script on ./bin directory.
$ php ./bin/editor-server.php
Websocket Editor server running on 0.0.0.0:9191.
--
Now open another terminal and start web server using PHP built-in web server.
The document root should be public/ directory.
$ php -S 0.0.0.0:9190 -t public/
PHP 7.1.25 Development Server started at Wed Jan 9 06:10:13 2019
Listening on http://0.0.0.0:9190
Document root is /path/to/collaborative-editor-websocket-php/public
Press Ctrl-C to quit.
On example above by default the web server is running on port 9190 and web socket server on port 9191. Here's step to test.
- Open your browser and navigate to http://localhost:9190/.
- Open another tab or browser window and navigate to the same address.
- Start typing on Editor box, the code should be appear on another window.