Category "reactjs"

Best way to provide admin role from Django REST to ReactJS

The default django user model has a is_superuser field. I would like to use this field to conditionally render components in react, i.e. get something like this

Hero section video overflowing (CSS/React)

How do you make a navbar and hero section that fills the height of the screen, and not scrollable? Currently I am trying: My nav css: .NavStyle { top: 0; wi

After adding env file to my project the firebase auth is not working, console showing the api key is not correct

Here how I connected firebase with environment variable: const firebaseConfig = { apiKey: process.env.REACT_APP_apiKey, authDomain: process.env.REACT_APP_

Js .map giving unexpected results

this is my code for map and this is giving unexpected results: console.log('results', results); let newResults = [...results]; newResults = results.map((el) =&

TypeError: ‘undefined’ is not an object (evaluating)

I'm started react-native tutorial on youtube, and I get error this one. TypeError: ‘undefined’ is not an object This is File it is showing from:

How to fetch with parameters using React Query?

For the sake of this question let's first assume existence of such entity: export interface Event { id: number; date: Date; } Then let's assume there's

Next.js - Why I get hydration error in my header component

I am working on a job portal, I get user authentication using JWT and store it in local storage. I get hydration error in my header component when authenticated

How to add spinner for loading to fetch API from MongoDB?

Custom hook .js import { useEffect, useState } from "react"; const UseHook = () => { const [items,setItems]=useState([]); useEffect(()=>{

when I use setTimeout for show user is typing or not then its working but its blinking when I am typing continuously

I am using setTimeout and its working but when I am typing continuously then also its blinking How I can solve It ? messageHandler(ev) { const message =

Socket.io Client repeats event action multiple times from one emit

I am creating a simple diffie hellman demo with sockets and it seems that whenever my server emits any event, the client repeats it multiple times. For example:

reacr ssr template won't run : help fix code base

This is an attempt to demo how to utilize react ssr however it is not functional. See git repo and I appreciate any insights or PRs to fix the issues. Clone wit

Display Fetched Data from API in react and display in responsive table?

I try to make a responsive table to display fetched data from API in react.js. I designed a table but it is not responsive. <TableContainer > &l

Tailwind CSS custom gradient with React state and FastAverageColor

I'm trying to add a custom gradient over an image using React state, Tailwind CSS and the FastAverageColor package (https://www.npmjs.com/package/fast-average-

Why logout navlink doesn't work with localStorage?

I'm trying to use localStorage in order to connect/disconnect users on my website. I tried to manage this with a condition on click on the navbar (it concerns t

Electron-React error: I keep getting undefined error while reading 'ipcRenderer'

I am trying to create a desktop application using Electron and React. I set the basic settings using electron-react-boilerplate. https://github.com/electron-rea

React Beautiful DnD, multiple columns inside single droppable

I am trying to have a grid column layout, (2 columns) inside a single droppable container. The project is for an online menu where you can create a menu item, w

Getting null when I use context.query with getServerSideProps() in Nextjs?

Intro Basically, I am building an e-commerce website. But I got stuck in this problem while saving the order details after I click payment button (although I ha

Add responsiveness to reactjs landing page

We have large react application without using any UI framework, we build all UI component our own. Now we need to make landing page portion responsive (it's par

How to show the value of an foreign key in the frontend?

I want to show the value of injurydiseases in the frontend of Animals AnimalModel.js injurydiseases: { type: mongoose.Schema.ObjectId, ref: 'injurydisea

How can i change Header Bar height in react native?

i'm trying to change Header Bar height in React-Native Stack Navigator this is my code I tried to put headerStyle: height:'100', but it doen't work what should