Merge pull request #173 from dush-t/master

[Autohost] Add script for 'one-click' deployment of react apps

Author: ionicc

Deployment-scripts/react-autohost/add-to-existing.sh

@@ -0,0 +1,37 @@
+echo "Please select the appropriate option (press 1 or 2) - "
+echo "	1. My server is not serving anything else. This React-app is the only thing I'll be deploying. (Recommended for most users)"
+echo "	2. My server is serving another web-app and I want to deploy this react-app on the same url base url with a different path"
+echo ">"
+read choice
+
+sudo apt-get install nginx
+
+if [[ "${choice}" == "2" ]]
+then
+	echo "Please enter the subdomain that you'd like your app to be served at."
+	echo "For example if your domain is example.com and you want your app to be served at example.com/myApp, enter /myApp"
+	read HOST_SUB_URL
+	echo "Enter the path of the current nginx file that you're using (include the file extension)"
+	read NGINXCONF_PATH
+	
+	echo "Setting up nginx..."
+	
+
+	#touch /etc/nginx/sites-enabled/${NGINXCONF_NAME}.nginxconf
+	
+	touch nginxLocationBlock
+	
+	cat >> nginxLocationBlock <<-EOF
+	
+		location ${HOST_SUB_URL} {
+			expires 1h;
+			autoindex on;
+			alias ${REACT_PATH}/build;
+			try_files $uri $uri/ $uri.html /index.html;
+		}
+	
+	EOF
+	
+	export locationBlock=$(<nginxLocationBlock)
+	
+	sudo sed '0,/location/i\${locationBlock}' ${NGINXCONF_PATH} # Have a bad feeling about this, hope it works.

Deployment-scripts/react-autohost/host.sh

@@ -0,0 +1,40 @@
+#!/bin/bash
+
+
+read -p 'Give a name to your project: ' PROJECT_NAME
+read -p 'Specify the path of your react-project (the path of the directory that contains package.json): ' REACT_PATH
+read -p 'Specify the ip address/your server domain from where you want to serve your app from (use localhost for testing): ' HOST_IP
+read -p 'Specify the port to serve from (recommended for testing: 8080): ' HOST_PORT
+echo "Sit back while I deploy your react app for you."
+echo " "
+
+echo "Setting up nginx..."
+
+sudo apt-get install nginx
+
+sudo rm -rf /etc/nginx/sites-enabled/${PROJECT_NAME}
+touch /etc/nginx/sites-enabled/${PROJECT_NAME}
+
+cat >> /etc/nginx/sites-enabled/${PROJECT_NAME} <<-EOF
+
+server {
+	listen ${HOST_PORT} default_server;
+	root ${REACT_PATH}/build;
+	server_name ${HOST_IP};
+	index index.html index.htm;
+	location / {
+	}
+}
+
+EOF
+
+echo "Building your React project"
+cd ${REACT_PATH}
+node scripts/build.js
+
+echo " "
+echo "Restarting nginx..."
+sudo service nginx restart
+echo "Done!"
+echo "Your react app is online at ${HOST_IP}:${HOST_PORT}"
+

Deployment-scripts/react-autohost/readme.md

@@ -0,0 +1,13 @@
+# For React
+This works for react apps that are bootstraped with Facebook's create-react-app tool. The script will build and deploy your app
+using nginx. It serves a production build of your app. Currently the app only works for cases in which the user does not have any
+other nginx configuration. I'm still working on the script to add the app to an already existing nginx configuration.
+
+The script will install nginx on your system. Currently I've only tested it's compatibility with Ubuntu 19.04.
+
+## How to use - 
+1. Clone this repository and navigate to /react-autohost
+2. Give host.sh executable permissions by `sudo chmod +x ./host.sh`
+3. Run `./host.sh`. The script will guide you through the process.
+
+#### Note: Do not enclose your inputs in quotes when you run the script. The path of the react-project (that the script asks for) is the path of the directory which contains your package.json file.