개발일지, 개인 또는 단체 포트폴리오 등
캔버스에 대한 기초 사용법은 모질라 web docs에서 볼 수 있습니다. 원 그리기 호(arc) 명령을 이용해서 원을 그릴 수 있습니다. arc(x, y, radius, startAngle, endAngle, anticlockwise) (x, y) 위치에 원점을 두면서, 반지름 r을 가지고, startAngle 에서 시작하여 endAngle 에서 끝나며 주어진 anticlockwise 방향으로 향하는 (기본값 false – 시계방향 회전) 호를 그리게 됩니다. 예제 코드를 살펴보겠습니다. HTML 기본 토대는 다음과 같습니다. <!DOCTYPE 더보기…
자바스크립트와 HTML로 이루어진 페이지에서 audio태그를 사용하여 음원을 재생할 때 설정할 수 있는 구간 반복 기능을 구현한 예제입니다. 언어 학습 등에 사용하면 좋을 것 같습니다. 자바스크립트 오디오 객체에서 특정 이벤트를 실행하는 방법은 다음과 같습니다. audioElement.addEventListener(type, listener[, useCapture]); type: 이벤트 종류(timeupdate, play, loaddedmetadata 등) listener: 해당 이벤트 발생 시 실행할 함수 useCapture: 더보기…
보다 개선된 네이버 로그인 – 스프링 부트(Spring Boot): 구글 로그인 연동 (스프링 부트 스타터의 oauth2-client) 이용 + 네이버 아이디로 로그인 이전글의 두 상황을 결합하여 네이버 아이디로 로그인(이하 네아로)을 스프링 시큐리티와 연결하는 예제입니다. Spring Boot: – 네이버 아이디로 로그인하기 – 연동하기 (1) Spring Boot: 시큐리티(Security) – 4 – 로그인 폼을 거치지 더보기…
깃허브에서 전체 코드 보기 – https://github.com/ayaysir/spring-boot-security-example-1 보다 개선된 네이버 아이디로 로그인 – 스프링 부트(Spring Boot): 구글 로그인 연동 (스프링 부트 스타터의 oauth2-client) 이용 + 네이버 아이디로 로그인 이전글의 두 상황을 결합하여 네이버 아이디로 로그인(이하 네아로)을 스프링 시큐리티와 연결하는 예제입니다. Spring Boot: – 네이버 아이디로 로그인하기 – 연동하기 (1) Spring Boot: 시큐리티(Security) 더보기…
깃허브에서 전체 코드 보기 – https://github.com/ayaysir/spring-boot-security-example-1 보다 개선된 네이버 로그인 – 스프링 부트(Spring Boot): 구글 로그인 연동 (스프링 부트 스타터의 oauth2-client) 이용 + 네이버 아이디로 로그인 이전글의 두 상황을 결합하여 네이버 아이디로 로그인(이하 네아로)을 스프링 시큐리티와 연결하는 예제입니다. Spring Boot: – 네이버 아이디로 로그인하기 – 연동하기 (1) Spring Boot: 시큐리티(Security) – 4 더보기…
[구조] 버튼을 클릭합니다. [릴레이션 뷰] 버튼을 클릭합니다. 제약의 이름을 입력합니다. 외래키로 사용할 컬럼(다른 테이블을 참조하는 컬럼)의 컬럼명을 설정합니다. 참조되는 컬럼(다른 테이블의 기본키)의 컬럼명을 찾아 설정합니다. 두 컬럼 간의 데이터 타입 및 인코딩은 일치해야 합니다. 옵션 (SET NULL: 참조되는 컬럼이 변경되면 null로 업데이트/CASCADE: 연쇄 업데이트/RESTRICT: 변경 제한/NO ACTION: 참조되는 컬럼의 변경에 더보기…
이 예제에는 스프링 시큐리티와 Thymeleaf가 사용되었습니다. 기초적인 데이터베이스 insert 예제로, 특별한 내용은 없고 다음을 연습하기 위해 만들었습니다. 회원 테이블에 비밀번호를 BCrypt로 해싱한 텍스트를 입력 원칙적으로 입력한 값에 대한 유효성 검사는 프론트엔드 측과 백엔드 측 모두에서 행해져야 하는데, 백엔드 측의 유효성 검사 과정을 추가 시간 관계상 프론트엔드 측 유효성 검사는 구현하지 더보기…
Webjars는 스프링 부트에서 Bootstrap, JQuery 등의 프론트엔드 라이브러리를 스프링 프레임워크가 자체적으로 관리하도록 하는 방법 중 하나입니다. 예제로 부트스트랩과 JQuery를 추가하겠습니다. 1. webjars.org를 접속한 다음 Popular WebJars 에서 Build Tool: Maven을 선택합니다. 2. 사용하고자 하는 라이브러리의 <dependency/> 안의 내용을 복사한 다음 pom.xml의 <dependencies/> 태그 내에 추가합니다. <dependencies> … <!– webjars.org –> 더보기…
깃허브에서 전체 코드 보기 – https://github.com/ayaysir/spring-boot-security-example-1 스프링 부트 시큐리티에서 자주 변경되는 정보를 분리하는 방법에 대해 알아보겠습니다. (참고 블로그) Security Config 클래스의 코드에서 위의 빨간색 네모 코드를 데이터베이스에서 가져오는 것으로 바꾸는 작업을 하겠습니다. 이유는 위 네모박스는 자주 변경될 수 있는 부분인데 하드코딩 방식으로 정보가 입력되어 있기 때문입니다. 참고로 더보기…
정규표현식(이하 정규식)에 대한 내용을 다뤄보겠습니다. 정규식은 자바스크립트에서만 사용되는 것은 아니지만 프로그래밍 언어마다 사용방법이나 문법 등이 미묘하게 다르기 때문에 여기서는 자바스크립트를 기준으로 설명하겠습니다. 정규식 선언 방법 var regex1 = /정규식/ var regex2 = new RegExp(“정규식”); 슬래시(/)로 감싸거나, RegExp("정규식")를 사용해서 선언합니다. 보통 전자의 방법이 선호되지만, 필요에 따라 다른 변수가 정규식에 포함되어야 더보기…