Hoonni
'React/2022-上' 카테고리의 글 목록 (9 Page)

React/2022-上

React/2022-上

Template Literals

Template Literals Template Literals란? ES6에서 새로 도입된 문자열 표기법 백틱(backtick) ` 을 사용 ┗ 백틱은 키보드에서 숫자 1 왼쪽, tab키 위에 위치했음 / ' (작은 따옴표)와 헷갈리지 말것! 여러 줄에 걸쳐 문자열 작성 가능 └ 줄바꿈을 그대로 표현할 수 있음 특수 기호 $를 사용해서 변수 또는 식 포함 가능 기존 사용 방법 let a = 10; console.log("a의 값은 " + a + "입니다"); └ 위와 같이 + 를 이용해서 문자열을 이어 붙여 사용 Template Literals 사용 방법 let a = 10; console.log(`a의 값은 ${a}입니다); └ 위와 같이 백틱( ` )을 사용하여 기존 사용 방법과 다르게 +를 이용하지..

React/2022-上

Git

Git Git이란 ? 무료, 공개 소프트웨어 컴퓨터 파일의 변경사항을 추적하고 여러 명의 사용자들 간에 해당 파일들의 작업을 조율하기 위한 분산 버전 관리 시스템 소스 코드 관리에 주로 사용됨 어떤 집합의 파일의 변경사항을 지속적으로 추적하기 위해 사용될 수 있음 현재 가장 널리 쓰이는 분산형 버전 컨트롤 프로그램 중 하나 여러 곳의 원격 저장소를 등록하여 사용 가능 Git에서 일어나는 일, 주로 사용하는 용도 똑같은 환경에서 시작(환경 설정) └ 서버개발자 중 한명이 환경을 구성함 모두 같은 환경에서 개발하여 불필요한 시간을 없애고 서로 주고 받는 와중에 일어나는 충돌을 최소화함 Git의 장점 소스코드를 주고 받을 필요 없이, 같은 파일을 여러 명이 동시에 작업하는 병렬 개발이 가능 브랜치를 통해 개발..

React/2022-上

Import & Export

Import Import의 뜻은 ? → Import의 사전적 의미 : ① 수입하다 ② (다른 프로그램에서 데이터를) 불러오다 React에서의 import 사용 방법 형태 의미 import 이름 from "위치" default 있이 export 해 줬을 때 사용 import { 이름 } from "위치" default 없이 export 해 줬을 때 사용 import * from "위치" 위치에 있는 모든 것을 갖고 올 때 사용 import * as 이름 from "위치" as 문법을 통해 이름을 임의로 설정할 수 있음 import { default as 이름 } from "위치" as 문법을 통해 이름을 임의로 설정할 수 있음 Export Export의 뜻은 ? → Export의 사전적 의미 : ① 수출(..

React/2022-上

JSX

JSX JSX는 JavaScript에 XML을 추가한 확장 문법이다. 리액트로 프로젝트를 개발할 때 사용됨 -> 공식적인 자바스크립트 문법이 아님 하나의 파일에 자바스크립트와 HTML을 동시에 작성하여 편리함 JSX 문법 규칙 ① 반드시 부모 요소 하나가 감싸는 형태 └ 컴포넌트에 여러 요소가 있다면 반드시 부모 요소 하나로 감싸야 함 ⑴ 부모 요소 하나로 감싸줘야하는 이유가 무엇일까요? → Virtual DOM에서 컴포넌트 변화를 감지해 낼 때 효율적으로 비교할 수 있도록 컴포넌트 내부는 하나의 DOM 트리 구조로 이루어져야 한다는 규칙이 있기 때문. ⑵ 무조건 요소를 사용하여 감싸야 할까요? → 그렇지 않다. Fragment라는 기능을 사용할 수도 있음. Fragment는 혹은 의 형태로 표현할 수 ..