Category "reactjs"

Docker compose can't correct build react app

I have api (net-core) and react-app projects in root folder. I start dockerize my project from react application. If docker-compose and docker file in same reac

how to resize the font of "No Options"?

I'm using Autocomplete from material-ui and trying to make the font size of "No Options" to be aligned with other fonts. I have tried to use styled component to

how to add drop down list in material-UI Search component in navbar, for search results

I was using material ui search bar into navbar from app-bar-with-search-field official documnets from MUI in my react app. but this article it does not mention

supabase.auth.onAuthStateChange Not Working when React app is in iframe

I am using Supabase user authentication in a React app hosted at https://example.com that is running inside an iframe injected by a Chrome extension chrome-side

Module not found: Error: Can't resolve 'crypto' and Cant resolve 'fs'

ive just started to learn react and Ive been trying to get my react app to connect to my database with var mysql = require('mysql'); var con = mysql.createConne

Conflict with React types when building with tsc

I am trying to build an NPM package with TypeScript, not a normal React project. When I run tsc to build the project, it returns many type errors: It seems to b

React beautiful DND - "Unable to find draggable with id: X"

I am trying to use react-beautiful-dnd for drag n drop sorting of a list but my elements are not draggable and I get Unable to find draggable with id: X. I have

Module not found: Error: Can't resolve img?

I just started learn coding and I was trying to do a project with reactJs and bootstrap. I wanna upload a logo to my project but I got error. Can you explain me

Uncaught TypeError: Found non-callable @@iterator (react/typescript|esbuild-loader)

So i am trying to replace ts-loader with esbuild-loader in webpack, however it seems like as soon as I make the change, the page stops working. { test: /\.t

GraphQL + ReactJS throws Error 400: Bad Request

I've been stuck at trying to submit my form for a couple of days now. I constantly get hit with the following error: "POST http://localhost:5000/graphql 400 (Ba

How to animate visibility of mesh in react three fiber?

I have a 3D model. I have the access to the mesh. What I want is to animate the visibility on button click. When I press a button the mesh should be invisible b

My browser sends fetch data request continuously and it gives pending status after giving 200 several times in react

I'm trying post some data in mongodb database and it works perfectly until the fetch request is sending continuously even if I didn't do anything. In the networ

reading pathname from undefined using react router dom 6.3.0

I am using react-router-dom 6.3.0. Below are my routes inside App component <BrowserRouter> <Routes> <Route path='/article/*' element={<

React video won't load

I'm trying to make a carousel with movies in React, and when I hover on a movie I want the trailer to start, and show some details. Everything works fine, but t

How to let user choose from sample of images displayed on screen along with option to upload from device?

const [selectedFile, setSelectedFile] = useState(null); const [preview, setPreview] = useState(null); const [predictions, setPredictions] = useState([

How to import component as a button in Nextjs?

I have this component with an internal link which is used in multiple pages when I try to import it as a button in the Nextjs application I get this result, it

How can I checked only one checkebox at a time. when clicked one other will be unchecked

here is my code const handleCheckBox = (e) => { const { value, checked } = e.target; if (checked) { setFilter((filter) => [...filter, value]

How to make a step control component?

I have a component: import React from "react"; import styles from "./Clicker.module.scss"; class Clicker extends React.Component { constructor(props) { s

HTML canvas not drawing image

I have a react app but when I try to load an image is not drawing it on the canvas. Here is the code: import React , {useRef, useEffect, useState} from "react"

Rendering React SVG Components as images (using DATA URI)

Hi to optimize my huge svg components I'm tryin to do something similiar to this tutorial: https://medium.com/@ians/rendering-svgs-as-images-directly-in-react-a