ref 1. ref? 리엑트 프로젝트 내에서 DOM 요소에 직접 이름을 지정할 수 있습니다. HTML id와 유사하지만 재사용되는 컴포넌트 안에서 유일해야하는 id를 중복해서 가진 DOM이 생겨 문제가 될 수 있습니다. 2. ref 사용 상황 DOM을 꼭 직접적으로 조작해야 할 때 사용됩니다. 특정 input에 포커스 주기 ...

Virtual DOM, Props, state 1. Virtual DOM 실제 DOM과 완벽히 구조가 같은 복사본 자바스크립트 객체 형식으로 메모리에 저장됨(DOM을 직접 조작하는 것 보다 빠르다.) 1.1. Virtual DOM Version 화면이 갱신되기 전 Virtual DOM Object 화면이 갱신된 후 ...

유용한 설치 목록 1. 공통 1.1. 크롬 브라우저 1.2. VScode 자동 저장 설정 1.3. git 2. VSCcode Editer autopep8 Bracket Pair Color DLW Code Runner flask-snippets Git Graph Git History GitLens — Git ...

페어 프로그래밍 1일차 페어프로그래밍을 이용해 알고리즘 문제를 풀었다. 처음에는 예시처럼 문제마다 네비게이터 드라이버로 나눠서 문제를 보는 시간을 가지고 네비게이터가 넘겨주는 코딩 흐름대로 주석을 보고 드라이버가 푸는 방식으로 진행하였다. 아직 코딩에 서툴다보니 네비게이터의 문제 이해도와 드라이버의 이해도가 낮아 시간이 많이 걸려 팀...

React Props 1. 정보교환 방식 Component의 정보 교환 방식으로 부모 자식 관계 즉 부모 컴포넌트가 자식 컴포넌트에게 물려주는 데이터 교환 방식이다. 데이터를 넘겨주기 위해 자식 Component 매게변수로 props를 넣어준다. 데이터는 Object 형식 으로 넘어가기 때문에 Key = value로 보내진다....

React Component? 1. 재사용 UI 함수 여러개의 컴포넌트를 만들어 놓고 UI에 필요할 때 마다 꺼내쓴다. 만들어 놓고 꺼내쓰는 Javascript의 함수와 유사하다. 2. 컴포넌트 형태 부모 요소에서 내려온 객체 props라는 입력을 받음 화면에 어떻게 표현되는지를 기술하는 React 엘리먼츠를 반환(retur...

React? 1. SPA 형식 Single Page Application 한 개의 페이지로 이루어진 애플리케이션 여러개의 페이지로 이루어진 MPA(Multi Page Application)와 상반된 개념 1.1. 장점 서버에 1회 리소스를 요청하여 필요한 데이터만 받아 기존 페이지를 수정하여 MPA처럼 리랜더링이 없어 자연스러운 U...

ES6 “JavaScript”언어의 명칭은 명칭은 당시 무거운 언어인 Java를 대체하는 언어로 Java에 가볍다는 Script를 붙여 “JavaScript”라는 마케팅 전략으로 만들어졌다. Java와 “JavaScript”는 C/C++ 구문의 개발자들을 대상으로 만들어져 유사점을 가지며 Java측에서 “JavaScrip”의 공식 상표를 소유...

매서드 1. 순서 바꾸기 reverse() literal: 배열 기능: 배열의 순서를 거꾸로 만든다. 문법: array.reverse() 단점: 원본 배열도 거꾸로 바뀐다. sort() literal: 배열 기능: 값을 비교해 차순을 부여한다. 문법: array.sort(function(a, b){a - b}) parame...

JavaScript 01 기본 문법 1. 강의 JavaScript 1주차 강의에서는 연산자, 타입, 배열, 객체, 조건문, 반복문 등 기본적인 문법과 개념들을 배웠다. 강의를 보면서 잘 이해가 됐다고 생각했지만 마지막 숙제의 알고리즘 문제를 처음 접하고 어떤식으로 활용을 해야할지 몰라서 한줄 한줄 문제풀이 개념부터 정리했다. 정...