웹개발 12

[Spring Boot] Spring Boot + Thymeleaf 구조에서 decorate를 이용하여 layout 설정하기

안녕하세요. hia의 개발 story입니다. 이번에는 부디 끝까지 만들어 볼 수 있기 바라며 Sample Board Project를 시작했습니다. 말 그대로 간단한 게시판 프로그램을 만들 예정이며 부수적으로 로그인이나 회원가입 같은 기능들도 함께 넣어 공부해보려 합니다. 우선 틀을 잡기에 앞서 프로젝트를 생성하는 방법은 종종 업데이트를 했기 때문에 생략하도록 하겠습니다. 혹시 모르시는 분들을 위해 intellij에서 스프링부트 프로젝트 생성하는 방법을 올려드리도록 하겠습니다. [Spring Boot] Intellij에 스프링 부트 프로젝트 생성하기 안녕하세요. hia의 개발 story입니다. 안녕하세요. 웹 개발을 공부하고 있는 개발자 hia입니다. 오늘은 작은 프로젝트를 시작하기 위해 스프링 부트 프로..

Springboot 2023.08.08

[Spring Boot] JpaRepository에서의 쿼리메서드

안녕하세요. hia의 개발 story입니다. Spring JPA의 경우 여러 가지의 검색 조건에 필요한 기능들을 제공합니다. 쿼리 메서드 : 메서드가 쿼리의 구문으로 처리되도록 하는 기능 @Query : SQL처럼 만들기 위해 엔티티 클래스의 정보를 이용해 쿼리를 작성하는 기능 Querysl 등의 동적 쿼리 처리 기능 오늘은 이 중에서 쿼리 메서드에 대해서 공부하려고 합니다. 쿼리 메서드 쿼리 메서드 문서는 아래 페이지에서 찾아볼 수 있습니다. 처음부터 문서만 봐서는 활용하기 어려우니 기초적인 부분을 정리해보려고 합니다. Spring Data JPA - Reference Documentation Example 119. Using @Transactional at query methods @Transacti..

Springboot 2023.03.31

[Spring Boot] JpaRepository의 페이징 및 정렬 처리 하기

안녕하세요. hia의 개발 story입니다. 오늘은 JpaRepository를 이용해 페이징 처리와 정렬 처리를 해보려고 합니다. 지난번에 만든 테이블에는 데이터가 부족하니 sample 테이블에 페이징을 볼 수 있는 데이터를 50개 정도 넣도록 하겠습니다. 이제 CRUD 테스트를 위해 만들었던 SampleRepositoryTests를 이용해 계속 테스트를 해보겠습니다. 페이징 처리 : findAll() 페이징 처리는 findAll() 메서드를 이용하면 됩니다. 이때 findAll( )의 매개변수로 Pageable을 사용하면 Page 로 반환을 하게 되어있습니다. 아래의 소스로 페이징 되어 나오는 데이터를 확인할 수 있습니다. @Test public void pageTest(){ Pageable pagea..

Springboot 2023.03.22

[Spring Boot] MariaDB와 Spring JPA 사용하기

안녕하세요. hia의 개발 story입니다. 오늘은 스프링 JPA에 관한 글을 쓰려고 합니다. Spring JPA는 공식 홈페이지에서 설명하는 것과 같이 Spring에서 Jakarta Persistence API(JPA)를 사용할 수 있도록 하는 것입니다. JPA 데이터소스에 접근하기 쉽도록 만들어져 있어 간단한 설정만으로도 JPA를 사용할 수 있습니다. CRUD(Crate, Read, Update, Delete) 작업을 쉽게 처리할 수 있습니다. Spring Data JPA - Reference Documentation Example 119. Using @Transactional at query methods @Transactional(readOnly = true) interface UserReposi..

Springboot 2023.03.14

[docker] mariadb image 찾아 다운로드 하여 컨테이너 만들기 및 실행하기

안녕하세요. hia의 개발 story입니다. 지난번에는 직접 도커 이미지를 만들어서 컨테이너화 시켜보았습니다. [docker] docker로 이미지 만들기 안녕하세요. hia의 개발 story입니다. 오늘은 도커에 대한 글을 써볼까 합니다. 이전에 맥북에서 oracle을 사용하기 위해 docker를 사용했던 적이 있습니다. 그때는 아무것도 모르는 채로 맥북에서 사 hia376.tistory.com 이번에는 도커 이미지 중 mariadb를 찾아서 image를 다운로드하여 컨테이너화 해보겠습니다. docker search, pull, images 명령어 docker에서 이미지를 검색하기 위한 명령어는 docker search [검색어]입니다. docker search mariadb 그러면 아래와 같이 여러가..

docker 2023.03.09

[Spring Boot] header 메뉴 선택 시 jquery로 class 값 변경하기

안녕하세요. hia의 개발 story입니다. header를 만들고 나니 생기는 문제가 있었습니다. 기존 페이지는 페이지별로 header 코딩이 되어있었기 때문에 해당 페이지를 누르면 그에 해당하는 메뉴에 current라는 클래스를 넣어줬습니다. 하지만 header를 분리하게 되면 어떤 페이지에서 header를 불렀는지 알 수가 없어서 선택된 메뉴를 표시해줄 수가 없습니다. 이제 그 부분을 script로 적용하여 변하게 하려고 합니다. 아래의 사진처럼 페이지에는 메인, 소개, 예약, 숙박, 문의 이렇게 다섯 가지의 메뉴가 있습니다. 그 메뉴 중 현재 선택된 메뉴는 메인입니다. 선택된 메뉴를 빨갛게 만드는 것은 main.css에 미리 설정된 스타일로 클래스명이 current인 li 태그에 설정된 스타일입니다..

Springboot 2022.12.22

[Spring Boot] Thymeleaf를 이용한 header, footer 등 공통 페이지 조각 만들기

안녕하세요. hia의 개발 story입니다. 홈페이지를 만들기에 앞서 페이지를 조각내 보려고 합니다. 프런트를 만들 때 보통 공통으로 들어가는 페이지가 있습니다. 특히나 header, footer 파일이 가장 대표적입니다. 쉽게 말해서 홈페이지의 어느 페이지를 들어가더라도 떠있어야 하는 파일을 따로 만들어두는 것입니다. 그러면 페이지마다 같은 부분을 고칠 필요 없이 조각난 파일만 수정을 하면 되기 때문에 선택이 아닌 필수 사항입니다. Thymeleaf에 들어가면 이렇게 공식 문서를 볼 수가 있습니다. 이제 이 문서를 사용해서 fragment 조각들을 만들어봅시다. Thymeleaf Page Layouts - Thymeleaf Summary In this article, we described many w..

Springboot 2022.12.14

[Intellij IDEA] 인텔리제이 html, Jsp, css, Js 파일 수정 시 자동 새로고침 설정하기

안녕하세요. hia의 개발 story입니다. 이클립스에서도 유용하게 사용하는 기능인 프론트 단에서의 정적 자원들이 자동 새로고침 되는 기능을 설정하려고 합니다. 물론 이클립스도 설정을 해야하지만 지금은 인텔리제이를 공부하는 중이기 때문에 인텔리제이에서의 설정을 남겨보려 합니다. 우선 인텔리제이를 킨 후 화면 우측 상단에 있는 나의 서버를 찾아줍니다. 쉽게 우측 상단 run버튼 왼쪽에 있는 main 서버를 찾아주는 곳입니다. 눌러서 Edit Configurations.. 를 눌러줍니다. 이전 버전에 대한 글만 올라와있어서 좀 찾기가 어려웠습니다. 최신 버전에서는 아래 화면에서 Modify options를 눌러주면 됩니다. 그러면 아래 화면이 나오는데 우리가 설정해줘야할 것은 On 'Update' actio..

개발팁 2022.12.08

[Spring Boot] 무료 템플릿을 이용한 홈페이지 제작

안녕하세요. hia의 개발 story입니다. 스프링 부트를 공부할 겸 미니 프로젝트로 간단한 펜션 홈페이지를 제작하고 있습니다. 홈페이지를 제작하려고 하니 디자인이 걱정되기도 하고 페이지를 다 만들어야 한다는 생각에 걱정이 되었습니다. 그래서 무료로 제공되는 템플릿을 수정하여 사용하기로 했습니다. 아래 사이트는 제가 이용한 사이트인데 zip 파일로 제공할 뿐만 아니라 무료에 수정까지 가능한 템플릿을 제공합니다. 무료로 제공되지만 상당히 깔끔한 UI를 제공하는 것 같습니다. HTML5 UP Responsive HTML5 and CSS3 site templates designed by @ajlkn and released under the Creative Commons license. html5up.net 파..

Springboot 2022.12.07

[Intellij IDEA] 인텔리제이 git/github 연동하기

안녕하세요. hia의 개발 story입니다. 프로젝트 진행상황을 남기기 위해서 git 연동을 하려고 합니다. 우선 intellij에서 설정을 위해서 Preferences로 이동해줍니다. 검색창에 git을 검색하면 Git/ GitHub가 나옵니다. 우선은 git을 먼저 등록합니다. 아래 화면은 사실 잘못 알고 git.exe 파일이 아닌 깃허브의 url을 잘못 입력해서 나오는 화면입니다. 여기서는 깃을 등록하는 것이기 때문에 본인의 컴퓨터에 깃이 설치되어있어야 합니다. 깃이 설치되어 있다면 설치되어있는 깃 폴더를 찾아가야 합니다. 맥북 그리고 저의 경우에는 /usr/local/git/bin/git.exec 였습니다. 혹시 깃이 어디에 설치되어있는지 잘 모르겠다면 터미널을 켜고 아래 명령어를 입력해주면 위치가..

개발팁 2022.11.29