본문 바로가기
728x90

전체 글121

React의 생명 주기(라이프 사이클) 리액트는 컴포넌트 기반의 View를 중심으로 한 라이브러리입니다. 그러다보니 각각의 컴포넌트에는 라이프 사이클 즉, 컴포넌트의 생명 주기가 존재합니다. 컴포넌트의 생명은 보통 페이지에서 렌더링되기 전인 준비 과정에서 시작하여 페이지에서 사라질 때 끝이 납니다. 위의 이미지는 리액트의 생명 주기를 나타낸 화면입니다. 이미지에서 볼 수 있듯이 컴포넌트는 생성 => 업데이트 => 제거의 생명 주기를 갖고 있습니다. 그럼 이제 각각의 라이프 사이클이 무엇이고 어떻게 Class와 Hooks를 활용한 함수형 컴포넌트에서 사용하는지 알아보도록 하겠습니다. 아래 목록에서 자주 사용되는 메서드는 색으로 표시하겠습니다. 나머지는 상대적으로 덜 사용됩니다. 마운트(생성) 컴포넌트의 인스턴스가 생성되어, DOM에 삽입될 때 .. 2022. 6. 20.
CORS에 대처하는 방법과 우회하는 방법 CORS에 대처하는 방법과 우회하는 방법 외부 서버로 ajax 요청이 안될 경우 아래와 같은 단계로 처리를 생각해 볼 수 있습니다. 개발자가 테스트 혹은 개발단계에서 쉽게 요청하기: 웹 브라우저 실행 옵션이나 플러그인을 통한 동일 출처 정책 회피 CORS구현이 안되어 있는 서버로 ajax요청을 해야하지만 서버 쪽 컨트롤이 불가능할 경우: jsonp방식으로 요청 Ajax요청을 해야 하는 다른 도메인의 서버를 클라이언트와 같이 개발하거나 서버 개발 쪽 수정 요청이 가능한 경우: 서버에서 CORS 요청이 허용되도록 구현 HTML 삽입 미리보기할 수 없는 소스 🛠 용어 공부 ⚙️ CORS CORS(Cross-Origin Resource Sharing)란? 웹 브라우저에서 외부 도메인 서버와 통신하기 위한 방식을.. 2022. 6. 17.
깨끗한 코드(Clean Code)를 위한 5가지 방법 코드스테이츠 교육과정을 수강하며 팀 프로젝트를 진행할 때에는 제한된 시간에 맞춰 기능을 구현하느라 제대로 신경 못 썼던 것이 있습니다. 상대방도 읽기 편한 깔끔한 코드를 작성하지 않았던 것인데요. 나름 코드 규칙을 세워가며 프로젝트를 진행하긴 했지만 각자의 코딩스타일이 너무나도 다른 것 때문에 나중에 리팩토링할 때에 조금 더 힘들었던 경험이 있습니다. 제 코드를 읽는 팀원들도 많이 애먹었을 것을 생각하며.. 요즘에는 최대한 남이 읽기 편한 코드를 작성하기 위해 노력 중입니다. 항상 머릿 속에 생각하고 실행하려 하고 있지만 언제든 잊어버릴 수 있기에 유튜브에서 봤던 클린 코드에 관련된 좋은 영상들의 내용을 정리하여 기록해보려 합니다. 좋은 코드란 무엇인가? 좋은 코드란 것은 일단 돌아가기만 하면 되는 코드.. 2022. 6. 16.