xObserve

  1. Getting Started
  2. Deploy from source

Installing xObserve

In this sectionl, we will deploy our UI static files and api server in different hosts. First, let's download the `source code` of xObserve from Github, and prepared two servers for hosting xobserve:

1. 10.7.10.10 for hosting xobserve server( api server )

2. 10.7.10.11 for hosting UI static files ( through nginx )

  1. Configure API server address in UI

    Because our UI static files and api server are deployed in different hosts, so we need to configure the API server address for UI to access.

    let's assume your xobserve server( which is also API server ) is running at http://10.7.10.10 , you can also use a domain name here, such as `https://api.xobserve.io`

    Find the `.env` file under `ui` directory, and modify it's content to :

    SourceCodeRoot/ui/.env
    VITE_API_SERVER_PROD=http://10.7.10.10 
  2. Build the release files

    Now, we can build the release files by calling `release.sh` in the root directory of xObserve source code

    SourceCodeRoot
    ./release.sh
  3. Release directory

    When building release files is done, you should see a `release` directory in the root of xobserve source code.

    There are three `.zip` files in `release` directory, unzip the one you need( let's assume you are using linux for hosting), you should see below files that we need to deploy xobserve:

    1. xobserve: Binary file for starting xobserve server (api server)

    2. xobserve.yaml: Config file for xobserve server

    3. xobserve.sql: Sql source for Mysql database

    4. ui directory: UI static files, you can deploy this to nginx or Github pages.

    SourceCodeRoot/release/linux
    linux % lsxobserve		xobserve.sql	xobserve.yaml	ui
  4. Deploy xobserve api server

    Copy `xobserve` binary file and `xobserve.yaml` to the server with ip `10.7.10.10` , modify the `xobserve.yaml` and start xobserve server: `./xobserve --config xobserve.yaml`

    10.7.10.10/xobserve.yaml
    server:    ## xobserve server address    addr: "10.7.10.10:80"
  5. Deploy UI

    Now you can deploy `ui` directory to `Nginx`, let's assume the IP of `nginx` server is `http://10.7.10.11`

    10.7.10.11/nginx
    Deploy static files in release/ui directory  to nginx

Try xObserve in browser

It's more complex than the previous installation sections, but if your are familar with web deployment, you should not feel hard in this process :) Now let's can open Chrome or Safari browser and visit http://10.7.10.11 to access our xObserve UI which is deployed on nginx server.

If you open the inspector of Chrome, you will see all of the xobserve requests are requesting to our api server - http://10.7.10.10

What to read next

  • xObserve Tutorials

    Learn the tutorial and get familiar with xObserve's core concepts and features.

Copyright © 2023 xObserve.io Team.