20강에서 Router 예제 복붙 시 오류안나는 최종본입니다 !! import React from "react"; import { Route, Routes, BrowserRouter } from "react-router-dom"; import LandingPage from "./components/views/LandingPage/LandingPage"; import LoginPage from "./components/views/LoginPage/LoginPage"; import RegisterPage from "./components/views/RegisterPage/RegisterPage"; function App() { return ( <BrowserRouter> <div> {/* A <Switch> looks through its children <Route>s and renders the first one that matches the current URL. */} <Routes> <Route exact path="/" element={LandingPage()}/> <Route exact path="/login" element={LoginPage()}/> <Route exact path="/register" element={RegisterPage()}/> </Routes> </div> </BrowserRouter> ); } export default App;
강의 내용 중 useMemo 부분의 실습이 없어서 질문드립니다. Component.js로 컴포넌트를 작성하고 App.js에서 컴포넌트를 호출해봤는데요. App.js .. <div>{<Component a={1} b={5} />}</div> ... Component.js ... useMemo(() => compute(a,b),[a,b]); ... 이렇게 작성했을 때 useMemo가 제대로 작동하고 있는지 확인하고 싶은데요. useEffect는 console.log로 확인이 됐는데 useMemo는 어떻게 확인을 할 수 있을까요? (useEffect랑 useMemo는 방식이 달라서 useEffect에 로그를 찍어봤자 useMemo를 확인할 수 없었어요...)
자바스크립트 함수 인강에서 return문 개념이 너무 헷갈려서요. function getArea(width*height){ let area = width* height; return area; } let area1 = getArea(100,200); return을 쓰면 위와 같이 항상 새로운 변수를 지정해서 getArea함수를 호출해야하나요? 왜 return을 사용하는지 잘 모르겠어요..
안녕하세요~ 강의 듣던 중 궁금증이 생겨 질문 남깁니다 useReducer로 CREATE 상태 로직을 분리할 때, 기존과 다르게 newItem을 reducer에서 생성하는 이유가 무엇인가요? 아래처럼 기존과 동일한 방식으로 newItem을 onCreate 내에서 생성했을 경우에도 정상 동작하는 것 같은데 혹시 동작이나 성능면에서 차이점이 있나요? +) 계속 생각할수록 로직을 분리할 때 어디서부터 어디까지 분리해야할지 기준을 잘 모르겠어요,,ㅠ 강의에서 CREATE로직 분리 시 newItem을 reducer에서 생성한 것 처럼, INIT로직 분리 시에도 initData를 reducer에서 생성 할 수 있을 것 같은데(아래 코드).. 분리하는 로직의 기준점? 같은걸 어떻게 잡아야할지 잘 모르겠습니다ㅜㅜ 혹시 어떤 기준으로 분리해야할지 규칙이나 팁같은게 있을까요?
안녕하세요 강사님! 최적화3 - useCallback 강의 듣던 중 의문점이 생겨 질문 남깁니다. onCreate에 useCallback을 사용하고 의존성 배열을 빈 값으로 두면 mount시에 한번만 실행되기 때문에 data state가 초기값인 빈 배열인 상태이다 <= 까지는 이해하였습니다. 그런데 함수형 업데이트를 이용해서 인자로 data를 전달하면 최신 data state를 반영할 수 있다는 부분이 잘 이해가 안갑니다. onCreate가 mount시에 생성되고 생성시의 data state가 계속 유지된다면 인자로 전달되는 data state또한 초기값인 빈 배열이 들어가게되어 결국 setData(([]) => [ newItem, [] ]) 처럼 동작해야 하는것이 아닌가요? 어떻게 인자로 전달되는 data에는 최신 상태가 반영되는건가요??
TypeError: user.comparePassword is not a function >>비주얼에서는 이런식으로 자꾸 오류가 뜨고, 포스트맨에서는 Could not get response Error: read ECONNRESET 이렇게 뜹니다,,!!! post는 http://localhost:5000/api/users/login 이던 http://localhost:5000/login이던 다 안돼요,,, 답변 부탁드립니다ㅠㅠㅠㅠㅠㅠ
안녕하세요. 유익한 강의 너무 잘 듣고 있습니다. 다름이 아니라, 팩토리 패턴으로 리팩토링 한 코드에 대해 질문이 있어서 글을 적게 되었습니다. lazy를 사용하지 않고 import('') 구문 만으로는 동적으로 모듈을 임포트 할 수 없나요?? 컴포넌트가 모두 마운트 된 후 레이지 컴포넌트가 동적으로 임포트가 모두 완료된 상태인데도 suspense가 꼭 필요하나요?? 레이지 컴포넌트에 접근할 땐 이미 임포트가 완료된 후라는 생각이 들어서 여쭤봅니다!
6개월 학원 수료를 한 상태이고, 프론트엔드쪽 웹 개발자를 지망하고 있습니다. 추가적으로 공부를 하고 웹사이트를 하나 더 만들어볼 생각을 하고 있는데 css 전처리기, 프레임워크, css in js 등등 여러가지 기술이 많은데 면접에서 어필을 하려면 대부분의 것을 기본 CSS위주로 짜서 CSS기본이 탄탄한 것을 어필해야 할지, sass나 styled component, tailwind 등의 기술 중 하나를 써서 할줄 아는 스택이 있다는것을 어필해야할지, antd, 부트스트랩 등의 프레임워크를 부담없이 떡칠해서 써서라도 화면을 깔끔하게 만드는것이 중요할지 판단이 잘 안서네요. 혹시 조언을 좀 해주실 수 있으신가요?
MsgItem 을 이용하여 MsgList 50개를 뽑는 과정에서 Error: Text content does not match server-rendered HTML. Error: Hydration failed because the initial UI does not match what was rendered on the server. Error: There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering. 오류를 만났습니다. 혼자서 분석해본결과 jay와 roy를 랜덤으로 얻기위한 const getRandomUserId = () => UserIds[Math.round(Math.random())]; 이라는 함수를 이용하면 이런에러가 나는것으로 확인되었습니다 선생님 .fill(0).map() 함수에서 getRandomUserId() 를이용하지않고 직접 이름을 "roy" 로 작성하니 오류가 나오지않습니다.. 구글링을해봐도 이유를 알기 어려워서 질문을남깁니다 왜 이런오류가 나오는걸까요.?
바뀐 react 18에 따라서 작성된 코드입니다. 바뀐 리엑트로 어떻게 코드 작성해야하는지 모르겠는 분들은 참고하시면 좋을것 같습니다! https://github.com/matt700395/first-meet-react/commit/7df1b7367e6a2c00f21ae30a92e39102959e373f
따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)
커뮤니티생성 - 커뮤니티 생성핸들러 생성하기(2) 까지 강의를 들은 상황에서 첫 로그인은 network status가 200이 뜨는데 그 다음부터는 어느 페이지든 접근시 GET /api/auth/me 304 가 나옵니다. routes/auth.ts 에서 [변경전] const me = async (_: Request, res: Response) => { return res.json(res.locals.user) } [변경후] const me = async (_: Request, res: Response) => { return res.status(200).json(res.locals.user) } 바꾸었으에도 계속 그러네요.. 왜 그런지 아시나요 아래와 같은 글을 발견했지만 캐싱 이후 그냥 304를 날린다는데 이게 맞는건가요..? https://www.inflearn.com/questions/14571
