You’re importing a component that needs useState. It only works in a Client Component, but none of its parents are marked with “use client”

In the app directory, by default, Next.js uses Server Components, where the JSX gets compiled to “pure HTML” and sent to the browser. Like any traditional Backend with a templating engine, such as Express with EJS, and Laravel with Blade. This is for better performance, as you can read on the doc: Server Components allow … Read more

How to do a wildcard element name match with “querySelector()” or “querySelectorAll()” in JavaScript?

[id^=’someId’] will match all ids starting with someId. [id$=’someId’] will match all ids ending with someId. [id*=’someId’] will match all ids containing someId. If you’re looking for the name attribute just substitute id with name. If you’re talking about the tag name of the element I don’t believe there is a way using querySelector

Promise.all is returning an array of undefined and resolves before being done

Promise.all accepts an Array of Promise objects. You’re getting an Array of undefined because you’re not returning any Promise in your map callback: function addText(queries) { return Promise.all(queries.map(function(query) { // Add `return` here or the `map` returns an Array of `undefined`. return models.queries .findById(query.queryId, { raw: true, attributes: [ “query” ] }) .then(function(queryFetched) { query.text … Read more

Browser: Uncaught ReferenceError: require is not defined

This is because require() does not exist in the browser/client-side JavaScript. Now you’re going to have to make some choices about your client-side JavaScript script management. You have three options: Use the <script> tag. Use a CommonJS implementation. It has synchronous dependencies like Node.js Use an asynchronous module definition (AMD) implementation. CommonJS client side-implementations include … Read more

Why can’t I use a Javascript function before its definition inside a try block?

Firefox interprets function statements differently and apparently they broke declaration hoisting for the function declaration. ( A good read about named functions / declaration vs expression ) Why does Firefox interpret statements differently is because of the following code: if ( true ) { function test(){alert(“YAY”);} } else { function test(){alert(“FAIL”);} } test(); // should … Read more