라쿤의 끄적끄적

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit34 📄 프로젝트 안내 해당 프로젝트에 관한 자세한 화면 개요 및 스타일, 상태 관리, 코드에 관한 사항은 Github : RaccoonCode96/redux_racstagram 을 확인해 주세요. 📅 TIL (Today I Learned, 오늘 깨달은 것들) 2021.08.19 사항 전에 발생했던 무한 스크롤 데이터 끝 처리 버그를 해결하기 위한 접근과 제가 해결한 과정을 나누어 보고자 합니다. Intersection Observer에 대해서 잘 모르시면, 잘 정리된 intersection-observer by HEROPY TECH 글을 봐주시면 좋겠습니다. 1. 무한 스크롤 개선 기존 무한 스크롤의 무한 스크롤 데이터 끝 처리 버그..

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit33 📄 프로젝트 설명 이 프로젝트는 기존에 React & firebase를 통해서 만든 인스타그램 클론 프로젝트 리팩토링 프로젝트 입니다. (해당 프로젝트는 프로젝트 카테고리에서 확인 가능합니다.) 상태 관리 해당 프로젝트에서는 redux-toolkit(Slice 모델)을 사용하여 상태관리를 구현하고 있습니다. 스타일 현재 SCSS를 채택하여 css 작업을 진행중에 있으며, 부분적으로 Material UI를 사용하고 있습니다. 대부분의 경우에는, Material UI와 React 호환성 문제로 대부분은 SCSS로 직접 구현하고 있습니다. 💻 화면 개요 체크는 현재 기능적으로 구현된 상황을 의미합니다. 로딩 화면 또는 Component..

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit32 📄 프로젝트 설명 이 프로젝트는 기존에 React & firebase를 통해서 만든 인스타그램 클론 프로젝트 리팩토링 프로젝트 입니다. (해당 프로젝트는 프로젝트 카테고리에서 확인 가능합니다.) 상태 관리 해당 프로젝트에서는 redux-toolkit(Slice 모델)을 사용하여 상태관리를 구현하고 있습니다. 스타일 현재 SCSS를 채택하여 css 작업을 진행중에 있으며, 부분적으로 Material UI를 사용하고 있습니다. 대부분의 경우에는, Material UI와 React 호환성 문제로 대부분은 SCSS로 직접 구현하고 있습니다. 💻 화면 개요 체크는 현재 기능적으로 구현된 상황을 의미합니다. 로딩 화면 또는 Component..

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit31 📄 프로젝트 설명 이 프로젝트는 기존에 React & firebase를 통해서 만든 인스타그램 클론 프로젝트 리팩토링 프로젝트 입니다. (해당 프로젝트는 프로젝트 카테고리에서 확인 가능합니다.) 상태 관리 해당 프로젝트에서는 redux-toolkit(Slice 모델)을 사용하여 상태관리를 구현하고 있습니다. 스타일 현재 SCSS를 채택하여 css 작업을 진행중에 있으며, 부분적으로 Material UI를 사용하고 있습니다. 대부분의 경우에는, Material UI와 React 호환성 문제로 대부분은 SCSS로 직접 구현하고 있습니다. 💻 화면 개요 체크는 현재 기능적으로 구현된 상황을 의미합니다. 로딩 화면 또는 Component..

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit30 📄 프로젝트 설명 이 프로젝트는 기존에 React & firebase를 통해서 만든 인스타그램 클론 프로젝트 리팩토링 프로젝트 입니다. (해당 프로젝트는 프로젝트 카테고리에서 확인 가능합니다.) 상태 관리 해당 프로젝트에서는 redux-toolkit(Slice 모델)을 사용하여 상태관리를 구현하고 있습니다. 스타일 현재 SCSS를 채택하여 css 작업을 진행중에 있으며, 부분적으로 Material UI를 사용하고 있습니다. 대부분의 경우에는, Material UI와 React 호환성 문제로 대부분은 SCSS로 직접 구현하고 있습니다. 💻 화면 개요 체크는 현재 기능적으로 구현된 상황을 의미합니다. 로딩 화면 또는 Component..

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit29 📄 프로젝트 설명 이 프로젝트는 기존에 React & firebase를 통해서 만든 인스타그램 클론 프로젝트 리팩토링 프로젝트 입니다. (해당 프로젝트는 프로젝트 카테고리에서 확인 가능합니다.) 상태 관리 해당 프로젝트에서는 redux-toolkit(Slice 모델)을 사용하여 상태관리를 구현하고 있습니다. 스타일 현재 SCSS를 채택하여 css 작업을 진행중에 있으며, 부분적으로 Material UI를 사용하고 있습니다. 대부분의 경우에는, Material UI와 React 호환성 문제로 대부분은 SCSS로 직접 구현하고 있습니다. 💻 화면 개요 체크는 현재 기능적으로 구현된 상황을 의미합니다. 로딩 화면 또는 Component..

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit28 📄 프로젝트 설명 이 프로젝트는 기존에 React & firebase를 통해서 만든 인스타그램 클론 프로젝트 리팩토링 프로젝트 입니다. (해당 프로젝트는 프로젝트 카테고리에서 확인 가능합니다.) 상태 관리 해당 프로젝트에서는 redux-toolkit(Slice 모델)을 사용하여 상태관리를 구현하고 있습니다. 스타일 현재 SCSS를 채택하여 css 작업을 진행중에 있으며, 부분적으로 Material UI를 사용하고 있습니다. 대부분의 경우에는, Material UI와 React 호환성 문제로 대부분은 SCSS로 직접 구현하고 있습니다. 💻 화면 개요 체크는 현재 기능적으로 구현된 상황을 의미합니다. 로딩 화면 또는 Component..

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit27 📄 프로젝트 설명 이 프로젝트는 기존에 React & firebase를 통해서 만든 인스타그램 클론 프로젝트 리팩토링 프로젝트 입니다. (해당 프로젝트는 프로젝트 카테고리에서 확인 가능합니다.) 상태 관리 해당 프로젝트에서는 redux-toolkit(Slice 모델)을 사용하여 상태관리를 구현하고 있습니다. 스타일 현재 SCSS를 채택하여 css 작업을 진행중에 있으며, 부분적으로 Material UI를 사용하고 있습니다. 대부분의 경우에는, Material UI와 React 호환성 문제로 대부분은 SCSS로 직접 구현하고 있습니다. 💻 화면 개요 체크는 현재 기능적으로 구현된 상황을 의미합니다. 로딩 화면 또는 Component..

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit26 📄 프로젝트 설명 이 프로젝트는 기존에 React & firebase를 통해서 만든 인스타그램 클론 프로젝트 리팩토링 프로젝트 입니다. (해당 프로젝트는 프로젝트 카테고리에서 확인 가능합니다.) 상태 관리 해당 프로젝트에서는 redux-toolkit(Slice 모델)을 사용하여 상태관리를 구현하고 있습니다. 스타일 현재 SCSS를 채택하여 css 작업을 진행중에 있으며, 부분적으로 Material UI를 사용하고 있습니다. 대부분의 경우에는, Material UI와 React 호환성 문제로 대부분은 SCSS로 직접 구현하고 있습니다. 💻 화면 개요 체크는 현재 기능적으로 구현된 상황을 의미합니다. 로딩 화면 또는 Component..

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit25 📄 프로젝트 설명 이 프로젝트는 기존에 React & firebase를 통해서 만든 인스타그램 클론 프로젝트 리팩토링 프로젝트 입니다. (해당 프로젝트는 프로젝트 카테고리에서 확인 가능합니다.) 상태 관리 해당 프로젝트에서는 redux-toolkit(Slice 모델)을 사용하여 상태관리를 구현하고 있습니다. 스타일 현재 SCSS를 채택하여 css 작업을 진행중에 있으며, 부분적으로 Material UI를 사용하고 있습니다. 대부분의 경우에는, Material UI와 React 호환성 문제로 대부분은 SCSS로 직접 구현하고 있습니다. 💻 화면 개요 체크는 현재 기능적으로 구현된 상황을 의미합니다. 로딩 화면 또는 Component..

JavaScript Deep Dive 13 📄 용어 및 중요사항 정리 Set Set 중복되지 않는 유일한 값들의 집합 객체 수학적 집합을 구현하기 위한 자료구조 임 JS의 모든 값을 요소로 지정할 수 있음 set 객체는 이터러블 임 for...of, 스프레드 문법, 배열 디스트럭처링 가능 배열 vs Set 객체 구분 배열 Set 객체 동일한 값을 중복 O X 요소 순서 의미 O X 인덱스로 요소 접근 O X Set 객체 생성 new Set(이터러블) Set 생성자 함수로 생성 이터러블을 인수로 전달받아 Set 객체 생성 인수가 없으면, 빈 Set 객체 생성됨 이터러블의 중복된 값은 Set 객체에 요소로 저장 되지 않음 Set 프로퍼티, 메서드 Set.prototype.size 프로퍼티 Set 객체의 요소..

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit24 📄 프로젝트 설명 이 프로젝트는 기존에 React & firebase를 통해서 만든 인스타그램 클론 프로젝트 리팩토링 프로젝트 입니다. (해당 프로젝트는 프로젝트 카테고리에서 확인 가능합니다.) 상태 관리 해당 프로젝트에서는 redux-toolkit(Slice 모델)을 사용하여 상태관리를 구현하고 있습니다. 스타일 현재 SCSS를 채택하여 css 작업을 진행중에 있으며, 부분적으로 Material UI를 사용하고 있습니다. 대부분의 경우에는, Material UI와 React 호환성 문제로 대부분은 SCSS로 직접 구현하고 있습니다. 💻 화면 개요 체크는 현재 기능적으로 구현된 상황을 의미합니다. 로딩 화면 또는 Component..

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit23 📄 프로젝트 설명 이 프로젝트는 기존에 React & firebase를 통해서 만든 인스타그램 클론 프로젝트 리팩토링 프로젝트 입니다. (해당 프로젝트는 프로젝트 카테고리에서 확인 가능합니다.) 상태 관리 해당 프로젝트에서는 redux-toolkit(Slice 모델)을 사용하여 상태관리를 구현하고 있습니다. 스타일 현재 SCSS를 채택하여 css 작업을 진행중에 있으며, 부분적으로 Material UI를 사용하고 있습니다. 대부분의 경우에는, Material UI와 React 호환성 문제로 대부분은 SCSS로 직접 구현하고 있습니다. 💻 화면 개요 체크는 현재 기능적으로 구현된 상황을 의미합니다. 로딩 화면 또는 Component..

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit22 📄 프로젝트 설명 이 프로젝트는 기존에 React & firebase를 통해서 만든 인스타그램 클론 프로젝트 리팩토링 프로젝트 입니다. (해당 프로젝트는 프로젝트 카테고리에서 확인 가능합니다.) 해당 프로젝트에서는 redux-toolkit(Slice 모델)을 사용하여 상태관리를 구현하고 있습니다. 더불어 나중에, styled component나 sass 중에 채택하여 css 작업을 할 예정 입니다. 💻 화면 개요 체크는 현재 기능적으로 구현된 상황을 의미합니다. 로딩 화면 또는 Component : 앱 실행 초기화 작업시 로딩 또는 다른 작업시 사용할 로딩 화면 및 Component 스타일링 완료 로그인 화면 : 기본 Email ..

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit21 📄 프로젝트 설명 이 프로젝트는 기존에 React & firebase를 통해서 만든 인스타그램 클론 프로젝트 리팩토링 프로젝트 입니다. (해당 프로젝트는 프로젝트 카테고리에서 확인 가능합니다.) 해당 프로젝트에서는 redux-toolkit(Slice 모델)을 사용하여 상태관리를 구현하고 있습니다. 더불어 나중에, styled component나 sass 중에 채택하여 css 작업을 할 예정 입니다. 💻 화면 개요 체크는 현재 기능적으로 구현된 상황을 의미합니다. 로딩 화면 또는 Component : 앱 실행 초기화 작업시 로딩 또는 다른 작업시 사용할 로딩 화면 및 Component 스타일링 완료 로그인 화면 : 기본 Email ..

리팩토링 Instagram 클론 프로젝트 by Redux-toolkit20 📄 프로젝트 설명 이 프로젝트는 기존에 React & firebase를 통해서 만든 인스타그램 클론 프로젝트 리팩토링 프로젝트 입니다. (해당 프로젝트는 프로젝트 카테고리에서 확인 가능합니다.) 해당 프로젝트에서는 redux-toolkit(Slice 모델)을 사용하여 상태관리를 구현하고 있습니다. 더불어 나중에, styled component나 sass 중에 채택하여 css 작업을 할 예정 입니다. 💻 화면 개요 체크는 현재 기능적으로 구현된 상황을 의미합니다. 로딩 화면 또는 Component : 앱 실행 초기화 작업시 로딩 또는 다른 작업시 사용할 로딩 화면 및 Component 스타일링 완료 로그인 화면 : 기본 Email ..