Skip to main content

React SDK Demo

To get started with the GlamAR SDK, follow these steps and understand how you can integrate GlamAR SDK within your existing application. If you need further assistance, please contact us at support@glamar.io.

Clone the repository​

To clone the repository:

git clone https://github.com/pixelbin-io/glamar-react-demo.git

You can follow a thorough guide click here

Prerequisites​

Make sure you have installed the following prerequisites:

  • NPM : Node package manager.
  • Your access key must be setup under Pixelbin > GlamAR console. If not completed , click here
  • Under GlamAR > Skin Analysis, should have atleast one app with its appId

Setup Local SSL Certificate​

To run the GlamAR SDK locally over HTTPS, you’ll need to generate a self-signed SSL certificate.
Follow the platform-specific steps below:

macOS / Linux​

  1. Install mkcert. (a simple local CA tool) using Homebrew or your package manager.
   brew install mkcert
   brew install nss # required for Firefox
   mkcert -install

  1. Use mkcert to generate a locally-trusted development certificate. Inside your project directory run the following command:

    mkcert -key-file key.pem -cert-file cert.pem “glamar.io”

  2. Create a folder named ssl at the root level of the repository.

  3. Copy the two .pem files (key.pem and cert.pem) generated by the above command into the ssl folder.

  4. Bind localhost (or 127.0.0.1) to the host name local.pixelbinz0.de. To do this:

    Edit the /etc/hosts file (requires admin privileges):

    sudo nano /etc/hosts

    Add the following line:

    127.0.0.1   local.sdk.glamar.io

  5. Login to Pixelbin Console and goto GlamAR using the left panel - link

  6. Under GlamAR > SDK Configuration > Allowed Domains and add https://local.sdk.glamar.io

Windows​

  1. Install mkcert

    • Download the latest release from the official repo:
      https://github.com/FiloSottile/mkcert/releases

    • Rename it to mkcert.exe and move it to a folder in your system PATH (e.g., C:\Windows\System32).

    • Open PowerShell as Administrator and run:

    mkcert -install

  2. Use mkcert to generate a locally-trusted development certificate. Inside your project directory run the following command:

    mkcert -key-file key.pem -cert-file cert.pem "glamar.io"

  3. Create a folder named ssl at the root level of the repository.

  4. Copy the two .pem files (key.pem and cert.pem) generated by the above command into the ssl folder.

  5. Bind localhost (or 127.0.0.1) to the host name local.pixelbinz0.de. To do this:

    • Open Notepad as Administrator
    • Open the file: 
      C:\Windows\System32\drivers\etc\hosts
    • Add the following line: 
      127.0.0.1   local.sdk.glamar.io
    • Save and close.

  6. Login to Pixelbin Console and goto GlamAR using the left panel - link

  7. Under GlamAR > SDK Configuration > Allowed Domains and add https://local.sdk.glamar.io

Running Locally​

  1. Open terminal and download all dependencies of the project
npm install
  1. Run the development server:
npm run start
  1. Open the project in your browser:
  • With certificate: https://local.sdk.glamar.io:9090