codesandbox / codesandbox/codesandbox-client

_nodejsClient.default.Client is undefined

Open
#7,383 5 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
13.6k
Forks
2.4k
Avg merge
6d 19h
Merged PRs (30d)
2

Description

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

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the import and client creation in App.js, then inspect the @questdb/nodejs-client entry from package.json in a CodeSandbox React project. Reproduce the undefined Client error and determine whether the dependency export is compatible with the sandbox; done when the reported setup works or its incompatibility is clearly documented.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, nodejs, react
Domain
developer-experience, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.