rhanziy

Model은 수집된 데이터 외에 보여주고 싶은 데이터를 view로 전달 @ModelAttribute("") 파일 업로드 STEP1. commons-fileupload 라이브러리 추가 commons-fileupload commons-fileupload 1.3.3 STEP2. C드라이브에 upload/tmp(임시업로드폴더) 생성 STEP3. servlet-context.xml에 CommonsMultipartResolver클래스의 빈과 빈 속성을 등록 절대경로로 지정할때는 file:/를 붙인당 STEP4. Controller에서 파일 업로드 화면 처리 @GetMapping("/upload") public String upload() { log.info("File Upload......................

※ 스프링의 주요 특징 1. POJO기반의 구성(Plain Old Java Object) 2. 의존성 주입(DI: Dependency Injection)을 통한 객체간의 관계 구성 : 필요한 객체를 외부에서 밀어 넣는다. 3. AOP(Aspect Oriented Programming: 관점 지향 프로그래밍) 지원 : 횡단 관심사(반드시 필요한 기능)를 모듈로 분리하는 패턴프로그래밍이다. 4.MVC(Model-View-Controller)구조 의존성 주입 테스트 1. 레스토랑: 셰프 객체에 의존적이다. => 셰프 객체를 의존성 주입해야한다. 생성자, setters메서드. 2. 셰프 pom.xml에 // 기존에있는 junit 밑에 test를하기위한 외부객체 DI한당. org.springframework sp..

클래스 명명규칙 1. 프리젠테이션: XxxController 2. 비즈니스: XxxService 인터페이스, XxxService 인터페이스를 구현한 XxxServiceImpl 클래스 3. 퍼시스턴스: MapperXxx 인터페이스, MapperXxx XML 4. 데이터: XxxVO, XxxDTO 패키지명명규칙 1. 컨트롤러: xxx.xxx.controller 2. 비즈니스: xxx.xxx.service 3. 퍼시스턴스: xxx.xxx.persistence 4. 데이터: xxx.xxx.domain pom.xml 버전설정, 추가di 1.8 버전수정, artifactId에 javax추가 0 ]]> —---------------------------------------------------------------..

HTML 삽입 미리보기할 수 없는 소스 Axios는 브라우저, Node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리이다. 쉽게 말해서 백엔드랑 프론트엔드랑 통신을 쉽게하기 위해 Ajax와 더불어 사용한다. 이미 자바스크립트에는 fetch api가 있지만, 프레임워크에서 ajax를 구현할땐 axios를 쓰는 편이라고 보면 된다 출처: https://inpa.tistory.com/entry/AXIOS-📚-설치-사용 [👨‍💻 Dev Scroll:티스토리] axios를 이용해 영화정보 api사이트에서 데이터를 받아오는 hook을 짰다. refetch 버튼 클릭 시 setTrigger가 발동되고 useEffect의 두번째인자에 trigger를 지정해 새로운 데이터를 받아오는 기능도..

const useConfirm = (message = "", onConfirm, onCancel) => { if ( !onConfirm && typeof onConfirm !== "function") { return; } if ( onCancel && typeof onCancel !== "function") { return; } const confirmAction = () => { if (window.confirm(message)) { onConfirm(); } else { onCancel(); } }; return confirmAction; }; export default function App() { const deleteWorld = () => console.log("Deleting the worl..

import "./styles.css"; import React, { useState, useRef, useEffect } from "react"; const useClick = (onClick) => { if (typeof onClick !== "function") { return; } const element = useRef(); useEffect(() => { if (element.current) { element.current.addEventListener("click", onClick); } return () => { if (element.current) { element.current.removeEventListener("click", onClick); } }; }, []); return el..

HTML 삽입 미리보기할 수 없는 소스 Array.isArray(obj) // 배열인지 아닌지 확인하는 함수. true false를 리턴 useState활용법으로 useTabs를 만들어보았다. 버튼에 따라 노출되는 내용을 다르게 지정하는 기능의 함수... 배열의 인덱스 번호를 useState로 넘겨서 return값을 그에 맞는 컨텐츠로 뿌려주기! 파라미터 값을 통해 여기저기 호출하다보니 기존에 하던 방식보다 복잡해서 더 분석이 필요할 것 같다.

리액트로 작업한 결과물을 내 깃허브 레포지토리에 올리는 방법. 1. 콘솔창에 npm i gh-pages 2. npm run build >> 하면 build폴더가 생성된다. 3. pakage.json 파일 "scripts" 에 2줄 추가 4. pakage.json 파일 맨 아래에 깃허브 page url 추가 (여기서 원격저장소 등록을 미리 해야한다.) 5. npm run deploy >> predeploy가 먼저 실행된다. 업로드 완료 추가/수정할때마다 npm run deploy를 하면 된다! ++ React router 6버전이상에서 작업했다면 App.js에서 Route path={`${process.env.PUBLIC_URL}/`} element={} path를 추가해주기.