JPA 엔티티에 생성 날짜(createdDate), 변경 날짜(modifiedDate) 필드를 자동으로 추가하는 방법입니다. 절차 1) BaseTimeEntity 추상 클래스 작성 package com.example.awsboard.domain; import lombok.Getter; import org.springframework.data.a...

페이지네이션, 페이징, 페이지 내비게이션 등 다양한 이름으로 불리는 이것은 웹 페이지에서 흔히 볼 수 있는 페이지 번호를 클릭하면 특정 페이지로 이동하는 부분이나 기법을 통칭하는 용어입니다. 위의 HTML 요소 전부를 편의상 블럭이라고 하겠습니다. 이 예제는 (1) 현재 페이지, (2) 블럭 당 페이지 개수, (3) 전체 글 개수, (4) 페이지...

스프링 부트 + JPA + Thymeleaf를 이용해 게시판에 페이지네이션(페이징, 페이지 내비게이션) 기능을 추가해 보겠습니다. 절차 0) 엔티티 클래스, 레퍼지토리 인터페이스 작성 Spring Boot: Spring JPA + H2 데이터베이스 기초 + 단위 테스트   1) 엔티티에 대한 서비스 클래스 작성 package com....

BASE64란 8비트 바이너리 데이터(예를 들어 실행파일이나, ZIP파일 등)를 문자 코드에 영향을 받지 않는 공통 ASCII 영역의 문자들로만 이루어진 일련의 스트링으로 바꾸는 인코딩 방식을 가리키는 개념입니다. 다시 말해서, 바이너리를 읽을 수 있는 스트링 형태로 바꾼 자료형을 BASE64라고 합니다. (자세한 설명)   예전에 스프링 부트에서...

Vue.js 등 SPA 프레임워크는 자바스크립트의 History API를 이용하여 클라이언트 단에서 URL 라우팅을 하는 기능이 있습니다. Vue Router: HTML5 히스토리 모드 History API 이 기능을 사용하면, 서버에서 별도로 처리하지 않고도 index.html에서 URL을 지정할 수 있게 됩니다. 전통적으로 브라우저창...

이 방법은 npm의 Vue CLI를 통해 개발하는 경우 및 처음에 Vue.js 프로젝트를 생성할 때 Vue Router가 포함되지 않은 경우를 기준으로 작성되었습니다. 절차 1) npm에서 Vue Router 설치 npm install vue-router --save   2) router 관련 설정 js 파일 생성 이름 및 경로는 자유롭게...

MIDI란 컴퓨터 음악을 위한 규격화된 포맷으로 미디 표준을 지켜 만든 음악 파일들은 미디 플레이어 등에서 실행할 수 있으며 오늘날 음악 제작에서 필수적으로 사용되고 있습니다. 자세한 내용 미디 플레이어는 자신이 가진 미디 파일을 인터넷상에 업로드하고 어디서나 재생할 수 있는 웹사이트입니다. AWS를 이용해 인터넷상에서 접근 가능하도록 했습니다. ...

이전 글 스프링 부트(Spring Boot) 미디 플레이어 만들기 (1): Timidity++, LAME을 이용해 미디(midi) 파일을 mp3로 변환하는 메소드 만들기 스프링 부트(Spring Boot) 미디 플레이어 만들기 (2): 업로드 페이지, 임시 재생 플레이어 만들기   미디 플레이어 보기 이 서비스는 AWS 프리티어 기간...

자바스크립트로 테이블을 역순으로 정렬하는 예제입니다. 참고로 테이블을 작성할 시에는 <table> 태그 밑에 <thead>와 <tbody>로 제목 부분과 내용 부분을 나누는 것이 관리 측면에 좋습니다. DOM 배열은 forEach등을 사용할 수 없으므로 Array.from($domArrr)로 forEach 등을 사용할...

이전 글: 스프링 부트(Spring Boot) 미디 플레이어 만들기 (1): Timidity++, LAME을 이용해 미디(midi) 파일을 mp3로 변환하는 메소드 만들기   미디 플레이어 보기 이 서비스는 AWS 프리티어 기간 만료로 인해 폐쇄하였습니다.서비스 당시 모습을 영상 기록으로 확인할 수 있습니다.   현재 버전에서의 ...