Non-expo option

[jonathanj]

This looks great, and I know this is probably a long shot (since I see it uses the expo devtools integration) but would it be possible to offer this as a non-Expo option?

What would that even involve, I’m assuming that the RNC CLI doesn’t offer a plugin mechanism for devtools?

[LovesWorking]

Yes! I'm making an update in 1-2 weeks to support any js mobile based framework to support this.

[LovesWorking]

Very close to being done. The desktop app is working great on Mac—just waiting on final approval. I’m aiming to wrap it up by the end of this weekend or early next week at the latest.

This will allow anyone to use the same UI to manage React Query DevTools remotely from a desktop app, across any JavaScript-based mobile framework. All it takes is installing an NPM package or dropping in a simple function to send messages between the mobile app and the desktop app.

I also plan to expand this with more features down the line, bringing the same dev tools experience to other storage types and adding more useful tools as ideas come up.

[LovesWorking]

@jonathanj can you please test it and let me know if it works for you.

https://github.com/LovesWorking/rn-better-dev-tools

Make sure to copy the react-query-external-sync folder and paste it into your app repo and then call this hook

  useSyncQueriesExternal({
    queryClient,
    socketURL: 'http://localhost:42831',
    deviceName: isIOS ? 'ios' : 'android',
    platform: isIOS ? 'ios' : 'android',
    deviceId: isIOS ? 'ios' : 'android',
    extraDeviceInfo: {
      'test-device-info': 'test',
    },
    enableLogs: true,
  });

After that, run the App, then start or re-start your native apps and they should connect. Make sure you also install the socket io client for the hook to work.

[jonathanj]

It's working!

I needed to add an export for useSyncQueriesExternal from ./path-to-copied-folder/react-query-external-sync, otherwise getting it working was very straightforward.

Great work, @LovesWorking! 👏

I'm quite curious about rn-better-dev-tools. Is the goal for that to eventually support plug-in devtools? It would be quite useful to be able to write work-specific devtools with such a nice UI.

[LovesWorking]

It's working!

I needed to add an export for useSyncQueriesExternal from ./path-to-copied-folder/react-query-external-sync, otherwise getting it working was very straightforward.

Great work, @LovesWorking! 👏

I'm quite curious about rn-better-dev-tools. Is the goal for that to eventually support plug-in devtools? It would be quite useful to be able to write work-specific devtools with such a nice UI.

Yes, the goal is to build developer tools similar to Reactotron or Expo plugins but with a nice external dashboard to manage everything. I'm happy to hear it's working!