안녕하세요 강의 너무 잘보고있어요!! 근데 궁금점이 생겼네요강의에서는 AccessToken이 만료되거나 변조되었다면 에러메세지를 전달하고있는데 만약에 변조된 AccessToken을 캐치하고 에러를 프론트로 전달한다면 통상적인 프로세스로는 Refresh토큰을 가지고 Access를 재 발급하지 않나요 ? 그렇다면 만일 공격자가 새로 발급된 AccessToken을 탈취할 수 있는 거 아닌가 라는 생각이 들어서요.. 그렇다면 통상적으로 변조된 AccessToken을 캐치한다면 이를 클라로 에러코드와 같이 전달하고 아예 refresh와 access를 초기화 시키고 재 로그인을 요구하는 것이 옳은 프로세스일지요?

const getMonthlyData = (pivotDate, data) => { //컴포넌트 밖에서 함수를 만드는 이유? const beginTime = new Date( pivotDate.getFullYear(), pivotDate.getMonth(), 1, 0, 0, 0 ).getTime(); const endTime = new Date( pivotDate.getFullYear(), pivotDate.getMonth() + 1, 0, 0, 0, 0 ).getTime(); return data.filter( (item) => beginTime <= item.createdDate && item.createdDate <= endTime ); };endtime을 0일 23시 59분 59초가 아닌 0일 0시 0분 0초로 설정해도 될까요? 월에서 +1을 했으니 마지막 일도 포함될 거 같아서요!

15:04에 .Editor .emotion_section .emotion_list_wrapper에서 justify-content: space-around;해도 아래 사진과 같이 요소를 화면 중심으로 배치할 수 없어서요. 어떻게 해야하는 건지 답변 부탁드립니다. 

import Header from '../components/Header'; import Button from '../components/Button'; import Editor from '../components/Editor'; import { useNavigate } from 'react-router-dom'; import { useContext } from 'react'; import { DiaryDispatchContext } from '../App'; const New = () => { const nav = useNavigate(); const { onCreate } = useContext(DiaryDispatchContext); const onSubmit = (input) => { onCreate(input.createdDate.getTime(), input.emotionId, input.content); nav('/', { replace: true }); }; return ( <div> <Header title={'새 일기 쓰기'} leftChild={ <Button text={'< 뒤로 가기'} onClick={() => { nav(-1); }} /> } /> <Editor onSubmit={onSubmit} /> </div> ); }; export default New; 여기서 nav('/', {replace:true});로 뒤로가기(New 페이지로 가는 것)를 방지했는데,뒤로가기를 한 번 눌렀을 때는 잘 동작하는데두 번 눌렀을 때부터 뒤로 가집니다.  혹시 원래 이런건가요? 아니면 제가 뭔가 잘못한건가요?   

원래는 그렇지 않았는데 전부터 graphql 에서 api 테스트 해보려고 하면 아래에 항상 이런방식으로 글자 나타나고 사라지지 않더라고요.. 맥을 사용하고 있는데 이거 어떤 방식으로 해결할 수 있나요?

영상에 제시한 코드를 사용하면 아래와같은 오류가뜹니다 React 18에서는 ReactDOM.render를 지원하지 않는다고 하네요.. 아래 코드로 수정하니 잘 됩니다 참고 하세요~   

안녕하세요 강사님, 강의 잘 듣고 있어요!!다름이 아니라,강사님 화면에서는 return 뒤에 작성하시고 소괄호가 자동으로 생성되면서 작성한 내용을 감싸주던데, 어떻게 하는건가요?ESLint, Prettier등 설치는 했어요 ㅠ.ㅠ 🚨 아래의 가이드라인을 꼭 읽고 질문을 올려주시기 바랍니다 🚨질문 하시기 전에 꼭 확인해주세요- 질문 전 구글에 먼저 검색해보세요 (답변을 기다리는 시간을 아낄 수 있습니다)- 코드에 오타가 없는지 면밀히 체크해보세요 (Date와 Data를 많이 헷갈리십니다)- 이전에 올린 질문에 달린 답변들에 꼭 반응해주세요 (질문에 대한 답변만 받으시고 쌩 가시면 속상해요 😢)질문 하실때 꼭 확인하세요- 제목만 보고도 무슨 문제가 있는지 대충 알 수 있도록 자세한 제목을 정해주세요 (단순 단어 X)- 질문의 배경정보를 제공해주세요 (이 문제가 언제 어떻게 발생했고 어디까지 시도해보셨는지)- 문제를 재현하도록 코드샌드박스나 깃허브 링크로 전달해주세요 (프로젝트 코드에서 문제가 발생할 경우)- 답변이 달렸다면 꼭 확인하고 반응을 남겨주세요- 강의의 몇 분 몇 초 관련 질문인지 알려주세요!- 서로 예의를 지키며 존중하는 문화를 만들어가요. - 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.

안녕하세요. 지금 typeORM에서 cascade를 보고있는데fk를 삭제하면 pk가 삭제하는게 일반적인 동작인지가 궁금합니다. User 엔티티에서 onDelete : "cascade"로 설정해두었고삭제는 부모에서 > 자식으로 연결되는 것으로 알고 있습니다. 근데 ProfileModel의 레코드가 삭제되도 Join한 레코드도 삭제되는데자식 > 부모로 삭제가 전파되는게 맞는건지 혼란이옵니다.강의에서도 profile을삭제하니 User레코드가 날아가버리는데 이 현상이 이해 되질않습니다. 부모>자식 cascade를 인한 연쇄 삭제 or update자삭>부모 cascade를 인한 삭제 불가 이게 기존 제 개념인데 제가 잘못알고있던건가 찾아보아도 정보가 좀 엉켜있네요.. typeORM만의 기능인지 SET NULL로 방지해야 하는건지 궁금합니다.

 bmi 계산기 부분에서 display함수 안에 let group; 이렇게 변수 선언만 해주는 이유가 뭔가요? 조금 쉽게 설명부탁드리겠습니다.

콘솔버튼이 아예 안보이네요..

🚨 아래의 가이드라인을 꼭 읽고 질문을 올려주시기 바랍니다 🚨질문 하시기 전에 꼭 확인해주세요- 질문 전 구글에 먼저 검색해보세요 (답변을 기다리는 시간을 아낄 수 있습니다)- 코드에 오타가 없는지 면밀히 체크해보세요 (Date와 Data를 많이 헷갈리십니다)- 이전에 올린 질문에 달린 답변들에 꼭 반응해주세요 (질문에 대한 답변만 받으시고 쌩 가시면 속상해요 😢)질문 하실때 꼭 확인하세요- 제목만 보고도 무슨 문제가 있는지 대충 알 수 있도록 자세한 제목을 정해주세요 (단순 단어 X)- 질문의 배경정보를 제공해주세요 (이 문제가 언제 어떻게 발생했고 어디까지 시도해보셨는지)- 문제를 재현하도록 코드샌드박스나 깃허브 링크로 전달해주세요 (프로젝트 코드에서 문제가 발생할 경우)- 답변이 달렸다면 꼭 확인하고 반응을 남겨주세요- 강의의 몇 분 몇 초 관련 질문인지 알려주세요!- 서로 예의를 지키며 존중하는 문화를 만들어가요. - 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.

import { useState } from 'react' import Viewer from './components/Viewer' import Controller from './components/Controller' import { useEffect } from 'react' import { useRef } from 'react' import Even from './components/Even' import './App.css' function App() { const [count, setCount] = useState(0); const [input, setInput] = useState(""); const isMount = useRef(false); //1. 마운트 : 탄생 useEffect(()=>{ console.log("mount") },[]) //2. 업데이터 : 변화, 리렌더링 useEffect(()=>{ if(!isMount.current){ isMount.current = true; return; } console.log("update") }) //3. 언마운트 : 죽음 //useEffect(()=>{console.log(count)},[count, input]) // 의존성 배열, dependency array, deps const onClickButton = (value)=>{ setCount(count + value); } return ( <div className='App'> <h1>Simple Counter</h1> <section> <input value={input} onChange={(e)=>{ setInput(e.target.value) }}/> </section> <section> <Viewer count={count}/> {count % 2 === 0 ? <Even/> : null} </section> <section> <Controller onClickButton = {onClickButton}/> </section> </div> ); } export default App import { useEffect } from "react"; const Even = () => { useEffect(() => { //클린업, 정리함수 return () => { console.log("unmount") }; }, []); return <div>짝수입니다</div>; }; export default Even; 새로고침이나 초기 호출시에도 unmount가 출력되고 홀수로 카운팅이 올라가 컴포넌트가 삭제되는 경우는 update이후 unmount가 정상적으로 출력되는 것을 확인할 수 있는데 짝수로 카운팅이 올라가 컴포넌트가 생성되는 경우는 unmount 이후 update가 됩니다.컴포넌트가 삭제되는 경우에만 unmount가 진행되는 것으로 알고 있는데 혹시 코드에 문제가 있을까 질문드립니다. 

안녕하세요.저는 서버개발자로 일을 하고 있지만,영보님 강의를 모두 사서 듣고있는 주니어 개발자입니다.우선 좋은 강좌를 만들어주셔서 너무 감사합니다.앞으로도 좋은 강좌 많이 만들어 주시면 너무나도 감사할것같습니다.현재 돔 인터랙션이라는 강의를 듣고 있고 중반정도 달려왔는데이 강의를 들으면 듣지 않은 사람들에 비해 어떤 경쟁력을갖게 되는지 궁금합니다.영보님께서 강의를 만드신 이유와 의도가 있었을 것 같은데그 부분이 궁금합니다. 그리고 리액트 심화 강의도 혹시 출시 하실 생각이 있으신지궁금합니다.

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요다 바꿨는데도 npm start하면 빈 화면만 나와요

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.돌겠네요 진짜

 autoAlpha : 0 이css visibility : hidden, opacity 0 으로 설정해준다고 하고css에 visibility hidden 을 제거해도 깜빡이는 현상은 안일어나더라구요!css에도 visibility:hidden을 작성하는 이유가 있을까요?

const MemoizedProvider = React.memo(TodosStateContext.Provider);TodosStateContent가 컴포넌트이니까 memoizedDispatch의 useMemo말고 아예 React.memo를 사용해서 최적화 해도 되나요? 이렇게 하면 안에 있는 객체 {onCreate, onUpdate, onDelete}도 재생성 안되지 않을까요..?

강의 내용을 바탕으로 프로젝트를 하나 만들다 안되는 부분이 있어 질문드립니다.제가 axios를 이용해서 데이터를 받는 함수를 만들었는데요  const [posts, setPosts] = useState(); const getAllPosts = async () => { try{ const {data} = await axios.get("/api/posts"); console.log("axios - getAllPosts: ", data); setPosts(data); } catch(error){ console.log("getAllPosts 에러: ",error); } }getAllPosts(); 이런 코드를 작성했을때 렌더링할때 axios를 이용해서 받은 데이터를 posts란 state에 저장하고 이를 리스트 형태로 렌더링하려고 하는데 저기서 그냥 getAllPosts(); 를 해버리면 콘솔창에 무한하게 posts 값이 찍히고 화면에는 렌더링이 되지 않더라고요 ㅠ 콘솔창에는 그래도 데이터가 찍히긴 하는데 말이죠..ㅠgetAllPosts메서드는 비동기 함수니깐 컴포넌트들이 렌더링되기 전에 실행되고 컴포넌트들이 렌더링되는거 아닌가요? 그럼 저 메서드를 호출하면 잘 렌더링이 되야하는거 아닌가요??ㅠㅠ왜 저렇게 콘솔창에는 무한하게 데이터값이 찍히고 컴포넌트에는 왜 렌더링이 되지 않는건가요??

function App() {const [count, setCount] = useState(0);const [input, setInput] = useState("");const isMount = useRef(false);// 1. 마운트 : 탄생useEffect(() => {console.log("mount"); }, []);// 2. 업데이트 : 변화, 리렌더링useEffect(() => {if (!isMount.current) {isMount.current = true;return; }console.log("update"); });// 3. 언마운트 죽음const onClickButton = (value) => {setCount(count + value);// console.log(count + value); };return (... );} 위 코드를 작성하고 새로고침을 하면위 처럼 콘솔에 모든 mount, unmount, update가 뜹니다....코드상 update도 안떠야하는데 왜 뜨는걸까요?