I created a Higher Order Component (HOC) or Container component from where I am fetching data and sending to child component. I am also using React-Router-DOM library for routing. I am using HOC component like this: <BrowserRouter> <Routes> <Route path={'/'}…
I have an object like this: export const dataEstrenos = [ { id: 1, product: "any product", title: "any title" }, { id: 2, product: "any product", title: "any title" }, { id: 3, product: "any product", title: "any title"…
I am trying to output a HTML list in JSX. Here is how I build the array: let seasonsList = []; for (var i=0; i < jsonData.data.campaigns.list.length; i++) { seasonsList.push(<li key={i}>{jsonData.data.campaigns.list[i].name}</li>); } When I try to output this list I…
I'm encountering an issue with a React component that utilizes useState and useEffect hooks to manage state and persist it in localStorage. The component is intended to create a toggleable section with a title and content, where the expanded state…
basically I need to generate a <div class=row></div> every 3rd record. how can I do this? Some info: using the sample code below, I'm getting an "unexpected token" error HTML renders fine if I remove the getReminder calls instead of…
const Text = () => <p style={{ fontFamily: "Inter" ,color:"azure" }}>Hello world!</p>; export function App(){ const St = <Text/>; console.log(St) return (<>{St}</>) } It prints hello world. My question: what is St in this code? Why can we render St…
I'm trying to implement JWT in my project and an article provides a nice solution: https://dev.to/sanjayttg/jwt-authentication-in-react-with-react-router-1d03. Routes.jsx import { RouterProvider, createBrowserRouter } from "react-router-dom"; import { useAuth } from "../provider/authProvider"; import { ProtectedRoute } from "./ProtectedRoute"; import Login from "../pages/Login";…
I'm encountering a problem while using the YouTube API to fetch data in my React application. Although the data is successfully fetched, it doesn't seem to be stored in the useState variable as expected. Consequently, my VideoCard component, which relies…
I'm working on a React project and have run into an issue where ESLint is throwing an Unknown word (CssSyntaxError) when linting my JSX files. This error seems to be related to CSS parsing within JSX, but I'm not using…
this is my first question in this forum. I hope I can describe my problem correctly. I have a state hook called persons: const [persons, setPersons] = useState([]) My goal is to re-render the "persons" array after making a PUT…