Im Bay

Spring boot Directory 환경 src/main/java Controller, Service, Repository, DTO, Entity 등 서버 사이드에서 필요한 자바 클래스 생성 프로젝트 생성 시 만든 package를 기반으로 이후 새롭게 만들어 사용 src/main/resources/static Thymeleaf를 이용하여 웹 애플리케이션에 필요한 이미지, CSS, JS 등 기입 src/main/templates Thymeleaf를 이용하여 개발 시 화면 파일 작성 (JSP 미사용) src/main/webapp/view JSP를 이용하여 개발 시 View에 해당하는 JSP 작성 application.properties 전체 웹 애플리케이션의 환결 설정 Port, DB 등의 정보 pom...

사용자 입력 값으로 배열 추가/삭제 함수 추가 concat 사용 onRegister={onRegister} 으로 적용 후 버튼 클릭시 onRegister(product); 가 실행되도록 const onRegister = (product) => { const newData = products.concat(product); setProducts(newData); }; 입력 완료시 input 입력 박스는 초기화 if (window.confirm("상품을 등록하시겠습니까?")) { onRegister(product); setProduct({ code: ++newCode.current, name: "", price: "", qnt: "", }); 삭제 filter 사용하여 해당 id가 아닌 것들은 거르기 해당 값..

className 안의 특정 태그 스타일 css에서 .클래스이름 태그이름 { … } 형식으로 스타일 주기 ex) .className input { … } 폰트 변경 css 파일에서 @import url(”구글폰트url”); * { font-family: “해당폰트이름”; } 으로 적용 index.css @import url("https://fonts.googleapis.com/css2?family=Hahmlet:wght@100..900&display=swap"); * { font-family: "Hahmlet", serif; font-optical-sizing: auto; font-weight: ; font-style: normal; } 부트스트랩 사용 index.js에 부트스트랩 import 하기 im..

useState() const [변수, set변수] = useState(초기값); 초기값: 정수, “” 등 초기값 배열로 주는것도 가능 const [form, setForm] = useState({ id: 1, name: "홍길동", address: "인천", phone: "032-0101-0202", }); const { id, name, address, phone } = form; 변수와 set변수 사용 가능 비구조 할당 배열 안의 키값들을 키이름으로 바로 사용할 수 있게 할당 태그 안에서 value={code} 이런식으로 사용 가능 const [product, setProduct] = useState({ code: 103, name: "", price: "", qnt: "", }); const { ..

현재 input 창 포커스로 두껍게 하기 useRef() 사용 const refName = useRef(null); 변수 선언 후 refName.current.focus(); 사용하면 해당 input 창이 두꺼워 지면서 포커스된다. id 값 자동 증가시키기 const last = useRef(3); useState 에서 id: last.current 로 주기 메서드에선 last.current++; 로 자동 증감 시키기 정수 초기값 설정 후 상태 변경 useRef 사용 const newCode = useRef(103); 값은 current를 사용하여 가져와야 한다. const [product, setProduct] = useState({ code: newCode.current, 값 증가는 ++ 사용 cod..

반복문으로 값 출력 map과 화살표 함수 사용 (반복문) {배열명.map((변수) ⇒ {변수.키값} … } 형식 반복문으로 Table 생성 map 안의 tr 태그 안에 키값 (유니크한 값) 으로 주기 상품코드 상품이름 상품가격 판매수량 판매금액 {products.map((p) => ( {p.code} {p.name} {p.price} {p.qnt} {p.price * p.qnt} ))}

변수 선언 후 변수명으로 값 출력 let 변수명 = “값”; 태그 안에서 {변수명} 으로 출력 {} 안에서 연산, 조건식(삼항연산자)도 가능 `` 문자열과 변수값 함께 출력 가능 문자열 ${변수명} 형태 ex) alert(이름: ${name}\\n별명: ${nickname}); &&, || && 값이 조건을 만족할 때 출력 {조건식 && “조건 만족시 출력할 값”} 형태 ex) {name === "홍길동" && "홍길동입니다."} || 값이 있으면 해당 변수 출력, 없으면 주어진 값 출력 {변수 || “변수 값이 없으면 출력할 값”} 형태 ex) {nickname || "닉네임이 없습니다."} 이벤트 함수 이벤트로 받는 값을 가져온다. 예시 키보드 입력: e.key 값: e.target.value 함수 ..

오늘은 수업 진도는 나가지 않고 연습문제와 풀이 진행

Spring Boot Devtools Devtools html 파일 저장 시 서버 재시작없이 view 파일 변경 가능 적용 build.gradle - dependencies 안에 아래 코드 추가 developmentOnly 'org.springframework.boot:spring-boot-devtools' preferences - 컴파일러 - 프로젝트 자동 빌드 체크 고급설정 - 컴파일러 - auto-make 허용 체크 우측 상단에 구성 편집 - 옵션 수정 update 작업 시 - 클래스 및 리소스 업데이트 프레임 비활성화 시 - 클래스 및 리소스 업데이트 application.properties 안에 아래 코드 추가 spring.devtools.restart.enabled=true spring.thy..

builder로 값 넣기 builder().build()로 List에 값 넣기 이전 방식은 new 인스턴스 생성후 setter로 값 넣기였지만, builder로 값을 넣을 수 있다. (가독성 더 좋아짐) 클래스명 변수명 = 클래스명.builder().변수명(값).build(); 형태 그 이전에 먼저 해당 엔티티 클래스에는 @Builder 어노테이션을 줘야한다. 예시 @Data @Builder public class Member { private String username; private String password; private String email; private LocalDate joindate; } 이후 컨트롤러에서 메서드에 builder() 코드 추가 예시 Member member1 = Me..