[꼼꼼한 개발자] 꼼코더

🙋🏻‍♂️ 문제✅ 정답💡 느낀 점이제 안키 카드가 많아져서 약간 의무감으로 하는 느낌이 드는데.. 이게 맞는지 잘 모르겠지만 매일 등록하는 습관을 계속 가져보도록 해보겠다.

🧹 두서없이 적는 쉬운 정리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 스타일을 작성 후 컴포넌트 코드 변경..

🧹 간단 정리 의존성 주입 방법을 선택할 땐 중 생성자 주입을 사용하자 생성자 주입은 코드의 유지 보수성과 테스트 용이성을 향상한다. (자세한 내용은 아래 👀) 🧑🏻‍💻 코드 예제 👉🏻 Setter 방식(생성자 주입 적용 전) public class UserService { private UserRepository userRepository; public void setUserRepository(UserRepository userRepository) { this.userRepository = userRepository; } } 👉🏻 생성자 주입 적용 public class UserService { private final UserRepository userRepository; public UserServ..

🙋🏻‍♂️ 문제 ✅ 정답 💡 느낀 점 뭔가 좀 중요한 내용이라 나중에 블로그 정리글로 한 번 더 작성하고 싶다 예시도 보다보면 알겠지만 스프링이 진짜 개발자의 개발작업 향상에 많은 도움을 주는 거 같다.

🧹 두서없이 적는 쉬운 정리 1. 함수 컴포넌트는 정말 함수처럼 생겼다. 2. 리액트 컴포넌트는 클래스 컴포넌트와 함수 컴포넌트로 나뉜다. 3. 모든 클래스 컴포넌트는 React.Component를 상속받아서 만든다. 4. 컴포넌트 생성 시 첫 글자는 대문자여야 한다.(소문자는 HTML 태그로 인식됨) 5. 이렇게 만들어진 컴포넌트는 엘리먼트를 출력하고 렌더링을 통해 브라우저에 보이게 된다. (자세한 내용은 아래 참고) 🎅🏻 Components의 역사 리액트 컴포넌트는 아래 그림처럼 크게 클래스 컴포넌트와 함수 컴포넌트로 나뉜다. 초기 버전에는 클래스 컴퍼넌트를 주로 사용하였다. 하지만 클래스 컴포넌트가 사용하기 불편하다는 의견이 많이 나와 함수 컴포넌트를 주로 사용하게 되었다. 함수 컴포넌트를 개선하는..

🙋🏻‍♂️ 문제 ✅ 정답 💡 느낀 점 이제부터 하나씩 알아봐야겠다.