전체 글25 [React / 라이프 사이클] 생명주기 리액트를 다루는 기술을 보면서 학습하던 중 중요한 부분들은 블로그에 정리 중에 있습니다. 아직 정리가 덜 끝나 간단한 부분 몇개만 공개를 하고 추후(언제 될지는 몰라요...) 포스팅 하도록 하겠습니다. 오늘은 어플리케이션 개발에 많은 혼란을 가져오는 부분 중 하나인 라이프 사이클에 대한 정리 부분을 공개합니다. 라이프 사이클 모든 리액트 컴포넌트에느 라이프사이클이 존재. 컴포넌트의 수명은 페이지에 렌더링되기 전인 '준비 과정'에서 시작하여 페이지에서 사라질 때 '끝'남. 메서드 Will 접두사 - 어떤 작업을 작동하기 전에 실행되는 메서드 Did 접두사 - 어떤 작업을 작동한 후 실행되는 메서드 컴포넌트의 라이프 사이클 1. 마운트 - 페이지에 컴포넌트가 나타남 마운트 과정에.. 2020. 7. 15. [React / What is react.js??] 리액트 리액트 컨셉 불변성 복잡한 특징들을 구현하기 쉽게 만든다. 직접적인 데이터 변이는 이전 이력을 유지 및 재사용할 수 없다. 변화감지 직접적인 변이는 변경을 감지하는 것이 어렵다. 참조하고 있는 불변 객체가 이전 객체와 다르면 객체는 변한것이라 판단한다. 재(再)렌더링 불변성과 변화감지를 이용하여 순수 컴포넌트를 만들고 이를 이용하여 데이터가 변화할 때 즉각적으로 재렌더링을 실행한다. render 함수 render() { /\* pass /\* }; render 함수는 컴포넌트(레이아웃, 기능 등)를 정의한다. 해당 함수는 html 형식의 문자열이 아닌 뷰의 shape과 behave를 정의한 객체를 반환한다. 최상위 컴포넌트의 렌더링이 끝나면 해당 객체들을 이용하여 DOM 안에 mount한다. (1. 문자.. 2020. 7. 14. 나는 2019년도를 어떻게 보냈나 사무실 밖으로 보이는 나무들이 너무 추워보입니다. 녹색으로 푸르게 꽉차서 가지 조차도 보이지 않던 유리창이 이제는 휑해져 도로위의 자동차 불빛이 보일 정도로 겨울은 빠르게 다가왔고 벌써 겨울임을 알리고 있습니다. 매년 1월이면 희망에 가득 차서 신년에 할일과 목표를 설정하지만 정작 한해의 마무리는 술, 모임으로만 가득 차있어서 그런지 취기 어린 기억들만 남는 것 같습니다. 올 한해를 살짝 뒤돌아보면 2018년 보다 더 바쁜 한해였습니다. 개인적으로는 이사와 외부활동, 그 외의 일들을 조금 더 늘린 한해였습니다. 오늘은 한해를 마무리하며 개인적인 삶, 회사에서의 삶, 그리고 앞으로 다가올 한해를 또 어떻게 보낼지 계획해 보는 시간을 가지려 합니다. 고양이를 키우는 독거노인의 삶 폭등하는 집값에 원하는 구조.. 2019. 12. 24. [리액트를 다루는 기술] (개정판) :후기 리액트를 배워 보자!!! 프론트엔드 개발자로서의 삶을 살아가면서 아직도 접해보지 않았던 이름이 있었습니다. 10에 4명 이상은 리액트로 프로젝트를 진행하는 요즘에도 조직과 개인적 이유로 리액트 스터디를 미뤄오다 우연치 않은 기회에 [리액트를 다루는 기술]을 획득(?!)하여 간단한 후기를 남기게 되었습니다. * 현재까지의 스터디 분량으로 리뷰를 진행하며 책의 전체 리뷰는 완독 후 해당 포스트에 업데이트 할 예정입니다. 저는 마크업과 UI를 개발하다 AngularJS를 접하며 프론트엔드 개발자로 성장 하였습니다. 처음 접하게 된 프레임워크와 프론트엔드 개발이 이유가 된건지 AngularJS (지금은 사용하지 않습니다... 다 까먹었어요...) / Angular에 대한 애착이 있었고 토이 프로젝트 혹은 프로토.. 2019. 11. 18. [Vue.js + PWA + Prerender] PWA와 Prerender 적용 웹 앱 개발 프로그레시브 웹 앱은 이미 수년전부터 큰 화두였습니다. 오늘은 PWA를 적용하며 느끼고 고민했던 것들 + 약간의 팁(...이라고 말하기 민망한 주의사항)을 공유하고자 합니다. * 글에 앞서 해당 내용은 주관적인 생각이 20,000% 포함되어 있으며 이 글의 내용이 개발 가이드는 절대 아님을 밝힙니다. 수정 보완해야 할 내용이 있다면 댓글에 공유 부탁드립니다. (_ _) * 이어서 간단한 소개를 할 것이지만, 혹시나 PWA를 처음 들어보신다면, 아래의 링크들을 참고 해보세요. 많은 도움이 되실 것 같습니다. - 웹 펀더멘털 여러분의 첫 Progressive Web App | Web Fundamentals | Google Developers Pete is a Developer Advocate 소개 웹 앱, .. 2019. 10. 24. [TDD] 테스트 주도 개발 도입기 (Vue.js) Test-Driven Development "테스트 주도 개발(Test-driven development TDD)은 매우 짧은 개발 사이클을 반복하는 소프트웨어 개발 프로세스 중 하나이다. 개발자는 먼저 요구사항을 검증하는 자동화된 테스트 케이스를 작성한다. 그런 후에, 그 테스트 케이스를 통과하기 위한 최소한의 코드를 생성한다. 마지막으로 작성한 코드를 표준에 맞도록 리팩토링한다. 이 기법을 개발했거나 '재발견' 한 것으로 인정되는 Kent Beck은 2003년에 TDD가 단순한 설계를 장려하고 자신감을 불어넣어준다고 말하였다." - 위키피디아 테스트 주도 개발 (=TDD)은 테스트 코드를 먼저 작성하고, 작성된 테스트 케이스들을 이용하여 반복적으로 테스트하며 개발하는 것을 말합니다. 처음 TDD를 도.. 2019. 7. 16. 이전 1 2 3 4 5 다음
