본문 바로가기
반응형

전체 글266

DB의 Board 생성 API 작성 Request와 Response 시 json으로 데이터를 주고받게 되는데 자바에는 json 데이터 타입을 지원하지 않는다. 따라서 json과 매핑할 수 있는 객체를 생성해야 하는데 그것을 DTO, VO라고 한다. DTO : Data Transfer Object VO : Virtual Object json과 java의 객체간의 매핑을 위한 jackson mapper 라는 써드파티 라이브러리가 필요하다. 따라서 보드 테이블의 데이터를 저장할 VO객체를 생성해야 한다. BoardVO Domain 디렉토리와 BoardVO 객체를 생성한다. import com.fasterxml.jackson.annotation.JsonInclude; import lombok.Data; @JsonInclude(JsonInclude.. 2021. 5. 12.
Spring과 DB연동 이곳에서는 Docker을 통한 MariaDB를 선행적으로 구현하였다. Mybatis를 통해 연동하는 방법이다. build.grandle에 dependencies를 수정해준다. dependencies { implementation 'org.springframework.boot:spring-boot-starter-web' compileOnly 'org.projectlombok:lombok' compile("org.springframework.boot:spring-boot-starter-jdbc") compile("org.mybatis.spring.boot:mybatis-spring-boot-starter:1.3.1") runtime("mysql:mysql-connector-java") annotationPr.. 2021. 5. 11.
Create 구현 - Mode 전환 Link 사용시 주의할점 사용자들이 페이지에 방문하기 위해 미리 방문을 해두는 소프트웨어를 가지고 있다면, delete 부분도 미리 로드되어 삭제가 될 수 있다. 따라서 delete는 Link보다는 button을 사용하여 Operation 개념으로 사용하여야 한다. 새로운 Control.js 생성 App.js의 EventHandler 생성 따라서 Control.js를 적절히 수정해주었다. 중간결과 이제는 mode의 실제 기능을 추가해 보겠다. 기존의 content.js를 ReadContent.js로 변경하였다. 또한 Create 기능을 구현하기 위한 CreateContent.js를 생성하였다. 추가적으로 App.js를 수정하였다. 2021. 5. 10.
Props & State 의 차이 Props : 상위 컴포넌트 > props > 하위 컴포넌트 상위 컴포넌트는 하위 컴포넌트에게 props를 통해 값을 전달해 내부의 state를 바꾸기 때문에 컴포넌트 스스로 외부에서 전달되는 props를 변경하는 것은 금지되어 있다. State : 하위 컴포넌트 > 이벤트 실행 > 상위 컴포넌트의 state 호출 > state 값 수정 하위 컴포넌트가 상위 컴포넌트를 동작시키려면 props를 전달하는 것이 아니라 상위 컴포넌트 안에 이벤트를 심고 그 안에 setState로 값을 바꿔야 한다. 2021. 5. 4.
컴포넌트 이벤트 생성 Subject 컴포넌트 수정 - 대상 컴포넌트에 onChangePage 함수를 사용한다. - onChangePage를 실행시키는 메소드를 대상 컴포넌트에 사용한다. App.js에서 render()의 Subject 부분 Subject.js에 onChangePage를 아래와 같이 만든다. class Subject extends Component{ render(){ return ( {this.props.title} {this.props.sub} ); } } TOC 컴포넌트 수정 App.js에서 render()의 TOC부분 TOC.js의 list 부분 lists.push({data[i].title}); 을 다음과 같이 수정 lists.push( {data[i].title} ); 위와 같이 바꾸었다면 Web 버튼.. 2021. 4. 30.
Event 2. Bind & setState Bind - 위 예를 보면 bindTest() 함수는 아무 출력 결과물이 없다. - 하지만 bind를 사용하면 강제로 bindTest에 인자를 집어넣어 준다. - 따라서 위와같이 bindTest2는 egoing이 출력되는것을 볼 수 있다. - funcname.bind(this) = component 자체를 가리켜 함수 안으로 주입해 준다. setState - 생성자(constructor)에서 선언하는 것은 기존에 하던 방식으로 선언하면 된다. - 하지만 컴포넌트가 생성이 끝난 다음에 동적으로 변경할때에는 기존의 방식으로 하면 바뀌지 않는다 예) this.state.mode = 'welcome' - this.setState({mode:'welcome'}) 을 사용해야 정상적으로 작동한다. 2021. 4. 30.
Batch Normalization 2 & Well - Known Models & Recurrent Neural Network Normalization - 정규화 되지 않은 데이터는 원하는 값을 찾는데에 X, Y 축이 다른 분포를 가지지 때문에 각각의 반영이 다르게됨. - 정규화가 된 데이터는 같은 분포를 가지기에 원하는 값을 빨리 도출함. Batch Normalization - 배치는 샘플들의 묶음. - 한 레이어를 통과했을때 같이 존재하는 샘플들을 평균내는것. - 한 배치에 들어있는 한 픽셀의 평균값 - x = sample (ex : MNIST = 28*28 이미지. 이미지 하나당 차원 = 784, ) - 각 픽셀당 표준편차. - 위 두 식은 이미지와 차원이 같음. - 위 두 식은 배치마다 새로운 값들이 형성이됨 - 정규화 식. - 정규화 식에 새로운 Distribution으로 변경. - 베타, 감마를 통해 학습시키는 식. .. 2021. 4. 28.
Event - 링크를 클릭하면 다른 메시지가 출력되도록 함. - React 에서는 Props나 State값이 바뀌면, 그 state를 가지고 있는 컴포넌트의 render 함수가 다시 호출된다. - 아래는 event의 설치와 event의 기본적인 동작을 방지하는 code 이다. //App.js 중에서 render() render() { console.log('App render') var _title, _desc = null; if (this.state.mode === 'welcome'){ _title = this.state.welcome.title; _desc = this.state.welcome.desc; } else if (this.state.mode === 'read'){ _title = this.state... 2021. 4. 27.
State 개발 State 제품을 조작하는 입장과 구현자의 입장이 있다. Props : 부모 컴포넌트가 자식 컴포넌트에게 주는 값. 읽기 전용 State : 컴포넌트 내부에서 선언하며 내부에서 값 변경을 가능. 컴포넌트 내부적으로 사용하는 정보. 예를들면 제품의 전선 등 밖에서 보여서 안되는 물건을 뜻한다. 첫번째로 어떠한 컴포넌트가 실행 될 때 render 함수보다 먼저 실행되면서 컴포넌트를 초기화 시켜주고 싶은 코드는 constructor(props){ super(props); } 해당하는 코드블럭 안에 작성한다. App.js의 state로 선언된것을 하위 props에서 불러오는것은 아래 코드처럼 가능하다. class App extends Component { constructor(props){ super(props.. 2021. 4. 26.
반응형