codinghatso

-ai를 사용해 개념정리 했음을 공지합니다.- 스트리밍 (Streaming)스트리밍이란 컴포넌트들을 각각의 덩어리(Chunks)로 묶어 분류하여 병렬처리하는 방식이다. 일반적으로 서스펜스와 데이터 가져오기 작업 시 좋은 관행으로 "데이터 가져오기를 필요한 구성 요소로 이동"을 말할 수 있다.데이터를 필요한 구성 요소로 이동시키면 더 세분화된 서스펜스 경계를 만들 수 있습니다. 이를 통해 특정 구성 요소를 스트리밍 하고 UI가 차단되는 것을 방지할 수 있다. Next.js 에서는 loading.tsx라는 특별한 파일을 생성할 수 있습니다. 이 예약된 파일은 페이지를 로딩하는 동안 사용자에게 보여줄 화면을 정의할 수 있습니다.참고로 정적인 UI 이 과정에서는 SideNav 같은 요소는 즉시 표시됩니다.📌 ..

끝말잇기 웹 게임을 만들면서 사고력 기르는 훈련을 하고자 합니다.순서도 설계를 통해 절차를 정리한다면 좋은 결과를 얻을 수 있다.내부함수[prompt : 입력값 받기alert : 공지하기confirm : 의사를 물어볼 때 ] 입력태그는 value로 값을 가져오며, 이외 태그들은 textContent로 값을 가져오고 설정한다.순서도의 의사결정 부분에서 OR 또는 AND인지에 따라 최적화가 가능하다.최적화는 진리표를 사용하면 더 정확하게 구분할 수 있다. 예) OR 진리표첫 번째 조건두 번째 조건최종 결과truetruetruetruefalsetruefalsetruetruefalsefalsefalse내용 정리순서도 그리기대화 상자 띄우기태그 선택하기태그에 이벤트 달기순서도 최적화하기 1번째 참가자..

rAF는 자바스크립트가 프레임 시작 시 실행되도록 보장해 주어 밀림 현상을 방지한다.페이지가 비활성화되면 작업이 중지됨으로 CPU 리소스나 배터리 수명을 낭비하지 않게 된다.디스플레이의 주사율에 따라 최적화되는 특징이 있다. 60hz에서는 1초에 60번 144hz에서는 1초에 144번 호출되는 것이다.rAF는 스크롤 이벤트 최적화 기법으로 사용된다. rAF는 setTimeout 처럼 콜백 함수 내부에서 재귀 호출 하는 식으로 구성하면 된다.차이점은 setTimeout은 타이머를 지정해주어야 하지만, rAF는 프레임 단위로 동작하기 때문에 별도의 반복 플래그가 필요 없다는 점이다.const performAnimation = () => { /* 스타일 조정 스크립트 */ requestAnimation..

개요 스타일링 : Next.js에서 응용프로그램 스타일을 지정하는 다양한 방법. 최적화 : 이미지, 링크 및 글꼴을 최적화하는 방법. 라우팅 : 파일 시스템 라우팅을 사용하여 중첩 레이아웃 및 페이지를 만드는 방법 데이터 가져오기 : Vercel에서 데이터베이스를 설정하는 방법 및 가져오기 및 스트리밍 모범 사례. 검색 및 페이지 지정 : URL Search Params를 이용한 Search 및 Pagination 구현 방법 데이터를 변형하는 중 : React Server Actions를 사용하여 데이터를 변경하고 Next.js 캐시를 다시 확인하는 방법. 404 오류를 찾을 수 없습니다. 양식 점증 및 접근성 : 서버 측 양식 검증 방법 및 접근성 향상을 위한 팁 인증 : 및 미들웨어를 사용하여 응용프..