반응형
목록
분류 전체보기 (292)
[꼼꼼한 개발자] 꼼코더
🙋🏻♂️ 문제 ✅ 정답 💡 느낀 점 리액트와 Next.JS를 사용하는 것이 SEO와 연관이 있어 보여 좀 더 찾아봐야겠다.
🙋🏻♂️ 문제 ✅ 정답 💡 느낀 점 리액트가 정말 똑똑하다 싶다..
🧹 두서없이 적는 쉬운 정리 1. State는 리액트 컴포넌트의 변경 가능한 데이터. 2. Class 컴포넌트의 생성자에서는 추후 사용할 데이터를 state에 넣어서 초기화한다. 3. state를 업데이트하기 위해 setState() 함수를 사용. 4. 클래스 컴포넌트에서 컴포넌트의 생명, 인생, 죽음을 의미하는 함수를 사용할 수 있다. (componentDidMount(), componentDidUpdate(), componentWillUnmount() 5. map() 함수를 사용시 엘리먼트를 구분하기 위하여 key 값을 필수적 넣어야 한다. (자세한 내용은 아래 참고) 😊 실습 시작 클래스 컴포넌트로 스테이트 와 생명주기 함수를 직접 사용해 보도록 하자 🧑🏻💻 Notification 컴포넌트 생성 ..
🙋🏻♂️ 문제 ✅ 정답 💡 느낀 점 이제 안키 카드가 많아져서 약간 의무감으로 하는 느낌이 드는데.. 이게 맞는지 잘 모르겠지만 매일 등록하는 습관을 계속 가져보도록 해보겠다.
🧹 두서없이 적는 쉬운 정리 1. State는 리액트 컴포넌트의 변경 가능한 데이터. 2. Class 컴포넌트의 경우 생성자 함수를 가지고 있고 State를 생성자에서 정의한다. 3. 리액트 컴포넌트는 생명주기를 갖고 있다.(출생 - 인생 - 사망) 4. 컴포넌트는 계속 존재하는 것이 아닌 시간의 흐름에 따라 생성되고 업데이트 후 사라진다. (자세한 내용은 아래 참고) 👀 시작 이 글은 지금은 자주 사용하지 않는 클래스 컴포넌트와 관련된 내용이지만 중요한 개념들이 있으니 정리해 보자. 스테이트라는 개념은 함수 컴포넌트에서도 사용하기에 개념을 확실히 이해하고 넘어가는 것이 좋다! 🫨 State란? State는 리액트 컴포넌트의 상태를 의미한다. 리액트 컴포넌트의 변경 가능한 데이터를 State라고 부른다...
🙋🏻♂️ 문제 ✅ 정답 💡 느낀 점 이해가 되니 재밌다 기억력만 많이 받쳐줬으면 한다.
🧹 두서없이 적는 쉬운 정리 1. 컴포넌트 안에 여러개의 컴포넌트를 사용할 수 있다. 2. 컴포넌트 속 css적용이 가능하다. 3. 컴포넌트를 동적으로 변경려면 props 추가 4. 여러 중복 데이터는 배열로 관리하고 .map()함수로 추출. (자세한 내용은 아래 참고) 🕵🏻 댓글 컴포넌트 실습 1. Comment라는(댓글) 이름의 리액트 함수 컴포넌트 생성 2. 여러 개 댓글(Comment) 컴포넌트를 포함하고 있는 댓글 목록(CommentList) 컴포넌트 작성 3. 리스트 컴포넌트를 실제로 화면에 렌더링 하기 위해 index.js 수정. 4. 리액트 애플리케이션 실행 🎨 댓글 모양 CSS 스타일 적용 5. 댓글 모양 처럼 보이도록 Comment 컴포넌트에 css 스타일을 작성 후 컴포넌트 코드 변경..