This is the array what I am getting [ { id: 1, name: 'hello world', reference_id: 2 }, { id: 2, name: 'hello world', reference_id: null }, { id: 3, name: 'hello world', reference_id: null}, { id: 4, name: 'hello…
This is my first question, so please, bear with me. I'm working on a SPA React project which tracks farms and their associated beds and could use some help. I'd like to render some data on a FarmDetail page by…
I am using .map to go through data inside of an array. And I want to style each "bundle of data" seperately. I have multiple sections (Appetizers, Lunch, etc) each section has its own items. How can I seperate each…
import React from "react"; function ProjectItem({ name, about, technologies }) { console.log("before .map", technologies) const tech = technologies.map ((techItem) => { console.log("this is tech after .map: ",techItem) return <span>{techItem}</span> }) return ( <div className="project-item"> <h3>{name}</h3> <p>{about}</p> <div className="technologies"> {tech} {/*…
I have an <input type="number /> that may or may not have min or max values set. If the user enters a number outside that range, I want to print an error message. I have the error handling figured out…
I need some help: How to use value name from LoginPanel component after user write it inside the input and click button and use it inside the App component. How to render LoginPanel as first and if input name is…
I wanted to create a Modal in NextJS 13.4 (with the new layout.tsx file system), But I couldn't. since this is a new thing I couldn't find a solution on the web either. Here are the things that I've tried:…
I have some React components and they use localstorage to store some information. These are tied to state variables with a custom hook: export const useLocalStorage = (key, defaultValue) => { const [value, setValue] = useState(() => { return getStorageValue(key,…
I have the following array: const tabsList = [ { pathPattern: 'users/' label: 'Manage users' }, { pathPattern: 'users/:id', label: 'Edit user profile' } ] I need a method from react-router-dom to tell me which of the above array entries…
I'm doing a fetch list that return random card sizes with 2 widths: Horizontal (Larger) Default (Horizontal / 2) And I'm getting blank spaces in masonry columns: Problem Image I'm working with react-masonry-css and with this styles: .masonry-grid { display:…