목록2019/11/18 (2)

아무거나

[reactjs] React Base - 2 (Component)

컴포넌트 리액트의 필요성 설명하기전에 앞서 아래 시멘틱 태그가 정의된 html 코드를 참고하자. 시멘틱 태그: HTML5의 스펙이며 header, footer 태그와 같은 부분을 의미론적으로 적용할때 사용 public/ 경로에 example.html 라는 파일을 생성하여 코드를 아래와 같이 작성하자. WEB Page Hello HTML React Javascript WEB page 2 Hello Example. 만약 위의 태그별로 백만줄 또는 천만줄 이상이라고 생각해보자. 그러면 한 눈에 코드가 보이지 않기 마련이다. 그렇게 된다면 해당 줄이 긴 태그를 감추고 사용자 정의 태그로 나타낸다면 웹 페이지에서는 긴 태그가 모두 표시되겠지만 우리눈에는 사용자 정의 태그로 한 눈에 깔끔하게 보이게 될 것이다. (..
Javascript & HTML & CSS/reactjs 2019. 11. 18. 23:58
[reactjs] React Base - 1 (프로젝트 구성)

React 해당 샘플코드는 github에 제공되어 있습니다. 샘플코드 바로가기 React? facebook.com의 UI를 더 잘만들기 위해서 facebook에서 만든 javascript UI 라이브러리 공식 홈페이지 운영체제: 윈도우10 IDE: VS Code Component? 복잡한 코드를 사용자 정의 태그를 이용하여 편리하게 사용할 수 있다.(=component) 즉, 한번 정의해놓으면 여러곳에서 재사용할 수 있다. Component 장점 가독성 재사용성 유지보수 개발환경(CMD) NPM: Nodejs로 만들어진 프로그램을 쉽게 설치하게 해주는 일종의 앱스토어 https://nodejs.org/en/ 접속하여 설치한다. 설치여부 확인 // npm 설치여부 확인(버전 정보가 나오면 설치가 완료된것이..
Javascript & HTML & CSS/reactjs 2019. 11. 18. 23:56
Prev 1 Next