거니의 velog

4. 응용 * 지금까지 배운 개념을 응용하여 고정된 배열을 리렌더링하는 것이 아닌, 동적인 배열을 렌더링하는 것을 구현해 보자. 그리고 index 값을 key로 사용하면 리렌더링이 비효율적이라고 배웠는데, 이러한 상황에서 어떻게 고윳값을 만들 수 있는지도 알아보자. 이 절의 실습 흐름은 다음과 같다. (1) 초기 상태 설정하기 * IterationSample 컴포넌트에서 useState를 사용하여 상태를 설정해 보자. 세 가지 상태를 사용할 텐데 하나는 데이터 배열이고, 다른 하나는 텍스트를 입력할 수 있는 input의 상태이다. 그럼 마지막 하나는 무엇일까? 그것은 데이터 배열에서 새로운 항목을 추가할 때 사용할 고유 id를 위한 상태이다. * 배열을 설정할 때, 조금 전에는 단순히 문자열로 이루어진 ..

* CRUD 연습 - http://localhost/board/tag/list.do - http://localhost/board/tag/detail.do - http://localhost/board/tag/form.do -- TagVO를 활용한 Board CRUD 연습 -- 게시판 테이블 작성 create table tagboard( bo_no number(8) not null, bo_title varchar2(300) not null, bo_content varchar2(4000) not null, bo_writer varchar2(300) not null, bo_date date not null, bo_hit number(8) not null, constraint pk_tagboard primary ..

* 웹 애플리케이션을 만들다 보면 다음과 같이 반복되는 코드를 작성할 때가 있다. src 디렉터리에 IterationSample.js라는 파일을 작성해 다음 코드를 따라 한번 적어보자. import React from 'react'; const IterationSample = () => { return ( 눈사람 얼음 눈 바람 ); }; export default IterationSample; * 코드에서 다음 형태가 반복되는 것을 볼 수 있다. ... * 지금은 li 태그 하나 뿐이라 그렇게 문제가 되지는 않을 것 같다. 하지만 코드가 좀 더 복잡하다면 어떨까? 코드양은 더더욱 늘어날 것이며, 파일 용량도 쓸데없이 증가할 것이다. 이는 낭비다. 또 보여 주어야 할 데이터가 유동적이라면 이런 코드로는 절..

package kr.or.ddit.controller.file.item02; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMethod; @Controller @RequestMapping("/item2") public class FIleUploadController02 { /* * 3. 여러 개의 이미지 업로드 * * - 한 번에 여러 개의 이미지를 업로드 하는 파일 업로드 기능을 구현한다. * * # 데이터베이스 만들기 * > item2 테이블을 활용 *..

* 파일 업로드 package kr.or.ddit.controller.file.item01; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; import lombok.extern.slf4j.Slf4j; @Slf4j @Controller @RequestMapping("/item") public class FIleUploadController01 { /* * [ 13장. 파일 업로드 ] * * 1. 파일 업로드 설명 * * - 서블릿 3.0에서 지원하는 파일 업로드 기능과 스프링 웹에서 제공하는 컴포넌트를 사용하여 파일을 업로드 한다. * * # 파일 업로..