프로그래밍
-
[리액트를 다루는 기술] JSX && 알쓸신잡프로그래밍/React 2023. 6. 18. 14:34
JSX 란? 자바스크립트의 확장문법으로써 상당히 HTML과 비슷한 모습이다. 브라우저가 실행되기 전에 번들링과정에서 바벨을 사용해 JS로 변환되기 때문에 마음껏 리액트에서 사용된다.장점 : HTML이랑 유사해서 보기 좋음 ㅎ 사용 팁 : falsy한 값 중 0은 false로 나타나지 않는다. undefined 는 함수안에서 사용하지 말자 근데 JSX에서는 가능하다(tag안에 쓸 수 있다) 알쓸신잡 ES Line && Prittier 좋구요~ import 는 모듈을 불러오는 기능을 하는 놈으로써 node에서 제공하는 기능이란다 리액트는 웹펙을 이용해서 번들링을 한단다로더의 설치는 따로 해주어야하지만 creat react-app에서 자동으로 설치해준단다 번들링은 나중에 따로 찾아봐야지^^
-
[리액트를 다루는 기술] 랜더링 최적화프로그래밍/React 2023. 6. 17. 00:24
11강 간단요약! 리스트가 랜더링을 하는 과정에서 불필요한 Component까지 랜더링이 되는 현상으로 인해 Lag현상이 생기게 되는데 이러한 현상을 막기위해 최적화를 통해서 부하를 줄이고 줄여서 클라이언트를 좀 더 빠르게 쓸 수 있게 해주는 것들에 대한 이야기 첫번째! func() 과 func 의 차이를 알아보자! 인자로써 받은 func() 과 func는 실제로 클라이언트가 랜더링 될 때마다 실행하는지 처음 랜더링 될 때 실행되고 고정인지에 대한 차이가 있다 자세히 무슨 원리일까 알아보자! 두번째! React.memo를 이용해서 감싸보자! 정말 간단하게 마지막 export 하는 부분에서 React.memo(ComponentName) 을 하고 React를 import 하는 것만으로 랜더링을 안하도록 만든..
-
띵동코딩 CSS프로그래밍/CSS 2023. 6. 1. 15:53
1. CSS활용 - 구역에 대한 이해 Gnb(맨 위에 있는 것) Main Cta(둥둥 떠다니는 박스 구매표시뜨는 애들) - 줄바꿈 - justify-content 얼마나 떨어뜨릴지 결정하는 것 - 수평선 만들기 (2줄로 구성되어있다) - position : fixed; Cta 할때 주로 쓰임(고정) - calc 연산 할 때 주로 쓰이는데 Cta 크기 맞출 때 사용되었다. - 그림자 넣기 - curser: pointer 손모양 나오게 하기 - margin 위 오른쪽 아래 왼쪽 2. 부트스트랩 아이콘 쓸려면 부트스트랩 링크 무조건 필요 가져다 쓰기 꼭 하기 3. 깃허브 배포 방법 레포지토리 먼저 만들고 QUick setup 부분에서 uploading 눌러서 file 올리고 setting에서 page 가서 b..