300x250 전체 글198 [React] re-rendering 되는 조건과 예시 Re-rendering 되는 조건과 성능 최적화 방법 ✅ 개념 - rendering이란? 사용자가 화면에 view를 보여 주는 것을 렌더링이라고 한다. - re-rendering이란? 사용자 화면에 view를 다시 새롭게 보여준다는 의미이다. - 컴포넌트가 re-rendering 되는 조건 1. 자신의 상태가 변경될 때(state 변경) 2. 부모 컴포넌트가 리렌더링 될 때 3. 자신이 전달받은 props가 변경될 때(props) 4. forceUpdate 함수가 실행될 때 ✅ '성능 최적화' 배워야 하는 이유 - 상위의 컴포넌트에서 변화가 일어난다면, 하위 컴포넌트에 렌더링을 명령하게 된다. - `pureComponent`를 사용하지 않고 큰 앱을 개발하게 된다면, - 사소한 변경에도 모든 컴포넌트가 .. 2021. 11. 16. [수료 + 30] 취준 기록(4): 21년 11월8일 - 11월 14일 한 주 돌아보기 ✅ 스터디 면접 스터디 2회 진행 면접 준비 ✅ 알고리즘 연습 프로그래머스 1단계 5문제 ✅ 코딩테스트 A회사 진행중 ✅ Sass 챕터 3까지 완료 🔥 총평 - 가고 싶던 회사에 면접에서 제출한 과제에 대한 코드리뷰를 진행했고, 생각보다 많은 부분에서 내가 놓치고 있는 부분을 발견했다. 많은 공부가 되었다. 나머지 두 회사에서도 코딩테스트에서 불합격했다. - 왜 떨어졌을까 생각해보면, 2번째 회사는 회사에서 충족하는 기술스택을 보유하지 못했고, 3번째 회사는 사실 잘 모르겠다. 과제형 테스트가 아니라 온라인 테스트였고 점수가 꽤 높았는데 떨어졌다. 그럴수도 있지, 하면서 넘기곤 있지만 씁쓸하다. - 그래도 코딩테스트 코드리뷰 덕분에 과제형을 어떻게 진행하면 좋은지 감이 잡힌다. 현재 하나.. 2021. 11. 15. [Error] 'Switch' is not exported from 'react-router-dom' 해결 'Switch' is not exported from 'react-router-dom' 해결 방법 ✅ 개념 - react-router-dom v6로 업데이트 되면서 변경된 부분 중에 하나가 Switch가 Routes 로 바뀌었다. ✅ 왜 배워야 할까? - npm install "react-router-dom" 을 설치하게 되면, "react-router-dom": "^6.0.2" 이 설치가 된다 - 그럴 경우, 제목과 같은 에러를 만날 수 있다. - 버전 5를 까는 방법도 있지만 앞으로 사용해야하니 제대로 알고 넘어가야한다. ✅ 기존에 있던 것과 차이점 바뀐 것이 여러가지 있지만, 바로 사용하는 4가지만 알아보겠습니다. 1. 70%나 작아진 번들 사이즈 번들 사이즈를 줄여야 하는 이유 - 성능 및 로드 .. 2021. 11. 14. [수료 + 23] 취준 기록(3): 21년 11월 1일 - 11월 7일 한 주 돌아보기 ✅ 스터디 스터디 2회 진행 주제: 함수 정리, 기술 면접 준비 후기 공유 ✅ 알고리즘 연습 프로그래머스 1단계 4문제 ✅ 코딩테스트 1번 회사 결과: 화요일 면접 예정 2번 회사 결과: 아직 발표 안남 3번 회사 결과: 점수 좋음(html, css, react 코딩 테스트) ✅ 기타 기술/ 인성 면접 준비 🔥 총평 - 이번 주엔 두 회사의 과제형 코테를 한꺼번에 진행했다. 벅찼다. 거기다 한쪽에선 redux-saga 사용을 원했던 것 같지만 아직 배우지 않은 라이브러리라 사용하지 못한 상태로 제출했다. 기능 구현과 디자인에 신경을 썼지만, 제출을 하고 나니 눈에 보이는 오류들이 조금씩 있었다. - 기쁘게도 과제를 제출한 곳에서 면접 제안을 받았다. 회사에 대해 알아볼수록 정말 괜찮은 회.. 2021. 11. 8. [수료 +16] 취준 기록(2) : 21년 10월 25일 - 10월 10월 31일 한 주 돌아보기 ✅ 스터디 스터디 2회 진행 주제: MPA vs SPA, SSR vs CSR, HTTP Method 스터디 github에 정리 ✅ 알고리즘 연습 프로그래머스 1단계 10문제 ✅ 기술 블로그 블로그 포스팅 3개 노션 3개 정리 ✅ 개인 포트폴리오 배포 완료 ✅ 코딩테스트 과제형: 2개 진행중 1번 회사: 목요일 10시제출 2번회사: 목요일 자정 제출 ✅ 기타 이력서 제출 typescript 기초, 실전 강의 2개 section 완료 헬스장 3개월 등록 + 운동 5일 (월, 화, 수, 목, 금,) sass 강의 2개 section 완료(초기세팅, svg,png,jpg 차이) 🔥 총평 - 한 주제에 깊게 파고드니 코드스테이츠에서 섹션을 진행하면서 이해하지 못했던 부분들이 이해 되기 시작했다. .. 2021. 11. 1. SASS(Syntactically Awesome StyleSheet) 개념 + Sass와 CSSS 차이 SASS(Syntactically Awesome StyleSheet) css는 연산도 안되고, 조건도 반복도 안된다. 프라퍼티만 선언하고, 선언형으로만 되었다. 결론은 SCSS와 SASS는 CSS를 편리하게 이용할 수 있도록 도와주며 추가 기능도 있는 확장판 ( CSS를 확장하는 스크립팅언어 ) 정도로 생각하면 좋을 것 같다. (css preprocessor 전처리기) 우리가 흔히 CSS 문서 작성할 때는 많은 반복적인 작업을 요구하고 Color 값을 찾는 일, tag를 닫는 일 등 번거로운 작업 역시 포함되어있다. 그뿐만 아니라 클래스의 상속과 같은 사항으로 점점 CSS 문서는 양이 많아지고 이로 인해서 이후 유지관리에 많은 영향을 준다. 이런 CSS의 문제점들을 Programmatically 한 방식.. 2021. 10. 29. SSR(서버사이드 렌더링)과 CSR(클라이언트 사이드 렌더링) MPA와 SPA, SSR과 CSR에 대한 포스트입니다. 목차 MPA vs SPA SSR 개념, 동작과정, 장단점 CSR 개념, 동작과정, 장단점 렌더링 방식 선택 기준 Universal Rendering MPA vs SPA 먼저 MPA, multi page application의 약자로 여러 페이지로 구성된 웹 어플리케이션입니다. 사용자의 클릭과 같이 인터렉션이 발생할 때마다 서버로부터 새로운 html을 받아와서 해당 링크로 이동하여 페이지 전체를 새로 렌더링하는 전통적인 웹 페이지 구성 방식입니다. 다음은 SPA, Single Page Application의 약자로 하나의 페이지로 구성된 웹 어플리케이션 입니다. 브라우저에 최초에 한번 페이지 전체를 로드하고, 이후부터는 특정 부분만 Ajax를 통해 데.. 2021. 10. 28. http method: resource/method 개념, 주요 method, method 속성 http method - 리소스와 메소드의 개념 - 자주사용하는 http 메소드 - 메소드의 속성 출처: Inflean 강의 :모든 개발자를 위한 HTTP 웹 기본 지식 https://girawhale.tistory.com/66 https://meetup.toast.com/posts/92 Put patch 멱등 https://www.inflearn.com/questions/110644 2021. 10. 26. 이전 1 2 3 4 5 6 7 8 ··· 25 다음 반응형
