리액트34 [React/JSX] JSX 소개 이전 포스트를 따라가며 만들 프로젝트 폴더를 보니 App.js라는 파일이 눈에 띕니다. 자바스크립트? 하면서 들어간 그 파일에는 다음과 같이 알 수 없는 코드들이 짜여있습니다. import logo from './logo.svg'; import './App.css'; function App() { return ( Edit src/App.js and save to reload. Learn React ); } export default App; 자바스크립트 같기도 하고, HTML같기도한 이 코드들을 알아보겠습니다. 1. JSX JSX는 자바스크립트의 확장 문법입니다. 바닐라 자바스크립트, HTML, XML과 비슷하기도합니다. JSX는 이처럼 HTML 요소를 자바스크립트로 표현하고 변환하기 위해 등장한 문법입.. 2021. 11. 1. [React] 리액트 환경 세팅 리액트를 배우기전에 환경 세팅 방법을 알아보고 가겠습니다. 우선, Node,js가 필요합니다. 아래 사이트에서 Node.js를 LTS 버전으로 다운해주세요. (최신 버전도 상관은 없지만 우리는 배워가는 입장이기 때문에 안정적인 버전을 이용하는 것을 추천드립니다.) https://nodejs.org/ko/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org Node.js를 간략히 설명 드리자면 자바스크립트 런타임으로 이런저런 기능들을 이용할 수 있게 해줍니다. Node.js도 조금 공부를 해서 나중에 다룰수 있다면 좋겠네요. 사실 Node.js는 서버역할을 할 수 있는 런타임이기 때문에 뷰만을 .. 2021. 10. 12. [React] 리액트 소개 리액트는 최근들어 수요가 늘어나고 있는 웹 프레임워크 라이브러리 중 하나입니다. 자바스크립트를 이용해서 보통 사용자 인터페이스 제작에 사용되는 기술입니다. 1. 서론 리액트가 사용자 인터페이스에 사용된다고 했었는데 이런 역할을 하는 프레임워크나 라이브러리들은 사실 몇가지가 더 있습니다. 앵귤러(Angular), 뷰.js(Vue.js) 등이 있는데 이것들은 MVC, MVVM, MVW 모델 등을 채택했습니다. 대표적으로 MVC모델이란, Model-View-Controller의 약자로 다음과 같은 구조를 가집니다. 유저로부터, 조작을 받아 컨트롤러가 모델에 전송해 수정이나 조회를 하고, 모델은 뷰에 업데이트를 함으로써, 사용자에게 보여지는 방식이죠. 굉장히 간단한 구조 같지만 규모가 커지면 커질수록 컨트롤러가.. 2021. 9. 21. [React] React 그동안 기초적인 토대를 세웠다면 이제는 한 걸음 나아갈 차례입니다. 자료구조와 디자인 패턴 정리를 마치고 리액트를 시작할까 했지만, 어떤 동기로 인해 마음이 조금 급해져서 병행하려고 합니다. 하지만 우선은 자료구와 디자인 패턴을 먼저 업로드하고, 리액트 정리는 그 다음에 시작하려고합니다. 그래서 두 카테고리의 포스팅이 끝날 때 까지는 이 카테고리의 업로드가 조금 늦을 수도 있습니다. 이 포스트는 리액트 공식문서와 Velopert님의 리액트 강의 블로그를 참조해서 정리한 포스트들임을 미리 밝힙니다. https://ko.reactjs.org/docs/getting-started.html 시작하기 – React A JavaScript library for building user interfaces ko.re.. 2021. 9. 20. 이전 1 ··· 3 4 5 6 다음 300x250
