개발블로그by페페

단 하나의 맥락 : 최신글의 번호를 마지막 번호로 잡아서, 다른 페이지에도 번호 리셋 없이 이어가게 하기 Semiflow Bundle : 게시물 번호 공식 만들기 : question_list.html에 적용하기 자각 (일련번호) = (전체 게시물 갯수) - (현재 페이지) * (페이지당 게시물 갯수) - (나열 인덱스) > question_list.html에서 적용 for 문 안의 게시물 순서 (나열 인덱스는 현재 페이지에서 표시할 수 있는 게시물의 인덱스이므로 10개를 표시하는 페이지에서는 0~9, 2개를 표시하는 페이지에서는 0~1로 반복된다.)

단 하나의 맥락 : questionList를 부분 로드함으로써, 가독성 강화 Semiflow Bundle - 대량 테스트 데이터 만들기 - 변수를 questionList에서 paging으로 변경 - 템플릿에 페이지 이동 기능 구현하기 - 페이지 리스트 - 작성일시 역순으로 조회 테스트 데이터 작성하기 위해 > sbbApplicationTest.java에서 - OS : for (int i = 1; i QuestionRepository에서 Page findAll(Pageable pageable); 선언 // import org.springframework.data.domain.Page; // import org.springframework.data.domain.Pageable; - > QuestionServ..

단 하나의 맥락 : 공통 단인 layout에서 navigation-bar 사용 Semiflow Bundle : layout.html에 버튼 구현 : Bootstrap.min.js 사용하여 클릭 후 반응형 기능 구현 : 로 fragment 분리 자각 버튼 구현을 위해 > layout.html에 - 내부 로 네비게이션 포맷을 잡고 - SBB - - 내부에 - 내부에 - 내부에 - 내부에 - 로그인 - 자바스크립트를 인식하게 하기 위해 - bootstrap.min.js > static에 넣는다 - 를 헤드단에 넣는다 - 외부 템플릿 fragment로 사용하기 위해 > navbar 새로 작성 - 기존 최상단 틀에 - th:fragment="navbarFragment" 만 간단히 추가 > layout.html 바..

웹 프로그래밍은 > URL을 기준으로 작동한다 - URL의 접근은 > 주소 입력 접근 링크를 통한 접근 (자동 변수 설정의 접근) 버튼을 통한 Post의 접근(redirect로 금방 사라짐) - 경로인 URL과 화면인 template을 Mapping > @RequestMapping("URL") - @RequestParam String content > web 화면에서 input을 받아, Method signal로 전달하는 것(작업 처리의 용도) - @PathVariable("id") Integer id > URL 경로에서 input을 받아, Method signal로 전달하는 것(작업 처리의 용도) - Model model > 서비스에서 DB 데이터 조회 후, template에 전달하는 것(띄우는 용도)..

redirection 문자열 출력(ResponseBody) template 출력

단 하나의 맥락 : 중복 템플릿 P/I 블록으로 사용 Semiflow Bundle : 오류 메세지 공통 템플릿 작성 후 fragment로 바꾸어 준다 : question_form.html에 적용 : question_detail.html에 적용 자각 - 공통 부분인 의 class 앞에 - th:fragment="formErrorsFragement" 를 넣어준다 - 각기 템플릿에 로 적용한다 - 앞은 fragment가 담긴 html 템플릿이며, 뒤는 fragment 이름이다

단 하나의 맥락 : @GetMapping으로 질문 등록 버튼 및 형식 구현, Validation Form으로 양식 제한 Semiflow Bundle - 질문 등록 버튼을 만들고, 이어지는 question/create URL을 컨트롤러에 매핑한다 - question_form.html 템플릿을 작성하고, 컨트롤러에서 Post 방식을 처리할 수 있도록 메소드를 추가한다(오버로딩) - 메소드를 추가하는 과정에서, QuestionService에 create 메소드를 추가한다 - gradle에 validation을 설치하고 form class를 작성한다 - QuestionController에 Validation Session을 추가하고 - question_form.html이 오류 메세지를 출력할 수 있도록 추가 -..

단 하나의 맥락 : 표준 Html 구조로 템플릿 형식 통일, block P/I로 변하는 부분만 작성 - Semiflow Bundle - 표준 html 구조 확인 - 표준 layout.html 작성 - 기존 템플릿에서 개별 적용되던 CSS를 제거하고, P/I가 될수 있도록 수정 - 자각 표준 html 구조를 - layout.html에 신규 작성한다 - html 양식을 넣고 - 헤드에는 메타 태그, 부트스트랩 CSS, 일반 CSS 등을 넣고 - 바디는 을 넣어, 이 부분에 기 템플릿을 삽입할 수 있도록 한다 기 template과 연동하기 위해 - question_list.html과 question_datail에서 - 최상단 CSS를 지운다 - 내부에 - 를 작성함으로써 P/I가 된다 - 안에는 기존 이 변경..

단 하나의 맥락 : FE 부분을 P/I로 쉽게 처리 Semiflow Bundle - bootStrap 설치 - 필요 P/I 파일 static 폴더에 담기 - question_list.html 적용 - question_detail.html에 적용 자각 - 플러그인 설치를 위해 - 홈페이지에서 파일 형식의 P/I 번들인 폴더를 다운받음 - bootstrap-5.1.3-dist.zip/bootstrap-5.1.3-dist/css/bootstrap.min.css 를 카피해 static 폴더에 넣는다 - question_list.html에 적용하기 위해 - 최상단에 - 를 넣어 P/I를 인식할 수 있도록 한다 - 바깥을 로 감싼다 - 을 로 변경하여 CSS 처리 - 를 로 변경하여 CSS 처리 - 헤드단의 tab..

단 하나의 맥락 : CSS 적용 Semiflow Bundle : style.css 작성 : template에 적용 자각 - textarea {width:100%} // 로 넓이 조절 - input[type=submit] { margin-top:10px; } // 로 post 버튼 상단에 마진 적용 - 템플릿 최상단에 로 적용