From 07c4f9e8997f93dbcf840c9847ef5df27e093460 Mon Sep 17 00:00:00 2001 From: Ruben van de Ven Date: Mon, 2 Nov 2020 15:11:27 +0100 Subject: [PATCH] Info for installation --- developer_docs/installation.md | 23 +++++++++++------------ digitalplayground-apache.conf | 26 ++++++++++++++++++++++++++ p5.js-web-editor.service | 1 + 3 files changed, 38 insertions(+), 12 deletions(-) create mode 100644 digitalplayground-apache.conf diff --git a/developer_docs/installation.md b/developer_docs/installation.md index 2a788c02..c958d27b 100644 --- a/developer_docs/installation.md +++ b/developer_docs/installation.md @@ -7,30 +7,29 @@ Follow these instructions to set up your development environment, which you need _Note_: The installation steps assume you are using a Unix-like shell. If you are using Windows, you will need to use `copy` instead of `cp`. 1. Install Node.js. The recommended way is to Node through [nvm](https://github.com/nvm-sh/nvm). You can also install [node.js](https://nodejs.org/download/release/v12.16.1/) version 12.16.1 directly from the Node.js website. -2. [Fork](https://help.github.com/articles/fork-a-repo) the [p5.js Web Editor repository](https://github.com/processing/p5.js-web-editor) into your own GitHub account. -3. [Clone](https://help.github.com/articles/cloning-a-repository/) your new fork of the repository from GitHub onto your local computer. +3. [Clone](https://help.github.com/articles/cloning-a-repository/) this repository using git onto your local computer. ``` - $ git clone https://github.com/YOUR_USERNAME/p5.js-web-editor.git + $ git clone https://git.rubenvandeven.com/r/p5.js-web-editor/ ``` 4. If you are using nvm, run `$ nvm use` to set your Node version to 12.16.1 5. Navigate into the project folder and install all its necessary dependencies with npm. - ``` $ cd p5.js-web-editor $ npm install ``` 6. Install MongoDB and make sure it is running - * For Mac OSX with [homebrew](http://brew.sh/): `brew tap mongodb/brew` then `brew install mongodb-community` and finally start the server with `brew services start mongodb-community` or you can visit the installation guide here [Installation Guide For MacOS](https://docs.mongodb.com/manual/tutorial/install-mongodb-on-os-x/) - * For Windows and Linux: [MongoDB Installation](https://docs.mongodb.com/manual/installation/) 7. `$ cp .env.example .env` -8. (Optional) Update `.env` with necessary keys to enable certain app behaviors, i.e. add Github ID and Github Secret if you want to be able to log in with Github. -9. `$ npm run fetch-examples` - this downloads the example sketches into a user called 'p5' -10. `$ npm start` -11. Navigate to [http://localhost:8000](http://localhost:8000) in your browser -12. Install the [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en) -13. Open and close the Redux DevTools using `ctrl+h`, and move them with `ctrl+w` +8. (For DigitalPlayground) use provided .env file +9. Run `npm run build:server && npm run build:client` to make sure all script are built and bundled. +11. use the provided service file to start the server through systemd + - edit `p5.js-web-editor.service` so it has the right files & folders according to you installation + - `cp /home/dp/p5.js-web-editor/p5.js-web-editor.service /etc/systemd/system/` + - `systemctl deamon-reload` + - `systemctl start p5.js-web-editor.service` +12. (Optionally) Set the `PORT` and `NODE_PORT` variables in the p5.js-web-editor.service and .env files to the desired port OR use an apache server (or something else) as https-proxy server. For an example see `digitalplayground-apache.conf`. + ## Docker Installation diff --git a/digitalplayground-apache.conf b/digitalplayground-apache.conf new file mode 100644 index 00000000..32d81bdb --- /dev/null +++ b/digitalplayground-apache.conf @@ -0,0 +1,26 @@ +# Forward to IPv6-only host + + Servername dp.rubenvandeven.com + + RewriteEngine On + RewriteRule ^ https://%{SERVER_NAME}%{REQUEST_URI} [END,NE,R=permanent] + + + + Servername dp.rubenvandeven.com + + RewriteEngine On + RewriteCond %{HTTP:Upgrade} =websocket [NC] + RewriteRule /(.*) ws://digitalplayground.rubenvandeven.com:8000/$1 [P,L] + RewriteCond %{HTTP:Upgrade} !=websocket [NC] + RewriteRule /(.*) http://digitalplayground.rubenvandeven.com:8000/$1 [P,L] + + ProxyPass / http://digitalplayground.rubenvandeven.com:8000/ + ProxyPassReverse / http://digitalplayground.rubenvandeven.com:8000/ + ProxyPreserveHost On + + SSLCertificateFile /etc/letsencrypt/live/dp.rubenvandeven.com/fullchain.pem + SSLCertificateKeyFile /etc/letsencrypt/live/dp.rubenvandeven.com/privkey.pem + Include /etc/letsencrypt/options-ssl-apache.conf + + \ No newline at end of file diff --git a/p5.js-web-editor.service b/p5.js-web-editor.service index d3cc82c6..9d8f0205 100644 --- a/p5.js-web-editor.service +++ b/p5.js-web-editor.service @@ -3,6 +3,7 @@ Description=p5.js web editor After=network.target [Service] +Environment=NODE_PORT=8000 Type=simple User=YOUR_USER EnvironmentFile=/home/YOUR_USER/p5.js-web-editor/.env