약 4년전쯤 React-Native를 통해 Android, IOS App을 만들어보았었지만, 자세하게 하나하나 확인하면서 만들지 않았었던 기억이 있었습니다. 알고보면 별거 아니었을 수도 있었겠지만, 이해하다보면 더 재밌는 것들을 발견할 수 있지 않을까 싶어 React 공식 문서를 통해 self study 를 시작합니다. React 게시물의 글들은 모두 React 공식 문서를 통해 재해석한 내용을 나중에 혼자 찾아볼 수 있는 용도로 씁니다~! 글에 잘못된 내용이 있을 수도 있으므로 해당 포스팅을 보시는 분은 꼭 공홈을 참고해주세요~! https://ko.reactjs.org/ React – 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리 A JavaScript library for build..

Element 란 React 를 이루는 가장 작은 단위이다. React 자습서에 따르면 아래와 같은 표현을 사용하고 있었다. React로 구현된 애플리케이션은 일반적으로 하나의 루트 DOM 노드가 있습니다. React를 기존 앱에 통합하려는 경우 원하는 만큼 많은 수의 독립된 루트 DOM 노드가 있을 수 있습니다. 이 말을 코드로 다시 되짚어 보면 React가 DOM에 어떻게 렌더링하고 있는지 알 수 있다. const element = Hello, world; ReactDOM.render(element, document.getElementById('root')); html 에서 div 태그안에 있는 root가 존재하고 있는데, React 를 통해 이 태그를 표현할 수 있게 된다. element 라는 JS..

const element = Hello, world!; 위는 Javascript를 확장시켜 만든 JSX 라고 불리는 녀석입니다. javascript 안에 마크업을 넣는 것처럼 보입니다. JSX는 아래와 같은 성격을 가집니다. 1. 중괄호 - name 이라는 변수를 중괄호안에 넣어 JSX인 element에 담아서 사용 - JSX 중괄호 안에서는 Javascript 표현식을 모두 사용 가능 const name = 'KHAN'; const element = Hello, {name}; ReactDOM.render( element, document.getElementById('root') ); - 아래와 같이 함수 호출 결과, 객체도 모두 엘리먼트에 포함 가능 function formatName(user) { r..

React.js 를 시작하기에 앞서 다른 언어와 동일하게 Hello World를 출력해봅니다. 준비물 : Atom (선호하는 Editor아무거나 상관없습니다.) 사전지식 : html, css, jacascript (vanilla JS) 1. html 예제 template 작성 2. React script 작성 ReactDOM.render( Hello, world!, document.getElementById('root') ); 3. 전체 코드 및 결과 코드를 찬찬히 보면 react를 CDN 방식으로 불러오고, React를 babel로 빌드시키기 위해 아래 세줄이 들어간 것을 볼 수 있습니다. body 태그안에 있는 div와 script를 자세히보면, "root" 라는 id를 통해서 넘겨 주는것처럼 보입니..

build.gradle plugin, dependencies 등을 정의하여 build 구성을 나열하는 곳이다. 자세한 내용은 What it Gradle? 를 참고하면 좋다. 간단하게 요약하면, Build Automation 을 도와주는 녀석이다. src 폴더 spring boot에서 initializing project 를 진행하면 2개의 폴더가 자동으로 생겨난다. - src/main - src/test main은 말 그대로 현재 프로젝트의 main이 되는 코드를 넣는 곳이고, test에는 프로젝트를 테스트해 볼 수 있는 코드가 담기는 공간이다. main 아래에는 2개의 폴더로 다시 나뉘게 된다. /src/main/java /src/main/resources java에는 java package가 담기게되..

분명 지난주만 해도 빨간줄이 없었는데, 오늘 툴을 켜보니 빨간줄이 마구 그어졌다. 오류코드는 Cannot resolve symbol "SpringApplication" !! 찾아보니 툴에서 CLASSPATH를 제대로 load하지 못했을때 발생할 수 있다고 한다. 툴에서 File -> Invalidate Caches 를 누르고, Invalidate and Restart 버튼을 눌러주면 알아서 툴이 재부팅하게 되고, 정상적으로 동작하게 된다.