Til12 TIL - 2022.10.20 - 무한스크롤 고려, CloudFront, useEffect, useLayoutEffect ✅ 정리했었던 내용 복습 1️⃣ 데이터 10,000를 가지고 무한 스크롤 구현 시 가장 중요하게 고려해야 할 점은? - 인스타그램, 페이스북처럼 최신 글을 보고싶어 하는 SNS는 무한스크롤 구현을 통해 교화적으로 최신 글을 보여줄 수 있지만, 그렇지 않은 예전 데이터를 찾아보는 사이트 등은 데이터가 많아질수록 로딩을 계속 해야 하는 번거로움이 발생되어 적합하지 않는다. 2️⃣ CloudFront로 배포하는 이유 - CloudFront는 전 세계에 분포된 엣지 로케이션이라는 데이터 센터의 엣지 서버에서 콘텐츠를 캐싱한다. - 사용자의 위치에서 가장 가까운 엣지 로케이션에서 콘텐츠를 제공 받을 수 있도록 한다. - 따라서, CloudFront로 배포를 하면 CDN(콘텐츠 전송 네트워크)을 통해 페이지 응답 .. 2022. 10. 20. TIL - 2022.10.18 Virtual DOM, useRef, useEffect, var, let, const, Async/Await, Promise ✅ 정리했었던 내용 복습 1️⃣ Virtual DOM과 Real DOM의 차이 - DOM(Document Object Model)은 웹 페이지를 이루는 태그들을 자바스크립트가 이용할 수 있게끔 브라우저가 트리 구조로 만든 객체 모델 - DOM은 HTML에 동적인 변화가 있을 경우 전체 페이지(DOM Tree)를 검색해서 해당 부분을 교체한 후 전체 페이지에 대해 리렌더링을 해주어야 하는 문제점이 발생, 이에 대한 문제점을 해결하기 위해 나온 것이 Virtual DOM - Virtual DOM을 사용하면 실제 DOM에 조작하여 접근하는 대신, 추상화한 자바스크립트 객체를 구상하여 사용한다. - DOM의 상태를 메모리에 저장하고 데이터가 업데이트 되면 전체 UI를 Virtual DOM에 리렌더링 해서 이전 .. 2022. 10. 18. TIL - 2022.10.17 상태 관리, Redux란? React, CS 공부 꾸준히 하자!! 리액트를 다루는 기술 책을 읽고 있는데 겹치는 부분도 많다. 여러 번 보면서 장단점을 파악하고 이해해야 할 것 같다. 사용하고 있지만 명확하게 이유를 모르고 코딩만 할 때가 있다. 그렇게 하지 않도록 꾸준히 공부를 해보기! ✅ 정리했었던 것 + 다시 정리하기! 1️⃣ 상태관리를 왜 할까? - 서로 다른 컴포넌트에 같은 데이터가 필요하다고 할 때, 각 컴포넌트가 부모 자식 관계로 되어 있지 않은 이상 직접적인 데이터 전달이 어렵다. - 데이터를 부모 컴포넌트로 보내고 다시 필요한 컴포넌트로 전달을 해야 하는데, 이렇게 Prop Drilling이 많아지면 이 Prop이 어디에서 왔는지 확인하기가 어려워 상태관리를 해야 한다. - 평소 State관리는 Redux로 하고 .. 2022. 10. 17. 항해99 27일차 TIL - 리액트 심화과제 뷰 구성 & 오늘 배운 것 ✅ 리액트 심화과제 뷰 구성 기존에는 뷰 만들기부터 먼저 했다면, 심화 과제에선 어제 와이어 프레임 구성했던 것처럼 페이지와 기능이 너무 많아서 아래 내용을 보고 기능 분배하기 부터 시작했다!! 기능을 분배하고 어떻게 하지 고민하다가 컴포넌트 별로 뷰를 구성할 사람을 나누기로 했다!! 이름이 나와서 뷰 구현 나눈 것은 캡처에서 제외했다. 조금 어려웠던 것은, 내가 조장이라서 미리 git hub에서 레포지토리 만들고 컴포넌트 ,페이지, 라우터, 리덕스 부터 패키지 설치까지 미리 해두고 commit을 했는데 혹시나 실수나 패키지 부족한 점이 있을까봐 걱정했었다. 다행히 확인결과 오류는 없는 것으로!! 뷰 구성하면서 추가적으로 컴포넌트가 늘어나긴 했지만 그래도 아직까지는 깨끗한 폴더인 것 같다! 오늘 사실 학.. 2022. 8. 6. 항해99 26일차 TIL - (리액트) 투두리스트 심화 과제 와이어프레임 설정 & 오늘 배운 것 ✅ 와이어프레임 구성 세 번째 진행하는,,, 그리고 심화 주차인 투두리스트의 와이어 프레임을 구성했다! 기능만 봐도 너무 많아서 페이지를 여러 개 구성해야 하는데,, 할 수 있다..ㅠㅠ 일단 오늘은 심화 학습자료 공부를 시작했는데 컨디션이 너무 좋지 않다. 아픈 것은 아닌데 졸림을 아예 참을 수 없는 정도인 것 같다 오늘은 일찍 자고 내일 잘 해보기!! 컨디션 관리 중요해 ㅠㅠ ✅ 오늘 배운 것 1️⃣ 리액트 심화자료 공부 : 리덕스 툴킷 ~ jason server 지금 너무 피곤해서 그런지 다른 팀원들에 비해 속도가 느렸다. 그래도 놓치는 부분 없이 집중해서 진행하자! 🔹 내 블로그 정리해둔 곳 : https://jenny0520.tistory.com/84 2️⃣ 자바스크립트 🔹 내 블로그 정리해둔 곳.. 2022. 8. 5. 항해99 TIL - 4주차 리액트 과제 시작 & 오늘 배운 새로운 것들 기록 ✅ 오늘 동료들에게 들은 말! 매일 동료들에게 나는 어떤 팀원이고 개발자인지 듣는 건 재미있다. 항상 새롭다. 난 아직 코딩 실력이 많이 부족한 것 같은데, 팀원들의 색다른 이야기를 들으면 난 이런 사람이구나 새삼 깨닫게 되기도 하고 위축될 법 하지만 다시 일어날 수 있는 계기가 되어준다. ❓ 블로그 어떻게 쓰나요? 지금 항해 몇일차인지 모르겠으나,,? 4주정도 지난 이 날, 영업일(?) 기준으로 18일 정도 지났는데 블로그 게시글이 벌써 70개가 되었다. 👌 어떻게? 왜? 그냥 배운 모든 것을 정리했다.! 알고리즘을 배웠으면, 모두 내용이 다를테니 하나하나 정리하고 내가 어떻게 이해했는지 써보고 강의를 들었으면, 강의 다 듣고 강의자료 보면서 똑같이 써보고 이해가 안 되면 자료 다시 보고 CS스터디를 .. 2022. 7. 31. 이전 1 2 다음