I have a very simple tailwind.config.js file defined as follows: const defaultTheme = require('tailwindcss/defaultTheme'); /** @type {import('tailwindcss').Config} */ module.exports = { content: ['./src/**/*.{js,jsx,ts,tsx}'], presets: [], darkMode: 'media', // or 'class' theme: { fontFamily: { sans: ['var(--font-satoshi)', ...defaultTheme.fontFamily.sans], }, }, plugins:…
I use the following component to create tabs within my project. function Tab({ children, className, fullWidth = true, ...props }: ExtractProps<typeof HeadlessTab> & { fullWidth?: boolean; }) { const list = useContext(listContext); const liRef = React.createRef<HTMLLIElement>() return ( <HeadlessTab as={Fragment}>…
I recently started learning React, and I learn the useState hook, however I'm struggling to learn the useEffect hook. I've looked at the documentation searched it up and also watched a video about it but I still can't find out…
I'm trying to insert image to table field but it's only displaying url. I used renderCell to inject image component but doesn't works. The problem is same as from this question but the solution provided didn't work. I have all…
const handleSubmit = async(e) => { e.preventDefault(); setData({...data, error: null , loading: true}) if (!first_name || !last_name || !email || !password){ setData({...data }) } try{ const result = await createUserWithEmailAndPassword( auth, email, password ); await setDoc(doc(db, "users", result.user.uid), { uid:…
Whenever a new item is added to the list, the local storage is updated but if i refresh the page. The key remains but the value is reset to an empty array. import { useState, useEffect } from 'react'; function…
import React , {useState} from "react"; import { Link } from 'react-router-dom'; import Typed from 'react-typed'; const Register = () => { const [data, setData] = useState({ first_name: '', last_name: '', email: '', password: '', error: null, loading: false, });…
I know this is most common question but here i'm, I'm creating the todo react app,i've just started using react but the thing is i'm already passing the id and then using as the key prop in the Todo Component,…
useNavigate() may be used only in the context of a <Router> component. react-router-dom version is ^6.12.0. As shown above in attached image, we have a problem. What do you recommend to do?** Header Merchant button on navbar is not working…
So, my instructor building an application, he told me to use getServerSideProps(context). Since Next.js updated, I want to know what context means and what does it holds? Since the course was outdated, can any please tell me the alternative method?…