본문 바로가기
반응형

분류 전체보기266

Component를 파일로 분리하기 이전에 컴포넌트들을 App.js에 모두 집어너었다. 이런 방식이면 다른곳에서 필요할 때 사용하기 어렵기 때문에 컴포넌트를 따로 파일로 분류시키고자 한다. App.js에 있던 class를 파일화 시켜주기 위해 새로운 TOC.js라는 파일을 생성한다. 이 뒤에 TOC.js에 컴포넌트를 사용하기 위한 class 를 import 해주어야 한다. import React, {Component} from 'react'; 가져올 컴포넌트 클래스를 복사한 후 마지막엔 외부에서도 사용 가능하게 하기 위한 코드를 삽입한다. export default TOC; 분리한 TOC.js의 모습은 아래와 같다. import React, {Component} from 'react'; class TOC extends Component {.. 2021. 4. 25.
Props & React Developer Tools Props 전 시간에서 class 를 왼쪽과 같이 작성한다면, 계속 똑같은 내용밖에 출력하지 못한다. 똑같은 컴포넌트가 필요한 경우는 유용하게 사용할 수 있지만, 구조만 같고 다른 내용이 필요할 땐 유용하지 못하다. 따라서 Props 기능을 이용해 효율적으로 사용할 수 있다. 위와같이 한다면 페이지는 아래와 같이 변화하게 된다. React Developer Tools 웹페이지에서 Elements 로 웹페이지를 확인 시, React로 구성한 class를 확인할 수 없는 불편함이 있다. 아래의 크롬 확장프로그램을 설치한다면, React로 구성된 class를 확인할 수 있다. React Developer Tools Adds React debugging tools to the Chrome Developer To.. 2021. 4. 24.
Component 작성 아래는 일반적인 HTML 코드 이다. WEB world wide web! > HTML CSS JavaScript HTML HTML is HyperText Markup Lang. > > 컴포넌트를 만들기 위해 App.js의 class를 다루면 될 것이다. - 이 class 는 component를 상속받아 동작하는 클래스이다. - 자바스크립트의 최근 버전에서는 class 안에 있는 function은 function을 적지 않고 사용한다. - 컴포넌트는 반드시 하나의 최상위 태그로 시작해야 한다. React가 컴포넌트화 된 것을 자동으로 웹브라우저가 인식할 수 있는 코드로 바꾸어 준다. - 웹 브라우저는 React의 존재를 모른다고 생각해도 된다. - console 에서 class를 실행시켜 보면 문법 오류가.. 2021. 4. 24.
CSS 수정 및 배포 CSS 수정 index.js 파일을 보면 index.css 파일을 import 한것을 볼 수 있다. index.css 파일에서 css파일을 수정할 수 있다. 배포 개발환경을 실행시킬 때 쓴 커맨드 npm run start Production 모드의 앱을 만들때 (Build) npm run build 위 동작을 수행한다면, build 폴더에 index.html 파일이 새로 생긴다. 이 파일은 개발환경때 쓴 파일보다 큰 차이로 용량이 줄어든다. 이 파일은 실제로 서비스 할 때 사용 할 수 있는 html을 만들어주는 커맨드이다. 2021. 4. 24.
Batch Normalization & Overfitting & HyperParameter Batch Normalization - 각각의 layer 마다 평균과 표준편차를 다시 구한다. - BN을 적용한다면, W1 후의 Layer의 입력값이 균등하지 않아도, 균등하게 해주는 역할을 함. - 초기값 W에 따른 여러 그래프 - 초기값을 잘못 설정한 W라도 BN를 통해 옳바른 값을 찾아가는것을 볼 수 있음. Overfitting 분류문제 - Training Set에 과하게 학습되는것. - 제한된 데이터에만 정확하게 맞는것을 의미함. - Model의 Parameter 개수가 많을때와 Data가 적을때 이 현상이 일어난다. - 추가적으로 Underfit 이란, 데이터의 특성을 완전히 잡아내지 못한것을 의미한다. Overffting 방지법 Regularization - Loss 함수에 새로운 항을 붙인다.. 2021. 4. 23.
Initialization 2 Weight의 초기값을 설정해 주는 것이다. 각 가중치들의 편차와 초기값들, 활성함수에 따라서 Update 값이 달라진다. 예를들어 위의 활성함수는 높은 초기값을 가진다면, 미분을 해도 값의 변화가 미미하게 된다. 시그모이드에서 값들의 표준편차가 1인경우 미분값들이 작기 때문에 값들의 학습이 되지 않은 것을 볼 수 있다. 시그모이드에서 값들의 표준편차가 0.01인 경우 미분값들이 매우 밀접하게 붙어있기 때문에 모든 레이어의 값이 동일하고, NN의 표현력을 제한하게 된다. 시그모이드에서 Xavier 초깃값 표준편차가 0.01인 경우 전부 0으로 수렴하고 있음. Xavier 초깃값을 사용한 경우 레이어마다 분포도가 다르기 때문에, 각 레이어 마다 특징들이 달라질 수 있음. He 초깃값을 사용한 경우 전부 균.. 2021. 4. 22.
반응형