분류 전체보기 (170) 썸네일형 리스트형 리액트 클론 프로젝트KPT(03) 리액트 입문이 끝나고 프로젝트를 했다. 초기에 리액트로 카운터 하나 못 만들어서 어찌할 빠 모르던 내가 커뮤니티 사이트를 만들어보았다. 사실 처음 해보는 거라 막막하고 어려웠지만 전보다 성장하는 기분이 들어서 좀 뿌듯한 생각도 든다. 아쉬운 점은 프로젝트기간내에 기능을 완벽히 구현하지 못했던 점이다. 하루..? 하루만 더 있었으면 할 수 있었을텐데라는 생각이 들었다. 그래서 프로젝트 기간이 왜이렇게 짧아라는 생각보다 내가 쫌 더 실력이 좋았다면 다했을까 라는 생각이 많이 들었던 프로젝트다. 그래도 정말 최선을 다했기떄문에 후련한 마음이 더 든다. 마지막으로 구현을 하지못한 부분은 차차 공부하면서 만들어 볼까 한다. 1.Keep 코드컨벤션을 통해 서로 충돌나지 않도록 구현한 점 팀원들과 포기하지 않고 끈기.. parameter_TIL(42) 1.내가 만난 문제 map을 돌려서 받은 list들을 item.id와 내가 선택한 그 하나의 값 id을 비교하다가 갑자기 막혔다. 모든 list들이 다 id와 일치한다고 나왔다. 코드로 보자면 4번줄에 해당한다. const modalHandle = (id, password) => { selectedComments?.map((item) => { console.log(item); return id === item.id ? setModalOpen(true) : console.log("안 켜짐"); }); document.body.style.overflow = "hidden"; // 모달창 오픈 시 배경 스크롤 비활성화 }; 2.시도 1) 먼저 console.log()로 모든 props들의 값들을 찍어봤다. 근.. TIL(41) 1.만난 문제 (오류도 아니였음 진짜 문제였음)😿 db.json연결을 다하고 post로 내 글을 보내는것까지 성공을 했다. 근데 콘솔에 찍어보니까 이상했다. state변경될때마다 post가 되고 있는거였다. 그러다 보니까 데이터 입력할때동안 계속해서 post가 되 어서 이런식의 문제가 생겼다. 아무래도 내가 useSelect에서 article이라는 이름으로 state를 들고왔는데 얘가 실시간으로 변경될때마다 리렌더링이 되므로 json-server에도 똑같이 리렌더링이 될때마다 글이 올라가는 것 같다라는 생각이 들었다. 2.시도🔥 그럼 이미 변경되고 있는 state가 아니라 setState를 통해서 변경이 되어진 state를 보내자! 그럼 일단 안에 있는 버튼이 눌리면 onsubmit이 실행되고 있었는데 .. 타이틀을 누르면 상세페이지.... 말그대로 타이틀을 누르면 상세페이지로 간다. 상세페이지를 들어가면 타이틀이 제목으로 있고 그에 해당하는 내용이 들어가있어야한다. 이렇게 간단한거 왜 안될까...지금 3시간째 붙잡고 있는데 안된다...이 새벽에... 분명 내가 놓치고 있는게 있다.... 일단 글을 작성하면 글목록에 올라오게까지하는것은 성공🍀했다. 1.그럼 무엇이 문제인가? 글목록에 올라온 글을 누르면 상세페이지로 넘어가는데 상세페이지에 글의 타이틀을 못가지고 온다.😱🔥 2.시도🏁 먼저 route에 그 글목록의 주소를 글의 고유 id로 주고 이 id와 내가 누른 글의 id가 일치하면 그 글의 title,content를 들고와라를 시도했다.그래서 삼항 연산자로 store에 넣어놓은 state를 불러서 const {id}=useParams() .. 깃헙으로 작업을 시작할땐 TIL(40) 24일 크리스마스 이브이지만 프로젝트를 위해 휴일도 반납하고 코드를 치고 있는 팀원분들과 나... 좋은건가...?ㅋㅋㅋㅋ 암튼 담주 월요일 까지를 다 완성으로 목표를 잡아놔서 오늘 중간 점검 겸 한번 각자 작업을 합쳐보기로 했다. 말안해도 비디오.. 충돌이 많이 났다. 1. 내가 만난 문제..? 충돌..?☄️ 너무 기본 파일에서 부터 각자 브랜치를 만들었다. 이게 헤더라던가 푸터,라우터,폴더는 공통으로 들어가니까 이걸 만들어놓고 여기서 브랜치를 만들어서 각자 작업을 시작했어야 됬다. 근데 그러기엔 너무 늦었다. 각자 또 공통적인 부분을 만들면서 여기서 충돌이 날 확률이 뻔했다. 2.어떤 시도❓ 뒤늦게라도 알았으니까 dev브랜치를 새로 만들어서 거기서 한명씩 합쳤다. 내가 깃 담당을 하게 되어서 내가 만든.. 글 작성페이지 input 나누기 TIL(39) 리액트로 시작하는 첫 번쨰 프로젝트가 시작했다. 글 작성페이지를 맡게되었는데 페이지에 모든 곳이 다 input이다. type만 다른...ㅎ todo를 했을때처럼 하다보니 가만있어보자.. input 컴포넌트를 하나 만들어놓고 이것을 재사용 하면 좋겠다라는 생각이 들었다. 그럼 행동으로 옮겨야지🥸 1.내가 만난 문제 👍나의 지금 구조 Input을 들어가면 거기서 또 세부적인 제목,작성자,비밀번호 이 3가지의 input이 필요하다. 그래서 그안에서 또 로 나눌려고 보니까 그럼 또 그 안에 input이라는 가장 하위 컴포넌트들을 불러와야하는 구조였다. 또 난 Input컴포넌트 작성을 위해 페이지를 하나 더 만들어야하고,팀프로젝트다 보니 오히려 많은 파일들을 팀원들이 보기 힘들꺼같다라는 판단을 내렸다. 또 비효율.. 좋은 TIL은 뭘까?(38) 이력서에 쓴 걸 설명하지 못한다면 안쓰는것만 못한다.내가 안다는 것을 증명해야한다. 이 증명을 TIL로 정리하면서 기록하자. 프로젝트 코드 달랑 보여주면 끝이다? =(NOPE !)=>{ 성장,성실함 또 내가 까먹질 않았는지를 보여줘야한다.} 잘 쓴 TIL => 많은 TIL은 성실함을 보여줄 수 있다. 예전보다 많이 성장했구나를 알 수 있다. TIL를 안쓰면 내가 어떤 시행착오를 거쳤고 어떤 코드를 가져와서 공부를 했는지를 알 수 없다. 미래에 또 같은 오류를 만난다면 똑같이 시행착오를 거칠 수 밖에 없다. 그러니까 나의 공부의 종착점은 TIL이라고 생각하자. 나의 TIL이 잘 쓰고 있는건가? 내가 설명이 가능하면 제대로 쓰고 있는 거다. 이력서에는 여러분의 성장이 담긴다 -면접질문은 이력서에서 나온다. .. React-router_TIL(37) 리액트라우터에서 멈춘지 어언 하루이틀... 어렵다 어려워 ㅠ 그래서 오늘 간단히 액기스만 정리를 하면서 머릿속에 우겨넣어볼까한다. 화이팅👍 1.useNavigate() 원래는 Link라는 훅을 이용해서 상세페이나 마이페이지를 들어갈 수 있지만 Link훅은 html의 a태그의 역할로 브라우저에서보면 사실 안예쁘고 내가 따로 디자인을 손을 봐야한다. 그래서 쓰는 훅이 useNavigate()이다. 이 훅은 내가 미리 만들어놓은 html태그에 onClick={()=>{useNavigate("/mypage")}}으로 가뿐히 설정가능하다. 2.Outlet 이 있다. 근데 이 mypage에는 article , accout 페이지가 있다면? 그때마다 를 써줘도 되지만 그럴 필요없이 이렇게 줄 수 있다. :id의 뜻은.. 이전 1 ··· 10 11 12 13 14 15 16 ··· 22 다음