Skip to content

Common React UI for iot-api-<js, python, etc.> example apps designed for InfluxDB client library tutorials.

Notifications You must be signed in to change notification settings

influxdata/iot-api-ui

Repository files navigation

UI for iot-api tutorials

This is a Next.js project bootstrapped with create-next-app and customized to route /api requests to external middleware - specifically, the InfluxData iot-app-<js, python, etc.> example applications.

Start the Next.js frontend app

  1. Run the development server:

    npm run dev
    # or
    yarn dev

By default, the server runs on port :3000; otherwise, the next available port (for example, 3001). Visit http://localhost:3000 in your browser to see the result.

To view the IoT Starter device dashboard, visit http://localhost:3000/devices/

  1. To customize the UI default page, edit the pages/index.tsx file. The page auto-updates as you edit the file.

Next.js provides a sample REST API at http://localhost:3000/api/hello. To customize the sample endpoints, edit pages/api/hello.ts.

View IoT Starter devices at http://localhost:3000/devices/. To customize the device pages, edit the files located in ./pages/devices.

Use with iot-api-[language] apps

To use the UI with one of the iot-api-[language] example apps, set API_URL in ./.env.development to the URL of the API example app.

The UI automatically routes all /api/ requests to your API server. iot-api-ui uses Next.js' catch-all routing and rewrites module to act as a proxy for cross-domain requests to the server. To customize the URL rewrites, edit next.config.js.

Learn More

Follow step-by-step tutorials to build the IoT Starter app:

To learn more about Next.js, see following resources:

About

Common React UI for iot-api-<js, python, etc.> example apps designed for InfluxDB client library tutorials.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •