목록분류 전체보기 (168)
쌩로그
목록 포스팅 개요 본론 2-1. 요구사항 분석 2-2. 상품 도메인 개발 2-3. 상품 서비스 HTML 2-4. 상품 목록 - 타임리프 2-5. 상품 상세 2-6. 상품 등록 폼 2-7. 상품 등록 처리 - @ModelAttribute 2-8. 상품 수정 2-9. PRG Post/Redirect/GET 2-10. RedirectAttribute 요약 1. 포스팅 개요 인프런에서 영한님의 스프링 MVC 1편 Section 07. 스프링 MVC - 웹 페이지 만들기를 학습하며 정리한 포스팅이다. 프로젝트를 생성하는데, 프로젝트 생성 부분은 생략했다. build.gradle만 올리고, 이후 강의 내용부터 정리한다. 참고로 강의는 2.x대 부트지만, 필자는 그냥 3.x 사용한다. 만드는 건 3.x 밖에 못 만든..
목록 포스팅 개요 본론 2-1. 로깅 간단히 알아보기 2-2. 요청 매핑 2-3. 요청 매핑 - API 예시 2-4. HTTP 요청 - 기본, 헤더 조회 2-5. HTTP 요청 파라미터 - 쿼리 파라미터, HTML Form 2-6. HTTP 요청 파라미터 - @RequestParam 2-7. HTTP 요청 파라미터 - @ModelAttribute 2-8. HTTP 요청 메시지 - 단순 텍스트 2-9. HTTP 요청 메시지 - JSON 2-10. 응답 - 정적 리소스, 뷰 템플릿 2-11. HTTP 응답 - HTTP API, 메시지 바디에 직접 입력 2-12. HTTP 메시지 컨버터 2-13. 요청 매핑 핸들러 어댑터 구조 요약 1. 포스팅 개요 인프런에서 영한님의 스프링 MVC 1편 Section 06 ..
목록 포스팅 개요 본론 2-1. 라이프사이클 메서드의 이해 2-2. 라이프사이클 메서드 살펴보기 2-3. 라이프사이클 메서드 사용하기 요약 1. 포스팅 개요 해당 포스팅은 리액트를 다루는 기술의 07장 컴포넌트의 라이프사이클 메서드 를 학습하며 정리한 포스팅이다. 2. 본론 모든 리액트 컴포넌트에는 라이프사이클(수명 주기)이 존재한다. 컴포넌트의 수명은 페이지에서 렌더링되기 전인 준비 과정에서 시작하여 페이지에서 사라질 때 끝난다. 컴포넌트를 처음으로 렌더링할 때 어떤 작업을 처리해야 하거나, 컴포넌트를 업데이트하기 전후로 어떤 작업을 처리해야 할 수도 있고, 또 불필요한 업데이트를 방지해야 할 수도 있다. 이때는 컴포넌트의 라이프사이클 메서드를 사용한다. 참고로 라이프사이클 메서드는 클래스형 컴포넌트에..
목록 포스팅 개요 본론 2-1. 자바스크립트 배열의 map() 함수 2-2. 데이터 배열을 컴포넌트 배열로 변환하기 2-3. key 2-4. 응용 요약 1. 포스팅 개요 해당 포스팅은 리액트를 다루는 기술의 06장 컴포넌트 반복 을 학습하며 정리한 포스팅이다. 2. 본론 웹 애플리케이션을 만들다 보면 다음과 같이 반복되는 코드를 작성할 때가 있다. import React from "react"; const IteratorSampleOfSample = () => { return ( 눈사람 얼음 눈 바람 ); }; export default IteratorSampleOfSample; 코드에서 다음 형태가 계속 반복되는 것을 볼 수 있다. ... 만약 코드가 좀 더 복잡하다면, 코드양이 늘어날 것이며, 파일 ..
목록 포스팅 개요 본론 2-1. ref는 어떤 상황에서 사용해야 할까? 2-2. ref 사용 2-3. 컴포넌트에 ref 달기 요약 1. 포스팅 개요 해당 포스팅은 리액트를 다루는 기술의 05장 ref: DOM에 이름 달기 을 학습하며 정리한 포스팅이다. 2. 본론 일반 HTML에서 DOM 요소에 이름을 달 때는 id를 사용한다. 특정 DOM 요소에 어떤 작업을 해야할 때 이렇게 요소에 id를 달면 CSS에서 특정 id에 특정 스타일을 적용하거나 자바스크립트에서 해당 id를 가지 요소를 찾아서 작업할 수 있다. src/index.js 파일 중에는 id가 root인 요소에 리액트 컴포넌트를 렌더링하라는 코드가 있다. const root = ReactDOM.createRoot(document.getElemen..
목록 포스팅 개요 본론 2-1. 리액트의 이벤트 시스템 2-2. 예제로 이벤트 핸들링 익히기 2-3.함수형 컴포넌트로 구현해보기 요약 1. 포스팅 개요 해당 포스팅은 리액트를 다루는 기술의 04장 이벤트 핸들링 을 학습하며 정리한 포스팅이다. 2. 본론 사용자가 웹 브라우저에서 DOM 요소들과 상호 작용하는 것을 이벤트(event)라고 한다. 예) 버튼에 마우스 커서를 올렸을 때는 onmouseover 마우스를 클릭했을 때는 onclick Form 요소의 값이 바뀔 때 onchange 2-1. 리액트의 이벤트 시스템 리액트의 이벤트 시스템은 웹 브라우저의 HTML 이벤트와 인터페이스가 동일하기 때문에 사용법이 꽤 비슷하다. 사용법은 HTML에서 이벤트를 작성하는 것과 비슷한데, 주의해야 할 몇 가지 사항..
목록 포스팅 개요 본론 2-1. 스프링 MVC 전체 구조 2-2. 핸들러 매핑과 핸들러 어댑터 2-3. 뷰 리졸버 2-4. 스프링 MVC - 시작하기 2-5. 스프링 MVC - 컨트롤러 통합 2-6. 스프링 MVC - 실용적인 방식 요약 1. 포스팅 개요 인프런에서 영한님의 스프링 MVC 1편 Section 05 스프링 MVC - 구조 이해를 학습하며 정리한 포스팅이다. 직접 MVC를 만든 것과 스프링 MVC의 구조를 비교해볼 것이다. 2. 본론 2-1. 스프링 MVC 전체 구조 다음은 직접 만든 MVC와 스프링 MVC의 구조다. 직접 만든 MVC 스프링 MVC 보면 그냥 똑같다. 이름에서 차이는 있겠지만, 구조는 똑같다. 직접 만든 MVC의 요소와 매핑되는 스프링 MVC의 요소는 다음과 같다. Fron..
목록 포스팅 개요 본론 2-1. 문제 인식 배경  2-2. 문제 발생의 원인 2-3. 문제 발생을 일으키게 된 이유 요약 1. 포스팅 개요 해당 포스팅은 제목과 같이 JPA Entity에서 외래 키와 참조를 맺는 @JoinColumn 애너테이션에 대한 오개념을 바로잡기 위한 포스팅이다. 2. 본론 2-1. 문제 인식 배경 현재 회사에서 진행 중인 프로젝트는 여러 사용자가 하나의 데이터에 접근해서 수정할 수도 있고, 삭제할 수도 있다. 즉, A 사용자가 생성하고 B 사용자가 수정했다가 C 사용자가 삭제할 수도 있는 구조다. (사내 서비스라 요구사항이 이렇다.) 따라서 학습차원에서 했던 프로젝트처럼 어떤 게시물에 대해서 작성자만 접근할 수 있는 구조가 아니라서 생성날짜 및 수정날짜보단 누가 데이터를 ..
목록 포스팅 개요 본론 2-1. 클래스형 컴포넌트 2-2. 첫 컴포넌트 생성 2-3. props 2-4. state 2-5. state를 사용할 때 주의 사항 요약 1. 포스팅 개요 해당 포스팅은 리액트를 다루는 기술의 03장 컴포넌트 를 학습하며 정리한 포스팅이다. 2. 본론 컴포넌트의 기능은 단순한 템플릿 이상이다. 데이터가 주어졌을 때 이에 맞추어 UI를 만들어 준다. 라이프 사이클 API를 이용하여 컴포넌트가 화면에서 나타날 때, 사라질 때 등 변화가 일어날 때 주어진 작업들을 처리할 수 있다. 임의 메서드를 만들어 특별한 기능을 붙여줄 수 있다. 2-1. 클래스형 컴포넌트 컴포넌트를 선언하는 방식은 두 가지이다. 함수형 컴포넌트. 클래스형 컴포넌트 import '../ClassInstea..
목록 포스팅 개요 본론 2-1. 프론트 컨트롤러 패턴 소개 2-2. 프론트 컨트롤러 도입 - v1 2-3. View 분리 - v2 2-4. Model 추가 - v3 2-5. 단순하고 실용적인 컨트롤러 - v4 2-6. 유연한 컨트롤러1 - V5 2-7. 유연한 컨트롤러2 - V5 요약 1. 포스팅 개요 인프런에서 영한님의 스프링 MVC 1편 Section 04 MVC 프레임워크 만들기를 학습하며 정리한 포스팅이다. 2. 본론 2-1. 프론트 컨트롤러 패턴 소개 프론트 컨트롤러 도입 전 프론트 컨트롤러 도입 전에는 다음과 같았다. 공통로직을 타고, 컨트롤러를 타게 했었다. 프론트 컨트롤러 도입 후 프론트 컨트롤러를 도입하면 다음과 같아진다. FrontController 패턴 특징 프론트 컨트롤러 서블릿 하..