til38 [프리온보딩코스] 3주차 - 과제4 ✍알게된 것과 느낀점 데이터 구조에도 설계가 필요하다 CSS에서 할 수 있는 건 CSS에서 (일정 글자 수 이상이면 자르고 ... 붙이기 = ellipsis) 컴포넌트 내 변수 위치 조건부 렌더링, 삼항연산자 그만 사랑하자 lodash의 uniqBy 리덕스 툴킷 Redux DevTools 잊지말자 프론트엔드 클린코드 🔥그래서 해보는 정리 1. 데이터 구조에도 설계가 필요하다 생각해보면 자바로 프로젝트 할 때도 설계가 거의 개발이랑 맞먹게 걸렸었는데 크게 다를리가 없겠지..! 예를들면 저번 과제 리뷰인데, 사용자 등급이 있어서 각 등급별로 접근할 수 있는 게시판이 다른 경우에 위와 같이 access(접근할 수 있는 페이지)를 하나하나 적어주지 않고 해당 유저의 권한 level만 전달한 후 그에 따른 접근 .. 2021. 8. 11. [React] Intersection Observer로 무한스크롤 만들어본 후기 이 글에서 써보고 후기를 남기겠다고 했기에 까먹기전에 적기! Intersection Observer이란? let observer = new IntersectionObserver(callback(entries, observer) [, option]); target을 정하고 그 target이 기기 뷰포트나 특정 요소와 교차할 때 콜백을 생성한다. callback : target에 교차가 일어났을 때 호출되는 함수 entries : IntersectionObserverEntry 객체 리스트를 배열 형식으로 반환 그래서 작성한 코드 (1) intersecting이 일어날 시, IncreasePage를 호출 + 로딩중 문구를 보이도록 true로 설정 (2) IncreasePage가 불려서 Page가 +1 됐기 때.. 2021. 8. 8. [프리온보딩코스] 2주차 -과제3(2) ✍알게된 것과 느낀점 forwardRef styled component를 import할 때 내가 한 실수 - Circular dependency 상수를 관리한다는 것은 - const와 Object.freeze 나무말고 숲을보는 코드를 짜고싶다 netlify에서 배포하기 (treat warning as errors) - CI=false npm run build 🔥그래서 해보는 정리 1. forwardRef 하위 컴포넌트에 있는 엘리먼트에 접근하고 싶을 때 사용한다. 이번에 회원가입을 구현하면서, 제대로 입력 되지 않은 경우에 toast를 띄우면서 해당 input에 focus를 주는 작업을 하는데, 주소 입력하는 칸이 컴포넌트로 들어와있어서... focus를 어떻게 주죠? ~고민의 시작~ (1) 상위 컴포넌.. 2021. 8. 8. [프리온보딩코스] 2주차 -과제3(1) 이번 과제는 일주일 꽉채운 과제! 그래서 수요일에 제출하는건 중간 점검(?) 느낌이다 ✍알게된 것과 느낀점 환경설정은 언제 해도 어렵다 파일을 쪼개기 상태관리가 그런 말이었군요? merge와 rebase의 차이 styled-component와 언제 친해지나요? 애자일과 스크럼 컨벤션...? 🔥그래서 해보는 정리 1. 환경설정은 언제 해도 어렵다 이번에 프로젝트 생성해서 공유하는데 저 푸시햇슴당~ 하고 나니까 몇개 뺴먹어서 적어둔다😔..... 까먹기 쉬운 목록 npm install prettier eslint-plugin-prettier eslint-config-prettier -D (prettier, eslint) npm install styled-components.macro (styled-compon.. 2021. 8. 4. [프리온보딩코스] 1주차 -과제2 ✍알게된 것들 API가 항상 주어질 거라고 생각하지 말기 깃 브랜치의 효과적인 사용법! (master에서 탈출하기) 리액트는 FontAwesomeIcon을 import 해야 해 (feat. npm install의 함정) 효율적인 상수 관리법 어릴적부터 난 레고를 못했어 아직은 어려운 styled-components 클래스형 컴포넌트 너어는 정말 🔥그래서 해보는 정리 1. API가 항상 주어질 거라고 생각하지 말기 UI 구성에 필요한 백엔드 API가 준비되지 않았을 때, 샘플로 데이터를 만들어서 작업 할 수 있어야 함 (mock data) public/data 폴더 안에 데이터를 넣어서 관리할 수 있다. 아니면 사용하는 component 파일과 같은 level에 위치 시킨 후 import 해도 됨 💡잠깐!.. 2021. 8. 1. 이전 1 ··· 3 4 5 6 7 8 다음
