Category "reactjs"

how to move placeholder to top on focus and while typing

I am trying to implement a simple input box where when I click on the box the placeholder value moves to the top but have an issue that it always shows on top.

In Next.js when fetching data from ghost CMS it ends up in 502 error only on first load

I'm using Heroku free plan to host the blog section of a website in Ghost CMS and use Next.js for the front(netlify) to fetch the data from it. On first loading

How I can show two nav.link while using a conditional operator?

My code: <Nav> { user?.uid ? <button onClick={() => handleSignout()}>Sign Out</button> : <Nav.Link as={Link

Regex validation for a specific value with React Formik

First is, I want to validate the field that if the user type a character that is not existing in this (e.g.): /[ùûüÿ€’“&

How can I load Google Tag Manager to a next.js app, AFTER the app is fully loaded?

I'm building a next.js application and would like to load Google Tag Manager (GTM) only AFTER the entire page is loaded. The goal behind this is to improve the

Build problem with React viteJS and was amplify

my question is quite simple to explain. I've initialized a React project with ViteJS and then added aws-amplify for the backend. I developed the project and eve

React/Jest - How to simulate touch "swipe" event

I have a component that triggers a function call whenever a swipe interaction was done. This swipe interaction can either be executed by touchEvent or mouseEven

county boundaries for US map with large data

I am trying to load all the county boundaries in the initial load. So I researched and found that loadGeoJson will support that. when I test with state boundari

Unable to center the content within a Material UI TableCell

I have TableCell which shows a status and a Button. I want them to be vertically stacked and centered in the cell. I am able to get either working separately bu

Redux store data being reset upon "getServerSideProps" being called; not persisting

Overview: I have a TypeScript NextJS project that I am using Redux-toolkit with to manage state. My file structure for my Redux store and pages are as follows:

React router 404 Error On (Litespeed Webserver)

I am building movie app, initialize with create-react-app. I am using react-router@5. I get 404 Error when route url on production (on Litespeed webserver) but

How to communicate between sibling components in React

How to transfer props from one sibling to another, please? In main app I have only 2 siblings: Input: import React from "react"; const Input = () => { ret

Linking requires a build-time setting `scheme` in the project's Expo config (app.config.js or app.json) for production apps [closed]

Linking requires a build-time setting scheme in the project's Expo config (app.config.js or app.json) for production apps, if it's left blank,

Jest test error: ...subscribe is not a function

I'm using Jest to test my Angular app (using Nx workspaces). I have a component that uses a service that I'm trying to mock. Here's the code: myDummyService.per

What I do for write math formulas in react draft wysiwyg?

I many times write about it. But I cannot get any help. How to write equations in react-draft-wysiwyg. I find good solution in [github][1]. But now cdn not work

Simple Peer on data stream throws process not defined error

I am trying to open a data channel using simple peer. I send the signal using Firebase and am able to get the on connect function to fire. const [thisPeer, setT

force folder structure and names in a repository using eslint

I'm looking to force a structure of names in a specific path for a folder and it's sub folders not only the styling of the names (kebab, camel) but the actual n

useSession not returning data as expected

UPDATE It works now. All I had to change is session: { jwt: true, strategy: "jwt" } I am new in next-auth. I was practicing next-auth sign-in with credenti

How do I link to another page in my MUI mini drawer sidebar?

I've tried to encapsulate my ListItem component with <Link to"/create> but it doesn't work, i've also tried using the history option but that confused me.

How to convert blob / object to video React

I am building a project that has a video player that is read from FastAPI. How can I convert the blob / object into a video format. Please advise This is what I