CSR은 클라이언트에서 웹 페이지 렌더링을 하는 것이고 모든 로직, 데이터 페칭, 라우팅 등을 클라이언트에서 처리한다.CSR은 한 번에 HTML, JS, CSS 등을 로드해서 부분적 리로드를 하지 않고 사용자와 동적으로 상호작용하는 웹 앱이다. 따라서 모든 컨텐츠가 동

https://taegon.kim/archives/9919위 글 공부용

내 상황 초반에 .env 파일을 생성해두고 gitignore에 .env를 등록해두었으나 어떤 이유에서인지 .env도 같이 github에 올라간 상황. 바로 확인 후 .env를 지우고 다시 push했지만 commit 내역에는 수정 기록이 남아있음. 바로 검색했음. 관련

npm install react-hook-form커밋 링크

Node.js and Typescript ORM(Object Relational Mapping)=> JS or TS 와 데이터베이스 사이에 다리를 놓아줌 (기본적으로 번역기의 역할을 한다고 생각하면 됨)Prisma를 사용하기 위해서는 먼저 Prisma에게 DB가 어떻게

redirects는 단순히 user가 해당 source 경로로 페이지 이동을 하게 되면 그것을 감지하여 destination으로 redirect한다.순간적으로 원래의 경로가 보이기 때문에 유저는 url의 변화를 눈치챌 수 있다.1번 source로 이동한다고 가정http

npx create-next-app --typescript프로젝트 name 설정src는 일단 Nocode 프로젝트깃 레포지토리와 연결npm install -D tailwindcss postcss autoprefixernpx tailwindcss init -p -> po

FCM은 비용 없이 안정적으로 메시지 전송이 가능한 플랫폼 간 메시징 솔루션.(firebase 공식문서)FCM은 새 이메일 또는 기타 데이터를 동기화할 수 있음을 클라이언트 앱에 알릴 수 있음.알림 메시지를 보내서 사용자 재참여 및 유지를 유도 가능메시지는 최대 4,0

firebase docs - 설치(https://firebase.google.com/docs/cli?hl=ko처음엔 npm으로 설치했지만 계속 zsh not found 에러가 떠서 자동설치 스크립트를 이용하여 설치했다.curl -sL https://f

완성본 깃허브 링크screen을 위한 기본적 레이아웃과 설정을 제공한다.flutter에서 fetch를 하기 위해서는 http라는 패키지를 설치해야 한다.설치방법https://pub.dev/http 검색해서 해당 페이지 가보면https://pub.dev

픽셀로 지정하면 기기마다 유연한 UI 대응을 하지 못하기 때문에 flexible을 이용하면 알아서 비율을 맞춰준다.flex: 로 비율 정해주기 가능.영역을 꽉 채우도록 하는 위젯isRunning에 따라 작동 함수와 표시 아이콘을 삼항조건문으로 처리.0초되면 리셋1500

Stateful Widget은 변경 가능한 위젯이다.state는 위젯이 빌드될 때 동기적으로 읽을 수 있고 위젯의 lifecycle동안 변경 가능한 정보이다.Stateful 위젯은 두 가지로 나뉜다.상태가 없는 위젯state 위젯은 위젯에 들어갈 데이터와 UI를 넣는

가장 기초적 Widget: StatelessWidget필요 개념 classes 링크(https://velog.io/@bigwave-cho/Dart-%EB%8B%A4%ED%8A%B8-%EA%B8%B0%EC%B4%88\`\`\`jsclass App extends

다트는 네이티브 언어가 아니다.네이티브 언어는 안드로이드나 IOS의 네이티브 위젯 세트에 직접 상호작용하며 앱을 구축한다.하지만 플러터는 자체의 고성능 렌더링 엔진을 사용하여 위젯을 렌더한다.플러터의 작동 순서앱에 엔진 및 다트코드를 컴파일하여 넣어둔다.\-> 앱을 실

Variables Hello Dart! 모든 앱은 main() 함수를 가지고 있으며 콘솔에 텍스트를 표시하기 위해선 print()함수를 이용하면 됨. var 다트의 변수 선언 var 키워드(자동 타입 지정) 명시적 타입 지정(String...) > 보통

Deepdive 공부 정리용 글입니다. 25.1_ 클래스란 JS는 프로토타입 기반 객체지향 언어 프로토타입 기반 객체지향 언어는 클래스가 필요 없는 객체지향 언어! ES5의 함수와 프로토타입을 통한 객체지향 언어의 상속 구현 ES6에서 도입된 class는 클래스

중점: 타입스크립트의 타입은 속성에 대한 집합이 아닌 값들의 집합이다.number, string : 무한집합A|B : A와 B의 합집합A&B : A와 B의 교집합unknown : 모든 집합의 상위 집합(superset) ; 전체집합never : 모든 집합의 부분 집합(

부모 컨테이너에 display : grid 지정!=> 자식 요소(grid cell)부모grid-template-columns : 열grid-template-rows :행grid-template-areasgrid-gap(행, 열 각각 적용 가능)자식grid-colu

리액트에서는 보통 상위 컴포넌트에서 하위 컴포넌트로 데이터를 전달할 때속성값을 이용합니다.간단한 구조에서는 이 방법으로 충분하지만 구조가 복잡하다면 번거로워지고 관리가 힘들어지게 됩니다.그러나 Context API를 이용하면 컴포넌트의 중첩 구조가 복잡하더라도 비교적

MDN spread 문법https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Spread_syntax배열이나 객체의 값들을 변수에 쉽게 할당해준다.let 변수1 = 배열0; 이렇게 안