1월 6일 기절직전 쓰는 일기. [...유즈]

mgkim·2025년 1월 6일
1

react

목록 보기
33/36

스터디하면서(정빈,지훈,재홍,슬아님에게 배운 my 뉴스(!))

0 리액트 18버전 끝났고 19버전 나왔당
1 리액트 훅 폼 라이브러리 >
2 탠스택 쿼리 라이브러리 > 둘다 한방에 되는기야.
3 유즈 옵티미스틱 은 낙관적이야... 공식지원되고, 서버사이드는 클라이언트고 넥스트.js을 많이 쓴당
4 레퍼런스가 속성이고 프롭스로 안넘어간걸 해결하는거야
5 콘텍스트.프로바이더 이제 ".프로바이더" 빠빠이 안쓴데요
6 베타버전이 또 나왔당. 리액트 컴파일러가 나오면서 유즈메모는 덜쓰게 될거얌
7 훅(유즈들)은 리렌더링을 막아줌으로 리액트가 지연되는 시간이 적게 드는거징
(8 디스패치는 유즈,훅과 분리 된 개념이니 따로 공부하기)

렌더트리는 모든트리의 업데이트 버전축척버전이야(약간 염소액기스즙같은느낌)
레이아웃(리플로우), 페인팅(리페인팅)에 오래걸리는 시간을 해결해준다
렌더트리가 끝나는 지점에서 디핑 알고리즘으로 업데이트완성형 트리가 돔으로 보내진당

리액트라는 개념을 정리해보자니, 키 속성이 가장 중요해.
리액트는 키 요소가 가장중요해 자식을 추적하는데에 쓰인다궁.
너무 길어지면 추적이 오래걸려 혼돈의세계로 빠져드는거징

부모태그에서 자식태그로 제곱승씩 시간이 길어지고
전체구조는 오,n,3승까지간다.. 얼마나 오래걸리겟누..

그래서 이걸 해결해준 알고리즘이 디핑알고리즘으로 얘를 좀 공부하면 재밋을것같다(?)고 막연히 생각해봤어
그래서 이걸 싱글 페이지 어플리케이션이라고 SPA라고 한거였음. 조금 거꾸로 복습하면서 이해중이얌..^^아멘

돔은 컴포넌트만 수정시 자동으로 돌아가는 존재가 안보이지만

돔은, 스크롤정보를 얻어오기+상태 속성을 가지고 있징< 이해못함 ㅜ

CSSOM 에서 오는 오브젝트 엠은 모델

프로그래머스???<<찾아바랑~! 뭔디. 좋은것인가봉가

aws에서 포트번호 부여받던데, 같은건지 궁금해,!

정책을 두가지 배웠어, CORS와 SOP
CORS는 반입이 가능하고
1 get post는 오리진 헤더야
2 put delet 는 preflight 요청이야
1,2 둘다 보안이 포인트야. 와일드카드 찾아보고, 요청이 직접허용시에는 좋은편

"오리진"찾아보기

스프링 다음에 플라스크로 전송하고 그다음에 욜로(파이선기반 머신러닝 에이아이)로 보낼수 밖에 없는이유는
스프링이 한방에 욜로로 못보낸데,
난 플라스크랑 비슷한게 장고를 알고 있는데, 장고는 또다른거고, 무튼 백엔드에서는 스프링을 쓸거라는데
이게 뭔말인지. 또 백엔드시간부터 하루하루 고비일듯해

못알아들은말,, 옵션요청은 플라이트 에러? 이게 무슨말이지?????

상태업데이트시 사용하는게 커스텀 훅~이얌
의존성배열이 변경후에는 처음 한번만 실행된데, 마치 초기화되는 느낌이야 (주의, 인터셉터느낌이랑은 좀달르당)

컴포넌트는 클래스형(읽기만공부할것), 함수형(신형)에서는 화살표함수랑 함수선언식 알아두고 자기가 쓰는 포맷은 맞출필요가 있을듯

프롭스 전달받지 않았다, state 변수를 받을수 있다? 먼말이지.. 어디서 나온말이지.. 뜨악

훅은 간단한 경우 쓰진않아. 훅의 규칙들이라고 생각하면쉬울것같다. 함수 여러값들이 들어갈수있어,

포인트> 의존성배열시 변경될때 콜백 실행이 된다.
(코드:겟에버리지 코드에서 리스트(가변값))들 다시 읽어보기

유즈메모, 유즈콜백, 리액트메모들의 훅들은 동작원리가 다른 규칙이다.
유즈메모, 유즈콜백 둘은 사용법이 같고, 유즈콜백이 넘길때 쓰는거야
리액트메모는 프롭스 변경해서 리렌더링이 계속일어난데 그때, 콜백을 쓴다데?

실무 순서 유즈메모 - > 콜백 -> 리액트 메모
실무 푸로바이더? 프로바이더는 윗쪽코드에서 먼저 정의를 별도로 만들고 시작해
실무 디스패치사용해기

유즈 컨텍스트 는 API에서 스테이트로 , 프로바이더에서 소비로 가는 과정같은 느낌이야

유즈컨텍스트랑 프롭스 드릴링이랑 같이 가는 개념이야

당근마켓 인턴십 설명회 요약
1 SRE 내부개발서비스 자체개발 팀이 있어 좋다
2 루비 코틀린 자바스크립트 목적따라 다 쓴다 다양하당
3 주업무는, 사용자 요구사항, 아키텍처, 배포, 보안 다 하는거처럼 보인다
4 현재 회사 500명이고, 부동산 영역시작했다
5 관리자 영역도 한당
6 노션으로 OKR쓰고 슬랙쓰당
7 성능개선 기능추가가 메인이고 서비스확장중이다.
8 기능에 대해서 팁을주자면 평소관심사를 어떻게 해결할지 탐색해보기
9 지역상권살리기, 사용자결함반응, 모임이용에 관심이 많다.


App.js 과 프로바이더로 정의해서 같이쓰고, 컴포넌트는 분리시킬것

커스텀훅 예제 : 유즈리듀스를 이용해서 상태변수를 관리해, 마치 유저 인풋s처럼 사용하는 유즈리듀스가 커스텀훅.
ㄴ 졸고 딴짓해서 놓침...

유즈메모,훅 이용떄, 리스트에 숫자등록한경우는 평균값을 갖게 수정해줘야한당?

유즈콜백이용시, 프롭스 변수로 전달되는 함수가 매번 재정의 되지 않아. (포인트)

2시부터.. ㅠㅠㅠㅠㅠ
테마?,, 맛갔음. 멍.. 중요한거는 프로바이더랑 체이지테마, 테마컨텍스트래. 이게 적은거 다네.. 테마는...ㅠㅠㅠ

유스스테이트대신 유즈리듀스를 쓴다


에프티님과 대화.. 리액트창의 워닝은 괜찮다. 다만 당신이 CNA로 커맨드창을 실행시킨거라면 인덱스랑 앱.js두개
코드만 수정하면되고
나머지 아래에 뜨는 워닝들은 누군가 만든 모듈을 가져와서 쓴거라서 돈터치..!

current

카운트를 상태변수로 만들어바랑
상태변수가 필요해, 상태변수가 아이어도 ref로 쓸수있다
ref변수로 정의하고
계속 렌더링이 일어나서 초기화되지않고 계속 증가하는 카운터는 ref변수로 정의해서 렌더링과는 무관하게 쓸수있다.

profile
@lala.love_garden.lala

1개의 댓글

comment-user-thumbnail
2025년 1월 7일

1/6/2025

  • Flask 예제
    from flask import Flask
    from flask_cors import CORS

app = Flask(name)

CORS(app) # 모든 도메인 허용

react-hook-form
tanstack query

답글 달기