728x90 반응형 KDT59 [TIL] 11/28 오픈소스 프로젝트 찾기 이전 내용 [TIL] 11/25 오픈 소스란?1. 오픈소스오픈소스란 누구나 특별한 제한 없이 공개 되어 있는 소스코드를 말한다. 오픈소스로 공개 되어 있는 코드에는 검사(리뷰), 수정 등 개선사항을 마음껏 펼칠 수 있다. 또 오픈 소스는everydayc0ding.tistory.com [TIL] 11/26 오픈 소스와 깃허브이전 내용 [TIL] 11/25 오픈 소스란?1. 오픈소스오픈소스란 누구나 특별한 제한 없이 공개 되어 있는 소스코드를 말한다. 오픈소스로 공개 되어 있는 코드에는 검사(리뷰), 수정 등 개선사항을 마음everydayc0ding.tistory.com [TIL] 11/27 오픈소스에 기여하기이전 내용 [TIL] 11/25 오픈 소스란?1. 오픈소스오픈소스란 누구나 특별한 제한 없이 공.. 2024. 11. 28. [TIL] 11/18 map 에서 key 가 필요한 이유, 1. map 에서 key 가 필요한 이유map 으로 컴포넌트를 반복해서 렌더링할 경우, 각 컴포넌트에는 key 값을 넣어줘야 한다. 넣어주지 않아도 에러가 나지는 않지만, 개발자 도구를 열어보면 콘솔창에 " Warning: Each child in a list should have a unique "key" prop " 라는 경고 문구를 확인할 수 있다. 그렇다면 key 는 왜 필요한 걸까? 결론부터 말하면 성능 최적화를 위해 필요하다. 리액트는 가상 DOM 을 사용하여 실제 DOM 과 비교하는 방식으로 렌더링 성능을 최적화한다. 리액트는 DOM 을 효율적으로 업데이트하기 위해 실제 DOM 과 비교할 수 있는 가상의 DOM 트리를 만들어 두고, 실제 DOM 과 비교해서 변경된 부분만 실제 DOM .. 2024. 11. 18. [TIL] 11/12 styled-components 모르는 것 정리 1. styled-components 모르는 것 정리 1.1. styled-components 의 중첩 스타일링 스타일링 컴포넌트를 작성할 때 이렇게 중첩으로 스타일링을 작성할 수 있다는 것을 알게 되었다. 컴포넌트 구조와 스타일이 일치하기 때문에 어떤 태그(클래스)에 어떤 스타일링이 적용되었는지 쉽게 알아볼 수 있다. const HeaderStyled = styled.header` .logo { img { width: 250px; } margin: -15px; }`; - 중첩 스타일의 동작 방식 styled-components 는 내부적으로 CSS 클래스를 생성할 때 중첩된 스타일을 컴파일한다. 위의 코드를 컴파일하면 아래와 같이 앞에 유니크한 클래스 이름이 붙어서 생성되.. 2024. 11. 12. [TIL] 11/8 React.ts 살펴보기 1. 리액트 프로젝트 생성: CRA vs ViteCRA 는 초기설정과 구성을 자동화해서 개발자가 빠르게 리액트 앱을 생성할 수 있도록 도와준다. 웹팩과 바벨을 사용해서 개발 서버를 실행하고 HMR(Hot Mode Reloading)을 제공해준다. 웹팩을 통해 빌드시 코드를 컴파일하고 압축하는 역할도 해준다. (가장 대중적으로 많이 쓰임)+ 환경변수: process.env.KEY Vite 는 빠른 속도와 효율로 최근에 많이 주목 받고 있다. 웹팩 대신 롤업을 사용해서 빌드하는데, 웹팩에 비해 속도가 크게 개선된 버전이다. 또 HMR 에서 굉장히 빠른 속도를 자랑한다. CRA 는 HMR 을 할 때 소스 전체를 빌드하지만 Vite 는 모듈 단위로 빌드해서 브라우저에 제공하기 때문에 CRA 보다 속도가 빠르다... 2024. 11. 8. 이전 1 2 3 4 ··· 15 다음 728x90 반응형
