목록전체 글 (118)
all is well!!
1. flex: 1 1 0% flex: flex-grow(flex item 확장 속성) flex-shrink(flex item 축소 속성) flex-basis(flex item 기본크기 결정 속성-기본값 auto) 확장, 축소 전부 속성이 1이기 때문에 flex comtainer의 크기에 따라서 flex item의 크기도 커지거나 작아진다는 의미. 2. transition : color 0.125s ease-in 0s css 속성을 변경할 때 애니메이션 속도를 조절하는 방법을 제공. 속성 변경을 하면 바로 즉각 바뀌는데 transition으로 속성의 변화가 일정 기간에 걸쳐 일어날수 있도록 한다. transition: 1. transition-property : 트랜지션을 적용해야 하는 css속성의 이름..
👀 1차 전체적인 목표 🟣 Main 카드 - 작성 날짜(4일전 ,6일 전…), 댓글 수, 카드 호버시 애니메이션 🟣 detail 좋아요 작성자 모든 포스트 목록 보기 댓글쓰기 🟣 write 작성글 실시간 미리보기 뒤로가기 임시저장 기능 Input 저장 기능 ⚽️ Daily Goal 컴포넌트 만들기 detailHeader ui 작업 detailUserDate ui 작업 detailTag ui 작업 asideLike ui 작업 navSubTitle ui 작업
태그를 쓰려고 했더니 경고문이 떴다. '/'로 이동하기 위해 태그 대신 next/link에서 를 사용하라는 내용이었다. ? - 경로 간의 이동을 위한 next.js에서의 라우터 기능 태그 대신 태그를 쓰는 이유? - 태그를 쓰면 react의 특징인 SPA 동작이 아닌 새로고침이 되면서 페이지 이동을 하기 때문에 불필요한 리렌더링이 발생한다. 그리고 태그로 전환되어서 SEO에도 좋다고 한다. 의 props들 - href : 경로 또는 URL (유일한 필수 props. 없으면 에러남!) - as : 브라우저 URL 표시줄에 표시될 경로에 대한 선택적 데코레이터 - passHref : href를 의 자식에게 무조건 props로 보냄. 기본은 false - prefetch : 백그라운드에서 페이지를 미리 가져옴..
👀 1차 전체적인 목표 🟣 Main 카드 - 작성 날짜(4일전 ,6일 전…), 댓글 수, 카드 호버시 애니메이션 🟣 detail 좋아요 작성자 모든 포스트 목록 보기 댓글쓰기 🟣 write 작성글 실시간 미리보기 뒤로가기 임시저장 기능 Input 저장 기능 ⚽️ Daily Goal 1. degail page header 작업 - 로고부분 재사용가능 컴포넌트로 작업 2. 재사용 컴포넌트 파일 정리 고민 3. readme 작업일정 작성
👀 1차 전체적인 목표 🟣 Main 카드 - 작성 날짜(4일전 ,6일 전…), 댓글 수, 카드 호버시 애니메이션 🟣 detail 좋아요 작성자 모든 포스트 목록 보기 댓글쓰기 🟣 write 작성글 실시간 미리보기 뒤로가기 임시저장 기능 Input 저장 기능 ⚽️ Daily Goal 1. defail page router 수정 2. detail figma로 component 이름 고민해보기(시멘틱태그 참고)