Css – React with MUI: How to build a footer
I have a footer at the bottom of my page, where I want the following: Be all the way at the bottom after the content of the page Be at the bottom of the screen if there's not enough content…
Javascript – ESLint custom rule to restrict Material UI imports
I'm working in a project that's in Nextjs 14 with Material UI 5 components for styling. I want to know if there's a ESLint custom rule to restrict the way of importing the components, probably with no-restricted-imports. // This should…
Reactjs – why the first value of this.state array is undefined?? React
import React, {Component} from "react" import './index.css'; export default class ListArticle extends Component { constructor(props) { super(props); this.state = { arrayJson: [""], } } get() { fetch("http://localhost:8080/getHeaders", { method: "GET" }) .then(data=>data.json()) .then((data)=>{ this.setState({arrayJson:data.headerArray}) } ) } componentDidMount() { this.get();…
Javascript – Cannot do npm run
I have a ReactJS project, with package.json file: { "name": "front-end", "version": "0.1.0", "private": true, "dependencies": { "@testing-library/jest-dom": "^5.17.0", "@testing-library/react": "^13.4.0", "@testing-library/user-event": "^13.5.0", "bootstrap": "^5.3.2", "cors": "^2.8.5", "pg-promise": "^11.5.4", "querystring": "^0.2.1", "react": "^18.2.0", "react-dom": "^18.2.0", "react-resizable": "^3.0.5", "react-router-dom": "^6.16.0", "react-scripts":…
Javascript – Need to store React Functional component in react useState hook
I want to store React component in react useState but i think it is technically is wrong. What you think about that. Example const LayoutContext = createContext(null as unknown as { setSidebarContent: React.Dispatch<React.SetStateAction<null | React.ReactNode>>; }) const Layout = ()…
Html – Wave design on a div border
I'm trying to clone some projects interfaces on dribble for study purposes and raise my css skills, i've selected the layout below: As you can see it's a mobile interface but i'm using react dom to build it ( as…
Javascript – Trigger reactjs event from browser console?
Im building a bookmarklet to automatically perform actions on my browser. The site im trying to make this work with (i dont control the site's source code) has some elements that change when hovering with the mouse (or pointer) and…
React map function applying CSS only some of the time
I'm writing a React component for a navbar of a personal site. I am using a list called navItems to track the name, color, and link for each navbar item: const navItems = [ { name: "home", color: "sky-700", link:…
Reactjs – NextJs open and close side drawer with app router
I have created a NextJs app router to achieve the routes as follows: /chat/conversation_id -> /chat/new or /chat = Open in full main layout /chat/conversation_id/history -> /chat/new/history or /chat/id/history = Open in the - side drawer along with chat /chat/conversation_id/files…
Reactjs – Spreading props with conditional props after omitting
I have a component which conditionally accepts either of two props using never like this: type Props = { name: string; age: number; } & ( | { education?: string; profession?: never; } | { education?: never; profession?: string; }…