첫번째로 npm에 install 문제가 생겼다.npx create-react-app .npm init react-app my-appNeed to install the following packages:create-react-app@5.0.1Ok to proceed? (y) y 오류를 보니 package.json에서 React 19.x를 사용하려고 시도하지만, @testing-library/react가 React 18.x를 요구하고 있어서 호환되지 않는다.Installing template dependencies using npm...npm error code ERESOLVEnpm error ERESOLVE unable to resolve dependency treenpm errornpm error Whi..

1. 기존기존 브라우저 GET : 요청정보를 URL에 담아서 HTML문서를 주세요.POST : 요청정보를 패킷에 담아서 HTML문서를 주세요.VS REST : 자원을 이름으로 구분하여 해당 자원의 상태를 주고 받으며 mustache가 필요없다.GET : 자원의 정보를 조회해주세요.POST : 자원을 생성해주세요.PUT, PATCH : 자원을 줄테니 업데이트해주세요. (PUT: 본문 전체, PATCH:일정 요소만) DELETE : 자원을 삭제해주세요 - 장점 API서버는 세션, 쿠키를 사용하지않고 API요청만 단순히 처리한다. 별도의 인프라 구축이 필요 없다.HTTP 표준만 지키면 모든 플랫폼에서 사용이 가능하다. - 단점표준 자체가 존재하지 않아 정의가 필요하다.HTTP Method 형태가 제한적이다.(..

- error/error.mustache{{>layouts/header}} 에러가 발생했습니다! 요청 경로 : {{path}} 에러 코드 : {{status}} 에러 메시지 : {{message}} {{>layouts/footer}} - NewsController.Java로 예외처리 넘기기 News news = newsRepository.findById(newsId) .orElseThrow(() -> new ResponseStatusException(HttpStatus.NOT_FOUND, "해당 게시글이 존재하지 않습니다.")); - advice/GlobalExceptionHandler.Java@Con..

1. Delete - detail.mustacheDelete - NewsController.class @GetMapping("/{newsId}/delete") public String deleteNews(@PathVariable("newsId") Long newsId){ newsRepository.deleteById(newsId); return "redirect:/news/list"; }  2. Edit 2-1. id로 데이터를 form에 가져오기- detail.mustacheEdit - NewsController.class @GetMapping("/{newsId}/edit") public String editNewsForm(@PathVariable(..

- 참조 링크https://docs.spring.io/spring-data/jpa/reference/jpa/query-methods.html JPA Query Methods :: Spring Data JPABy default, Spring Data JPA uses position-based parameter binding, as described in all the preceding examples. This makes query methods a little error-prone when refactoring regarding the parameter position. To solve this issue, you can use @Param annotatidocs.spring.io - repository..

Get started with Bootstrap · Bootstrap v5.3 Get started with BootstrapBootstrap is a powerful, feature-packed frontend toolkit. Build anything—from prototype to production—in minutes.getbootstrap.com 1. Header, Footer 만들기 1-1. 파일 설정resources/application.ymlserver: servlet: encoding: force-response: true  1-2. mustache 설정- header.mustache News Site ..

1. SPRING 3요소Spring은 자바 엔터프라이즈 기술을 사용함Spring Framework : 클래스의 인스턴스를 생성하여 의존성 주입Spring Container : 스프링에서 자바 객체들을 관리하는 공간Bean : Spring에 생성되고 관리되는 자바 객체기본적으로 객체 인스턴스를 싱글톤(클래스의 인스턴스 딱 1개만 생성됨)으로 관리 Controller : 사용자의 요청을 받아 결과를 뷰나 response로 전달Service : 요구 사항을 처리하는 비지니스, 서비스 로직을 작성Repository : DB를 통신@Auowired : 의존성 주입이 쉽고 참조 관계를 눈으로 확인하기 어렵다. src/main/javajava만 넣는 곳@SpringBootApplication이 있는 곳으로 실행pac..

1. 아래 사이트 들어가기https://start.spring.io/ 2. Spring Initializr원하는 설정을 지정 후 GENERATE버튼 누르기 - 저장된 ZIP파일 풀기- intellj에서 project 열기 3. 셋팅하기 - 라이브러리 다운로드밑에 사이트에서 라이브러리 검색 후 다운로드https://mvnrepository.com/dependencies { implementation 'org.springframework.boot:spring-boot-starter-web' compileOnly 'org.projectlombok:lombok' runtimeOnly 'com.h2database:h2' developmentOnly 'org.springframework.boot:spring-boo..

- CSS 선택자type선택 : p, h1, div 등모두선택 : *id : #class : .속성선택 : [type="text"] 👉🏻 ~=포함, ^= 시작, $=끝, *=어디든결합자자식 선택 : div > p자손들 선택 : div p바로 다음 형제 선택 : h1 + p다음에 있는 모든 형제 선택 : h1 ~ p가상 클래스 : :hover, :focus, :active, :nth-child(n), :first-child, :last-child가상 요소 : ::before, ::afterm ::selection, ::first-line, ::first-letterid는 이 요소만 적용class는 중복 및 모든 요소에 적용 가능 빨간색 큰 글꼴 큰 글꼴에 빨간색 아이디를 적용 ..