Download the React Developer Tools for the browser you use from https://react.dev/learn/react-developer-tools
Author Archives: Laszlo Pinter
error: INSERT has more expressions than target columns
When the parameterized PostgreSQL statement has more elements in the “VALUES” option than the number of columns specified, we get the error message: error: INSERT has more expressions than target columns In the sample code below there are two columns listed, and there are three elements in the “VALUES” option. Solution Remove the extra elements …
Continue reading “error: INSERT has more expressions than target columns”
error: could not determine data type of parameter $1
For security reasons we should always use parameterized queries to avoid SQL injections through parameters. The usual format is When a PostgreSQL command runs and a parameter is not used, we get the error message error: could not determine data type of parameter $1 Solution: Remove the unused parameter from the “parameters” array, in this …
Continue reading “error: could not determine data type of parameter $1”
How to disable static page generation during Next.js site build
If your Next.js React TypeScript web application uses database calls to display data on the pages, and during build time the database is not available, we need to disable the static page generation, otherwise we get the following error: info Generating static pages…TypeError: Failed to parse URL from ……code: ‘ERR_INVALID_URL’ To disable the static page …
Continue reading “How to disable static page generation during Next.js site build”
How to disable linting during React Next.js Node.js application build
If your application is in the proof of concept phase, it works and you just want to build it, you can disable the linting process to have a successful build regardless of linting errors.
Object is possibly ‘undefined’
The ESLint static code analysis tool flags code where we operate on objects which can be undefined. Object is possibly ‘undefined’ The end of the red line shows the extent of the object which can be undefined, as the “children” element is defined as optional in the type definition: To satisfy the linter, we need to …
Type error: Type ‘string’ is not assignable to type ‘number’
When you create an array in TypeScript the type of the first element defines the type of all elements of the array. When we reuse an array with new data, the array type has already been defined, so when we assign new values to the same array we get the error message: Type error: Type …
Continue reading “Type error: Type ‘string’ is not assignable to type ‘number’”
Type ‘null’ is not assignable to type ‘string’
In a TypeScript application ESLint flags code when we try to assign “null” value to string type variables and attributes. This can be necessary when we want to set the value of a database column to “null”. To make a string type attribute nullable, add ” | null ” to the type definition:
Error: Component definition is missing display name react/display-name
If you use the VirtualTable in a React TypeScript web application ESLint will throw an error when it checks the VirtuosoTableComponents. Error: Component definition is missing display name react/display-name The Virtuoso component uses arrow functions to declare the Scroller and TableBody. Arrow functions do not provide the displayName property used by developer tools. We can modify the component to …
Continue reading “Error: Component definition is missing display name react/display-name”
Horizontal scrolling cards
We can use simple CSS settings to scroll cards horizontally in a container. Apply these settings to the container <div>: Configure the card <div>s with this: