본문 바로가기

분류 전체보기

(21)
[React] 설치 및 시작하기 - 노마드 수업 정리 개발 환경 설치 1. nodejs 설치 https://nodejs.org/ko/download/ node -v // nodejs 설치 확인 npm -v // npm 설치 확인 (nodejs 설치하면 같이 옴) 2. npx 설치 npm install npx -g // npx 설치 npm install -g npm // 업데이트 npx -v // 설치 확인 3. git 설치 https://git-scm.com/downloads git -v // git 설치 확인 git --version // 버전 확인 시작하기 1. create-react-app 터미널에서 폴더 만들 곳으로 들어가기 cd Documents // 해당 위치에 폴더를 만들 예정 react 프로젝트 만들기 (폴더 이름과 동일) npx create..
[React] 설치 및 시작하기 개발 환경 설치 1. nodejs 설치 https://nodejs.org/ko/download/ node -v // nodejs 설치 확인 npm -v // npm 설치 확인 (nodejs 설치하면 같이 옴) 2. npx 설치 npm install npx -g // npx 설치 npm install -g npm // 업데이트 npx -v // 설치 확인 3. git 설치 https://git-scm.com/downloads git -v // git 설치 확인 git --version // 버전 확인 시작하기 1. create-react-app 터미널에서 폴더 만들 곳으로 들어가기 cd Documents // 해당 위치에 폴더를 만들 예정 react 프로젝트 만들기 (폴더 이름과 동일) npx create..
#React #React 리액트는 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리이다. React는 상호작용이 많은 UI를 만들 때 생기는 어려움을 줄여준다. : 페이스북에서 제공하는 프론트엔드 라이브러리이며, 컴포넌트 기반으로 되어 있어서 컴포넌트에 데이터를 내려주면 개발자가 설계한대로 UI를 만들어 사용자에게 보여진다. - 웹 페이지를 만들기에는 html, css로도 충분하지만 html, css 만으로 동적인 데이터를 UI에 뿌려주기에는 적합하지 않다. 이 때 리액트를 이용한다면 사용자와 상호작용할 수 있는 UI를 손쉽게 만들 수 있기때문에 리액트를 사용한다. : 이 라이브러리는 Virtual DOM 이라는 개념을 사용하여 상태의 변함에 따라 선택적으로 유저인터페이스를 렌더링한다. 따라서, 최소한의..
이미지 대체 텍스트 숨기기 기존에 흔히 사용하던 -999999px 보다 랜더링 성능이 뛰어난 방법 .textHide { text-indent: 100%; white-space: nowrap; overflow: hidden }
[올바른 표기법] 카멜, 파스칼, 스네이크 표기법 (camelCase/PascalCase/snake_case) 표기법의 종류 변수명, 함수명, 클래스명 등 여러가지 이름들의 명명법에는 규칙이 있다. 카멜 표기법 (camelCase) 첫 문자를 소문자로 표기하고, 그 다음 문자부터는 대문자로 표기합니다. 이것을 단봉낙타 표기법이라고도 부릅니다. (ex. camelCase, helloWorld) Java 프로그래밍에서 권장하는 표기법이라고 한다. 파스칼 표기법 (PascalCase) 첫 문자를 대문자로 표기하고, 그 다음 문자도 대문자로 표기합니다. 이것을 쌍봉낙타 표기법이라고도 부릅니다. (ex. PascalCase, HelloWorld) 함수와 클래스명은 이 표기법을 권장한다. 스네이크 표기법 (snake_case) 한 문자마다 _(underscore)를 붙여 이어나가는 표기법이다. (ex. snake_case,..