그린그린티라떼

Redux의 단방향 데이터 흐름이란? - state는 특정 시점의 앱 상태를 설명한다. - UI는 해당 상태를 기반으로 렌더링된다. - 어떤 이벤트가 발생하면 발생한 일에 따라 state가 업데이트 된다. - 새로운 상태에 따라 UI가 다시 렌더링된다. 위의 이미지는 리덕스에 대해 알고 있어요! 하면 무조건 설명이 가능해야하는 그림이다. 아래의 설명을 외우기보다는 그림을 보며 꼭! 이해해야한다. 사실 별 거 없다ㅎㅎ Redux에 대해 기억해야 되는 것들 ✔️Redux는 전역 어플리케이션 상태를 관리하기 위한 라이브러리이다. - Redux는 일반적으로 Redux와 React를 함께 통합하기 위해 React-Redux 라이브러리와 함께 사용된다. - Redux Toolkit는 Redux 로직을 작성하는 데 ..

JavaScript에서 객체와 배열은 모두 변경 가능하다. 객체를 생성하면 해당 필드의 내용을 아래와 같이 변경 가능하다. 메모리 안에서 객체나 배열의 참조값은 같지만 객체/배열 내부 값이 바뀌었다. (불변성을 지키지 못함) const obj = { a: 1, b: 2 } // still the same object outside, but the contents have changed obj.b = 3 const arr = ['a', 'b'] // In the same way, we can change the contents of this array arr.push('c') arr[1] = 'd' 값을 불변하게 업데이트하려면 기존의 객체/배열의 복사본을 만든 다음 복사본을 수정해야 된다.(불변성 지킴) ..

React를 사용하면 거의 필수적으로 사용하는 Redux 그런데 막상 Redux에 대해 설명하려고 하니 잘 모르겠어서 정리해본다. 우선 공식 홈페이지를 참고해서 글을 작성한다. https://redux.js.org/ Redux - A predictable state container for JavaScript apps. | Redux A predictable state container for JavaScript apps. redux.js.org Redux? JS앱을 위한 예측 가능한 상태 컨테이터 ✔️ 예측 가능 - Redux는 일관성 있게 동작하고 다양한 환경(클라이언트, 서버)에서 실행되며 테스트하기 쉬운 어플리케이션을 작성하는데 도움이 된다. ✔️ 중앙 집중식 - Redux DevTools를 사용..

Page view란? GA4에서 ‘page_view’는 주요 내장 이벤트 중 하나입니다. 사용자가 웹 사이트를 방문할 때마다 자동으로 추적되는 이벤트입니다. 기본적으로 추적되는 정보: 사용자가 페이지를 로드하거나 새로 고치면 ‘page_view’ 이벤트가 자동으로 보내집니다. 관련 파라미터: 이 이벤트와 함께 전송되는 기본 파라미터에는 다음과 같은 정보가 포함될 수 있습니다. page_location: 방문한 페이지의 URL page_referrer: 사용자를 해당 페이지로 인도한 이전 페이지의 URL page_title: 방문한 페이지의 제목 사용자 정의 파라미터: 필요에 따라 추가 파라미터를 설정하여 page_view 이벤트에 추가 정보를 포함시킬 수 있습니다. 이용 사례: 웹사이트의 특정 페이지 방..

VSCode 에디터를 더 유용하게 쓰기 위한 단축키들을 알아봅시다! 같은 단어/변수명을 모두 선택하는 2가지 단축키가 있는데 각각 어떤 것인지 정리해보았습니다. cmd + shift + L / ctrl + shift + L 1. 원하는 단어로 커서를 가져다 놓고 2. cmd + shift + L / ctrl + shift + L 단축키를 이용하면 3. 모든 potato 변수에 커서가 가는 것을 볼 수 있다. cmd + D/ ctrl + D 1. 원하는 단어로 커서를 가져다 놓고 2. cmd + D / ctrl + D 단축키를 이용하면 3. 단축키를 누른 횟수만큼의 potato 변수에 커서가 가는 것을 볼 수 있다. VSCode 에디터에서 단축키로 같은 변수명/단어를 선택하는 방법에 대해 알아보았습니다! ..

JavaScript 함수에 원시값과 객체를 매개변수로 넣었을 때 어떻게 다른 지에 대해서 궁금증이 생겼다. 조금 더 확실하게 정리하고자 기록으로 남긴다. 원시값(primitive values)을 매개변수로 전달할 때 Boolean, Number, String, BigInt, Symbol, null, undefined은 JS의 원시값에 해당합니다. 함수에 원시값을 매개변수로 전달하면 그 값의 복사본이 함수 내부로 전달됩니다. 따라서 함수 내에서 해당 매개변수를 변경해도 원래의 값에는 영향을 주지 않습니다. function modifyValue(x) { x = x + 1; console.log('Inside function:', x); } let value = 5; modifyValue(value); // ..

더 늦기 전에 flutter 개발에 탑승하기 위해 Dart를 학습하기로 마음먹었다. flutter를 배우기 전에 Dart를 배우는 것이 중요한 이유는 나중에 결국 2가지 다 공부해야되기 때문이다. Dart의 주요 특징으로는 1) 정적 타입 언어 변수의 데이터 타입을 명시적으로 선언하고 컴파일할 때 타입 검사를 수행한다. 빠른 버그 픽스 가능. 2) 객체 지향 프로그래밍 클래스, 상속 사용 지원 3) JIT 및 AOT 컴파일러 Dart는 Just-In-Time(JIT)컴파일러와 Ahead-Of-Time(AOT)컴파일러를 지원한다. JIT컴파일러는 개발자를 위한 빠른 개발과 디버깅을 가은하게 한다. AOT컴파일러는 프로덕션 환경에서 빠른 실행 성능을 제공한다. 4) 빠른 실행 속도 Dart는 빠른 실행 속도..

보호되어 있는 글입니다.

'Record[]' 형식은 'Post[]' 형식에 할당할 수 없습니다.ts(2322) {/* @ts-expect-error Async Server Component */} https://nextjs.org/docs/app/building-your-application/configuring/typescript#async-server-component-typescript-error

stateful과 stateless 이 두 용어는 시스템이 사용자의 정보나 상태를 얼마나 기억하는 지를 나타냅니다. stateless - 레스토랑에서 매번 주문할 때마다 메뉴를 다시 보고 주문하는 경우 stateful - 레스토랑의 단골 고객이 주문하는 경우. 평소 주문 내역을 알고 있는 서버가 '항상 먹던 것과 같이 할까요?'라고 물어보는 경우 stateless 시스템은 각각의 작업이 독립적이므로 빠르고 단순합니다. 반면, stateful시스템은 사용자의 상태나 이전 작업을 기억하기 때문에 더 복잡한 작업을 수행할 수 있습니다. Stateless(상태 없음) - HTTP프로토콜, UDP프로토콜 각 요청이나 작업이 독립적입니다. 이전의 요청이나 작업에 대한 정보를 유지하지 않습니다. 장점: 상태를 유지하..