{"id":43709,"library":"prostgles-client","title":"Prostgles Client","description":"prostgles-client v4.0.347 is a reactive isomorphic TypeScript client for PostgreSQL that provides real-time data synchronization via WebSocket, relational queries, and auto-generated TypeScript types from database schemas. It offers zero-boilerplate direct database access with first-class React hooks (useSubscribe, useFind, useSync) and works in both Node.js and browser environments. Released under MIT license. Key differentiator: tight integration with prostgles-server for end-to-end type safety and real-time sync without writing SQL. 3-4 minor releases per month.","status":"active","version":"4.0.347","language":"javascript","source_language":"en","source_url":"https://github.com/prostgles/prostgles-client-js","tags":["javascript","postgres","postgreSQL","react","typescript","realtime"],"install":[{"cmd":"npm install prostgles-client","lang":"bash","label":"npm"},{"cmd":"yarn add prostgles-client","lang":"bash","label":"yarn"},{"cmd":"pnpm add prostgles-client","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency for React hooks (useProstglesClient, useFind, useSubscribe, useSync); must be installed for React usage.","package":"react","optional":true},{"reason":"Required for WebSocket-based real-time synchronization (socket.io). Not a direct dependency but listed in installation instructions.","package":"socket.io-client","optional":true}],"imports":[{"note":"ESM-only import for class-based client use without React.","wrong":"const { ProstglesClient } = require('prostgles-client')","symbol":"ProstglesClient","correct":"import { ProstglesClient } from 'prostgles-client'"},{"note":"React hook is not exported from the main entry; must import from 'prostgles-client/dist/prostgles'.","wrong":"import { useProstglesClient } from 'prostgles-client'","symbol":"useProstglesClient","correct":"import { useProstglesClient } from 'prostgles-client/dist/prostgles'"},{"note":"The standalone 'prostgles' function is the default export from the main package; named import fails.","wrong":"import { prostgles } from 'prostgles-client'","symbol":"prostgles","correct":"import prostgles from 'prostgles-client'"},{"note":"All React hooks are only available from the subpath 'prostgles-client/dist/prostgles'.","wrong":"import { useSync } from 'prostgles-client'","symbol":"useSync","correct":"import { useSync } from 'prostgles-client/dist/prostgles'"}],"quickstart":{"code":"import { useProstglesClient } from \"prostgles-client/dist/prostgles\";\nimport { useEffect, useState } from \"react\";\n\n// Define your database types (auto-generated by prostgles-server)\ninterface DBGeneratedSchema {\n  users: {\n    id: number;\n    name: string;\n    email: string;\n  };\n  posts: {\n    id: number;\n    title: string;\n    content: string;\n    published: boolean;\n    user_id: number;\n  };\n}\n\nfunction App() {\n  const client = useProstglesClient<DBGeneratedSchema>({\n    socketOptions: { path: \"/ws-api\" }\n  });\n\n  if (client.isLoading) return <div>Loading...</div>;\n  if (client.hasError) return <div>Error: {client.error}</div>;\n\n  return <PostsList dbo={client.dbo} />;\n}\n\nfunction PostsList({ dbo }: { dbo: ReturnType<typeof useProstglesClient>['dbo'] }) {\n  const { data: posts, isLoading } = dbo.posts.useSubscribe(\n    { published: true },\n    { orderBy: { created: -1 }, limit: 10 }\n  );\n\n  if (isLoading) return <div>Loading posts...</div>;\n\n  return (\n    <ul>\n      {posts.map(post => (\n        <li key={post.id}>{post.title}</li>\n      ))}\n    </ul>\n  );\n}","lang":"typescript","description":"React component using useProstglesClient hook to subscribe to published posts with real-time updates."},"warnings":[{"fix":"Change import path to 'prostgles-client/dist/prostgles' for all React hooks.","message":"React hooks must be imported from 'prostgles-client/dist/prostgles', not from the main 'prostgles-client' entry.","severity":"breaking","affected_versions":">=4.0.0"},{"fix":"Use default import: import prostgles from 'prostgles-client'","message":"The standalone 'prostgles' function is the default export. Named import { prostgles } fails with 'The requested module does not provide an export named prostgles'.","severity":"gotcha","affected_versions":">=4.0.0"},{"fix":"Install socket.io-client and pass the io() instance as the 'socket' option.","message":"ProstglesClient constructor expects a socket.io client instance. Using a different WebSocket library will not work.","severity":"gotcha","affected_versions":">=4.0.0"},{"fix":"Replace useFind with useSubscribe (or useFindOne with useSubscribeOne).","message":"The 'useFind' hook is deprecated in favor of 'useSubscribe' for better real-time support.","severity":"deprecated","affected_versions":">=4.0.0"}],"env_vars":null,"search_vec":"'-4':88 '3':87 'access':42 'auto':28 'auto-gener':27 'boilerpl':39 'browser':58 'class':46 'client':2,5,12 'data':20 'databas':33,41 'differenti':65 'direct':40 'end':74,76 'end-to-end':73 'environ':59 'first':45 'first-class':44 'generat':29 'hook':48 'integr':67 'isomorph':10 'javascript':93 'key':64 'licens':63 'minor':89 'mit':62 'month':92 'node.js':56 'offer':36 'per':91 'postgr':94 'postgresql':14,95 'prostgl':1,4,70 'prostgles-cli':3 'prostgles-serv':69 'provid':16 'queri':25 'react':47,96 'reactiv':9 'real':18,81 'real-tim':17,80 'realtim':98 'relat':24 'releas':60,90 'safeti':78 'schema':34 'server':71 'sql':86 'sync':83 'synchron':21 'tight':66 'time':19,82 'type':31,77 'typescript':11,30,97 'usefind':50 'usesubscrib':49 'usesync':51 'v4.0.347':6 'via':22 'websocket':23 'without':84 'work':53 'write':85 'zero':38 'zero-boilerpl':37","created_at":"2026-06-05T17:01:06.107863+00:00","updated_at":"2026-06-05T17:01:06.107863+00:00","problems":[{"fix":"Use: import { useProstglesClient } from 'prostgles-client/dist/prostgles'","cause":"Importing React hooks from wrong path (main entry instead of dist/prostgles).","error":"Uncaught SyntaxError: The requested module 'prostgles-client' does not provide an export named 'useProstglesClient'"},{"fix":"Use: import prostgles from 'prostgles-client'","cause":"Using named import { prostgles } instead of default import.","error":"Uncaught TypeError: prostgles_client_1.prostgles is not a function"},{"fix":"Ensure prostgles-client is at least v4.0.0 or configure moduleResolution to 'node16' or 'bundler'.","cause":"Missing subpath export 'dist/prostgles' in older version or misconfigured TypeScript paths.","error":"Error: Cannot find module 'prostgles-client/dist/prostgles' or its corresponding type declarations."},{"fix":"Pass 'path' option matching your prostgles-server configuration, e.g., socketOptions: { path: '/ws-api' }","cause":"Missing or incorrect socketOptions path; server expects specific WebSocket endpoint.","error":"WebSocket connection to 'wss://...' failed: Error during WebSocket handshake: Unexpected response code: 400"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":null,"cli_version":null,"type":"library","homepage":"https://prostgles.com","github":"https://github.com/prostgles/prostgles-client-js","docs":null,"changelog":null,"pypi":null,"npm":"prostgles-client","openapi_spec":null,"status_page":null,"smithery":null,"categories":["database"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-05","next_check":"2026-09-03","install_tag":null}}