VS code가 1.69 버전으로 업데이트 되면서 자동완성 기능이 작동하지 않네요. 잘 사용하다가 자동 업데이트 후 갑자기 ! + tab 가 안되어 당황했기 때문에 저와 같은 분들에게 도움이 되고자 해결방법을 적습니다. Help > About 를 클릭하시면 현재 버전을 확인할 수 있습니다. 자동완성 안되는 경우 해결방법 ctrl + space ! 친 다음 ctrl + space 누르면 기존처럼 자동 완성 기능이 뜬다. mac의 경우에는 fn + ctrl + space 단 모든 자동 완성 방식을 이런식으로 쳐야하는 불편함이 있다. VS code의 버전 낮추기 1.69 버전을 1.68로 다운그레이드하면 기존 처럼 자동완성 기능을 쓸 수 있다. 1.68은 아래 링크에서 다운로드 가능합니다. https://co..

JSX란? jsx란 JavaScript를 확장한 문법입니다. 자바스크립트의 공식적인 문법은 아니지만 바벨에서는 개발자들이 임의로 만든 다양한 문법 지원을 위해 preset 또는 plugin들을 지원하고 있습니다. 더 간결한 구문을 제공하는 커뮤니티로는 react-hyperscript https://github.com/mlmorg/react-hyperscript hyperscript-helpers https://github.com/ohanhi/hyperscript-helpers 등이 있습니다. 리액트에서는 jsx 사용이 필수가 아니고, 빌드 환경에서 컴파일 설정을 원치 않을때는 jsx 없이 사용하는 게 편리할 수 있습니다. JSX 장점 리액트 안에서 UI 관련 작업을 할 때 시각적으로 편리하다. 리액트의 ..

리액트 주석 작성 방법 리액트 주석은 jsx 밖에서는 java script와 똑같이 사용가능 jsx 문법 안에서는 {/*....*/} 으로 작성할 수 있습니다. // 또는 /* */ 은 사용할 수 없고, 페이지에 노출됩니다. import './App.css' function App() { const name = '리액트 주석 작성법'; return ( {/* 주석은 이렇게 작성합니다. */} {name} // 이 주석은 화면에 표시 됩니다. /* 이 주석도 화면에 표시 됩니다. */ ); } export default App;

리액트 설치 전 준비 windows https://nodejs.org/ko/ Node.js 공식 홈페이지에서 LTS 다운로드 Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 더보기 * Node.js를 사용하는 이유 Node.js + npm 웹 브라우저 환경이 아닌 곳에서도 자바스크립트를 사용할 수 있도록 하는 자바스크립트 런타임임. Node.js 패키지 매니저 도구인 npm이 함께 설치되어 패키지를 설치하고 버전관리가 가능함. macOS nvm을 이용하여 설치한다. (버전 업데이트와 버전 관리에 용이하다.) Node.js 홈페이지에서 다운 받아도 상관없다. 1. Visual Studio C..

리액트란 리액트는 메타 (구 페이스북)에서 만든 오픈 소스로 자바스크립트 라이브러리입니다. 리액트를 이용하면 상호작용이 많은 사용자 인터페이스 UI를 보다 쉽게 만들고 성능을 아끼면서 최적의 사용자 경험을 제공할 수 있습니다. Component 리액트에는 컴포넌트 component 라는 선언체가 있는데, 컴포넌트가 최초로 실행한 '초기 렌더링'에서 데이터가 변경되면 해당 컴포넌트만 효율적으로 갱신하고 리렌더링 하는 방식으로 애플리케이션을 View에 집중하여 UI 구현을 쉽게 설계할 수 있도록 하고 있습니다. 컴포넌트는 재사용 가능한 API로 다른 프레임 워크 템플리의 HTML 태그를 문자열로 반환하는 형식과 다릅니다. DOM 조작 최소화 리액트는 Virtual DOM 방식을 사용하여 실제 DOM에 바로 ..