Deploying a Custom Site
By default, GraphGrid comes with two websites that are bundled in
the nginx
Docker image. The GraphGrid dashboard provides users a simple way to access ONgDB
data, and is the default site for nginx. A copy of the GraphGrid documentation site is also available at
/docs
.
The GraphGrid Nginx image can also serve other static sites. To do this, start by creating a directory
inside your data directory and under the nginx
directory. For the purpose of this tutorial, this directory will
be named sites
, and will be at data/nginx/sites
. Next, go ahead and put your site content into a subfolder of
sites
. Once again this will only work for static content (i.e html, css, js), so any backend server code will need
to be run externally.
Next, you'll need to expose any site subfolders you set up to the nginx docker container. Do this by adding
a bind mount in docker-compose.yml
. Note the addition of the last line below:
nginx:
image: 754290812573.dkr.ecr.us-west-2.amazonaws.com/graphgrid/nginx:1.4.0
networks:
- default
ports:
- 80:80
- 443:443
volumes:
- data/nginx/config/nginx.conf:/etc/nginx/nginx.conf
- data/nginx/config/global:/etc/nginx/global
- data/nginx/config/sites-enabled:/etc/nginx/sites-enabled
- data/nginx/config/sites-available:/etc/nginx/sites-available
- data/nginx/certs:/etc/nginx/ssl/certs/
- data/nginx/sites/demo-site:/var/www/demo-site
Now you'll need to configure nginx to serve this new site. Create your config files inside data/nginx/config/sites-available
.
For this example we'll name our config file demo-site.conf
. Below is an example nginx config that
we have found works well with our single-page React web applications.
server {
listen 80;
server_name demo-site.graphgrid.com;
root /var/www/demo-site;
location = / {
try_files /index.html @catchall;
}
location / {
rewrite ^/(.*)/$ /$1 break;
try_files $uri.html $uri @catchall;
}
location @catchall {
access_log off;
more_set_headers "Pragma: public";
more_set_headers "Cache-Control: public";
try_files /index.html =404;
}
}
Please note that you will need to set the server_name
in your nginx configs. When this is
configured, any traffic with a matching destination hostname will be routed to the custom site,
while all other traffic will go to the default GraphGrid dashboard. It is possible to run
multiple sites inside the same nginx container, but you'll need to use distinct hostnames.
To activate this new nginx config, create a symbolic link to sites-enabled
. To do this,
cd
into data/nginx/config/sites-enabled
and run ln -s ../sites-available/demo-site.conf demo-site.conf
From here you should be able to restart the nginx
container and access your custom site. If you
have any issues loading it, try modifying the file/folder permissions under the sites
directory to be
more permissive using chmod
.
If you're looking to test the custom site locally, and are on a unix machine,
add a line to /etc/hosts
with a fake domain name pointing to 127.0.0.1
. You may have to restart
your local DNS resolver for the change to take effect. Another option is to use curl and manually
set the host header like this:
curl -H "Host: demo-site.graphgrid.com" http://localhost/