JavaScript/React 검색 결과

해당 글 16건

React Babel의 transform-class-properties 문법

React 책을 보다가 "Babel의 transform-class-properties" 문법이라는 문장이 나와서 Babel이 무엇인지 찾아보았습니다. Babel(바벨) 이란? Babel 공식 페이지 (https://babeljs.io/docs/en)에서는 이렇게 정의하고 있습니다. Babel is a JavaScript compiler - (바벨은 자바 스크립트 컴파일러입니다) 인터프리터 언어에서 컴파일러가 필요할까? - babel은 javascript로 결과물을 만들어주는 컴파일러. * 왜 javascript로 변화할까? - 새로운 기술을 가지지 않는 브라우져가 사용할 수 있게 변경해줌. * 인터프리터란? - 고급 언어로 작성된 프로그램을 한 줄 단위로 받아들여 번역하고, 번역과 동시에 프로그램을 한 ..
JavaScript/React 2020. 7. 29. 16:39

React 컴포넌트

안녕하세요 컴포넌트에 대해서 포스팅 해보려고 합니다. 모듈 내보내기 및 불러오기 //MyCompenet.js 파일 불러오기 import MyComponent from './MyComponent'; props properties를 줄인 표현으로 컴포넌트 속성을 설정할 대 사용하는 요소. children : 태그 사이에 내용을 보요줌. defaultProps : default 값 설정 비구조 할당 : 객체에서 값을 추출하는 문법 propTypes를 통한 props 검증 (string에 숫자를 넣었을 경우) isRequired : 필수 propTypes 설정 //App.js import React from 'react'; import './App.css'; import MyComponent from './My..
JavaScript/React 2019. 12. 2. 19:40

Additional logging details can be found in : /npm-debug.log

npm install을 입력했는데 오류가 발생하여 포스팅 하려고 합니다. npm install -g create-react-app 에러 내용 npm http GET https://registry.npmjs.org/create-react-app npm http GET https://registry.npmjs.org/create-react-app npm http GET https://registry.npmjs.org/create-react-app npm ERR! Error: CERT_UNTRUSTED npm ERR! at SecurePair. (tls.js:1430:32) npm ERR! at SecurePair.emit (events.js:92:17) npm ERR! at SecurePair.maybeIn..
JavaScript/React 2019. 11. 28. 14:31

React 프로젝트 생성

안녕하세요. 이번에 React 프로젝트를 생성해보겠습니다. CMD창에서 create react-app 프로젝트명 명령어를 사용하면 밑과 같이 나옵니다. Installing packages. This might take a couple of minutes. Installing react, react-dom, and react-scripts... > core-js@2.6.9 postinstall C:\Users\GwangMin\hello-react\node_modules\babel-runtime\node_modules\core-js > node scripts/postinstall || echo "ignore" > core-js@3.2.1 postinstall C:\Users\GwangMin\hello-rea..
JavaScript/React 2019. 10. 5. 23:58

JSX 란

JSX 란 JSX는 자바스크립트의 확장 문법이며 XML과 매우 비슷합니다. 이런 형식으로 작성한 코드는 브라우저에서 실행되기 전에 코드가 번들링 되는 과정에서 바벨을 사용하여 일반 자바스크립트 형태의 코드로 변환됩니다. *번들링 : 여러개의 파일 중에 종속성이 존재하는 파일을 하나의 파일로 묶어 패키징을 시키는 과정을 의미합니다. *바벨 : 최신의 자바스크립트 소스를 이전 단계의 자바스크립트 코드로 변환 해주는 개발 도구 입니다. JSX 코드 JSX코드는 흔히 볼 수 있는 HTML코드와 비슷합니다. 이점이 JSX의 장점이라고 할 수 있습니다. function App() { return( Hello react ); } 변환 코드 function App() { return React.createElement..
JavaScript/React 2019. 10. 5. 23:36

JavaScript 라이브러리 React란 및 설치

안녕하세요. 이번에 천천히 REACT에 대해서 공부해보려고 합니다. REACT REACT를 공부하기 전에 먼저 REACT가 무엇인지를 알아보겠습니다. 기존 프레임워크들은 주로 MVC, MVVM이라는 아키텍처를 사용합니다. 위에 나온 아키텍처들의 지닌 공통점은 모델과 뷰가 있다는 것입니다. 프로그램이 사용자에게 어떤 작업을 받으면 컨트롤러는 모델 데이터를 조회하거나 수정하고 변경된 사항을 뷰에 반영합니다. 애플리케이션 규모가 크면 상당히 복잡해지고 제대로 관리하지 않으면 성능이 떨어질 수 있습니다. 여기서 페이스북 개발 팀은 어떤 데이터가 변할 때마다 어떤 변화를 줄지 고민하는 것이 아니라 기존 뷰를 날려 버리고 처음부터 새로 렌더링 하는 방식입니다. 위에 설명한 방식으로 최대한 성능을 아끼고 편안한 사용..
JavaScript/React 2019. 10. 4. 21:26