_nodejsClient.default.Client is undefined

[Trimsamsa]

Hii,  I am new to CodeSandbox and was trying to use QuestDB in my React app. I added @questdb/nodejs-client using the Dependencies section (Add Dependency). But when I try to create an instance, it gives me this error.

TypeError
_nodejsClient.default.Client is undefined
App/<
/App.js:76:19

  73 | const [data, setData] = useState([]);
  74 | 
  75 | useEffect(() => {
> 76 |   const client = questdb.Client.create();
     |                 ^
  77 | 
  78 |   client.connect(function (err) {
  79 |     if (err) {

Here's my App.js file

import questdb from "@questdb/nodejs-client";
import React, { useEffect, useState } from "react";

const App = () => {
  const [data, setData] = useState([]);

  useEffect(() => {
    const client = questdb.Client.create();

    client.connect(function (err) {
      if (err) {
        console.error("Error connecting to database: ", err);
        return;
      }
      console.log("Connected to QuestDB");
      client.query("SELECT * FROM my_table", function (err, result) {
        if (err) {
          console.error("Error fetching data: ", err);
          return;
        }
        setData(result);
        client.close();
      });
    });
  }, []);

  return (
    <div>
      <h1>My Data</h1>
      <ul>
        {data.map((item) => (
          <li key={item.id}>{item.name}</li>
        ))}
      </ul>
    </div>
  );
};

export default App;

package.json file

{
  "dependencies": {
    "@questdb/nodejs-client": "^1.0.0",
    "@devextreme/runtime": "3.0.11",
    "devexpress-diagram": "2.1.65",
    "devexpress-gantt": "4.1.37",
    "devextreme": "22.2.3",
    "devextreme-quill": "1.5.18",
    "devextreme-react": "22.2.3",
    "es6-object-assign": "1.1.0",
    "inferno": "7.4.11",
    "inferno-clone-vnode": "7.4.11",
    "inferno-compat": "7.4.11",
    "inferno-create-class": "7.4.11",
    "inferno-create-element": "7.4.11",
    "inferno-dom": "latest",
    "inferno-extras": "7.4.11",
    "inferno-hydrate": "7.4.11",
    "jszip": "3.7.1",
    "luxon": "1.28.0",
    "prettier": "2.7.1",
    "prop-types": "15.8.1",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    "rrule": "2.6.4"
  },
  "description": "In this demo, the visualRange property is used to zoom the chart initially. The zoomAndPan.argumentAxis property allows you to zoom and scroll the argument axis at runtime.\nZooming and scrolling are available on mouse-equipped and touch-enable devices: you can use the mouse wheel/spread and pinch gestures to zoom, and the scrollbar/drag gesture to scroll.\n",
  "name": "Zooming and Panning - DevExtreme Charts"
}

Because React apps in sandbox do not provide terminal access, I am unable to install questdb in my react apps and must rely on dependencies.

Thanks in advance

[tristandubbeld]

Hey @Imagi2rey, thanks for raising an issue. Do you have a sandbox you can share with us?

[Trimsamsa]

Here is it: https://codesandbox.io/s/zooming-and-panning-devextreme-charts-forked-y57o81?file=/index.js

[tristandubbeld]

Hi @Imagi2rey, it looks like the only property available on questdb is Sender. The property questdb.Client seems to be undefined, so we can't call .create(). I'm not familiar with the package but can't find Client in the docs either. Do you maybe need Sender instead?

[Trimsamsa]

Hi @tristandubbeld, what am i trying to do is that i wanted to fetch the data from "trips" table from questdb (open source), inside this react sandbox (above link) but this sandbox don't have terminal access so can't install questdb locally, so at lastly was trying to access it through @questdb/nodejs-client (chatgpt told me that I can use Client.create()). Can you please tell me how I can use questdb to fetch "trips" table data inside this sandbox?

Sender is just for sending the data, but I want to fetch the data inside my sandbox. Someone have given me an assignmet and have told me to use questdb in this react template using codesandbox. I am trying from 3-4 days but nothing working :(

QuestDB link: https://questdb.io/docs/develop/query-data/#http-rest-api QuesetDB Github: https://github.com/questdb/questdb

Or how can I get questdb from here to inside the sandbox? Get questdb at https://questdb.io/get-questdb/.

[tristandubbeld]

Thanks for the explanation @Imagi2rey! Sounds to me that you want to create and run a database locally. In that case you do indeed need an environment with a terminal. I can't guarantee it will work as I've never used questdb before, but if you spin up an environment with vite.react.new you have access to a terminal. You can find more information about our new editor in our docs. Let me know if you have any other questions about this.

As to ChatGPT, it can be convincingly wrong sometimes. When I look at the nodejs-qeustdb-client code it's only exposing Sender. You might need to fetch data from the database in a different way.