I have two files for my component: app/components/SomeButton.ts app/components/SomeButton.tsx The .ts contains most of the logic/code and the .tsx extends the .ts and contains just the render function. When I want to import the .tsx in some other file (e.g.…
I am in school working on a project where I have and API I am pulling from and have tabs UI Pattern I have my API data fetching and working and my Tab page setup and also rendering dummy data…
I've never worked with local storage in combination with React. My goal is simple: When users complete a test, localstorage should store a value saying they've completed the test. If the completedTest State is true, show a ShowResultsComponent. Showhow I…
I'm trying to map through a list that is stored in the state and pass each item in the list as a prop to another component. Here is what it looks like. The video component is supposed to receive each…
I'm currently working on a React project and trying to implement a proper login page. Therefore I created my LoginPage.tsx and another page, that should only be accessible if logged in. I tried the following code <BrowserRouter> <Routes> <Route path="/"…
I am trying to display info from an API using axios and the hook useParams, it seems a straight foward exercise but it's not working. the API is working, here is the code: // eslint-plugin-react-hooks import React, { useEffect, useState…
I'm using functional components. <Column customFunc={myFunc} /> How should myFunc be defined? function myFunc(e) { // code } or const myFunc = (e) => { // code } Only when defining it using function keyword aka function declaration, I get…
I was looking at the code of the new React beta documentation website and I saw this code const ContainerWrapper = ({children}) => ( <div css={{ <---------------------------------------------------- backgroundColor: 'hsl(222, 14%, 10%)', }}> {children} </div> ); I'm curious about how they're…
I'm doing a MERN stack (MongoDB, Express, React, Node) project in which I need to make a HTTP request, in a React component, to the database to get a field of a model. I'm using Axios (could use any other…
import { GetServerSideProps, NextPage } from 'next'; import Image from 'next/image'; import React from 'react'; import photo from '../../assets/photo.jpg'; type Products = { data?: { id: number; title: string; body: string; }[]; }; const defaultProducts: Products = { data: [],…