뚜벅

오랜만입니다! 개인적으로 Flutter에 관심이 있어 설치하는 김에 포스팅합니다~ 1. Flutter 설치 https://docs.flutter.dev/get-started/install/windows#get-the-flutter-sdk Windows install How to install on Windows. docs.flutter.dev 공식 사이트에서 압축파일을 다운로드하여 압축 해제 해줍니다. 저는 Documents 경로에 압축 해제 하였습니다. 이때, 아래와 같은 경로는 피해서 압축해제 해주어야 합니다. 2. 환경 변수 설정 시스템 환경 변수 편집 -> 환경 변수 -> 사용자 변수 -> Path -> 새로 만들기 -> 압축 해제한 경로 추가 Path 더블 클릭! 다운받은 압축 파일을 해제한 경..

이번 개인 프로젝트에서 prisma + mongoDB 를 사용하게 돼서 사용하는 방법에 관해 글을 작성합니다. 1. MongoDB Atlas Database 생성 1. 사이트 접속 후 로그인 MongoDB Atlas Database | Multi-Cloud Database Service The multi-cloud database service at the heart of our developer data platform that accelerates and simplifies how you build with data. Try MongoDB Atlas today! www.mongodb.com 2. Project 생성 project 이름과 추가할 멤버를 설정한 뒤 project를 생성합니다. 3. Dat..

Engine Locking 1. '.nvmrc' 파일 생성 이 파일은 특정 프로젝트에서 사용해야 할 Node.js 버전을 지정하는 데 사용합니다. lts/gallium 본인이 필요한 Node.js 버전을 찾아서 입력해주면 됩니다. GitHub - nodejs/Release: Node.js Release Working Group Node.js Release Working Group. Contribute to nodejs/Release development by creating an account on GitHub. github.com 2. '.npmrc' 파일 생성 package.json의 engines 필드를 엄격하게 검사하도록 작성합니다. 이렇게 하면 package.json에서 engines 필드에 작..

542. 01 Matrix Medium Given an m x n binary matrix mat, return the distance of the nearest 0 for each cell. The distance between two adjacent cells is 1. Example 1: Input: mat = [[0,0,0],[0,1,0],[0,0,0]] Output: [[0,0,0],[0,1,0],[0,0,0]] Example 2: Input: mat = [[0,0,0],[0,1,0],[1,1,1]] Output: [[0,0,0],[0,1,0],[1,2,1]] Constraints: m == mat.length n == mat[i].length 1

리액트 리렌더링 1. props, state 변경 시 리렌더링 2. 부모컴포넌트 리렌더링시 자식 컴포넌트 리렌더링 리액트에서는 위의 조건일때 리렌더링이 발생하는데 이것을 최적화하는 방법을 정리합니다. React.memo React.memo 는 고차 컴포넌트 (HOC) 로 함수 & 클래스 컴포넌트에서 사용가능합니다. React.memo을 통해 최적화를 할 경우 렌더링에 될 때 props를 체크하여 이전 props에서 변화가 있다면 렌더링을 하고 변화가 없다면 기존에 렌더링된 결과를 재사용합니다. React.memo는 오직 props의 변화에만 의존하는 최적화 방법! 그렇기 때문에 useState, useReducer, useContext를 통해 state가 변경되면 리렌더링이 발생합니다. funtion A..

리액트 가상돔 - React Virtual DOM DOM DOM이란 Document Object Model의 약자이며, 웹페이지에 들어가는 element 요소들을 tree 형태의 자료구조로 표현한 것입니다. 그리고 각 element에는 DOM API가 있어서 DOM을 조작할 수 있습니다. 하지만 이때 리플로우 리페인트가 발생하여 시간이 걸리게 되는데요 이것을 리액트에서는 가상돔을 사용하여 효율적으로 관리합니다. Virtual DOM 가상돔은 실제 DOM의 복사본으로 자바스크립트의 객체 형태로 메모리에 저장됩니다. 이것들은 DOM의 복사본으로써 모든 element , 속성들을 가지고 있지만 브라우저에 직접 접근하여 DOM을 조작하는 것은 불가능합니다. (DOM API를 제공하지 않기 때문에) 리액트는 2개..