Programming 개발은 구글로/Web[프론트엔드&백엔드]47 please set 'javax.persistence.jdbc.url', 'hibernate.connection.url', or 'hibernate.dialect' 오류 수정 🟦 please set 'javax.persistence.jdbc.url', 'hibernate.connection.url', or 'hibernate.dialect' 오류 수정 Sping Boot 컨테이너에서 MySQL Dialect 설정을 찾지 못하면 아래와 같은 오류가 발생이 됩니다. Unable to determine Dialect without JDBC metadata (please set 'javax.persistence.jdbc.url', 'hibernate.connection.url', or 'hibernate.dialect') 해결 방법은 간단합니다. application.properties에 아래의 코드를 추가하면 됩니다. spring.jpa.properties.hibernate.dia.. 2023. 9. 13. iOS VoiceOver trait 기능 사용 iOS VoiceOver trait 기능 사용 Trait란 VoiceOver가 인식하는 컨트롤 타입을 임의로 지정해주는 기능으로 WAI-ARIA의 Role과 유사합니다. VoiceOver에게 특정 요소의 컨트롤 타입을 지정해 주는 것뿐만 아니라 보이스오버의 동작에까지 영향을 줍니다. 이러한 trait를 잘만 활용하면 애플리케이션의 여러 요소들이 가지는 의미나 기능을 명확하게 스크린리더 유저에게 전달해줄 수 있습니다. 다만 이러한 trait를 잘못 사용하면 의도치 않은 오동작이 수행되어 더욱 큰 혼란을 줄수 있습니다. None (UIAccessibilityTraitNone) 만약 임의의 애플리케이션 요소 중 이미지 요소 또는 버튼과 같은 컨트롤이 있지만 해당 요소 타입을 스크린리더가 인식하지 않도록 할 경.. 2023. 5. 10. [CSS] 줄바꿈 word-break 속성 줄바꿈 word-break 속성 1. word-break: normal(default) 이 글은 영어와 한글이 같이 있는 글입니다. 이 글은 영어와 한글이 같이 있는 글입니다. I'm Copymaster. I'm Copymaster. I'm Copymaster. I'm Copymaster. 영어는 단어를 기준으로 줄바꿈이 이뤄지지만, 한글은 글자를 기준으로 줄바꿈이 이뤄집니다. 한글 뿐만 아니라 중국어, 일본어도 글자를 기준으로 줄바꿈이 이뤄집니다. 영어는 아직 줄이 다 차지 않아도 다음 단어가 길어서 해당 줄을 넘어서는 상황이라면 줄바꿈을 해버리지만, 중국어, 일본어, 한글(줄여서 CJK 라고 부름)은 단어를 중간에 끊는 일이 있더라도 줄을 거의 다 채운 후에 줄바꿈을 합니다. 2. word-break.. 2023. 4. 13. [HTML&CSS] aria-hidden & aria-label aria-hidden : 스크린 리더와 같은 보조 기술을 사용하는 사용자를 대상으로 콘텐츠의 탐색을 제한합니다. 관련 글: 2022.08.12 - [분류 전체보기] - [Javascript] ARIA(Accessible Rich Internet Applications) 즉 aria-hidden이 "true"로 설정되면 스크린 리더로 해당 콘텐츠를 가상 커서로 탐색할 수 없습니다. ※ 스크린리더(보조기기)가 접근하는 것은 원치 않지만, 시각적으로 디자인을 주기 위해서 보여지게 하고 싶은경우에 사용 🟦 aria-hidden 사용 방법 aria-hidden은 키보드 및 마우스 사용자 등과 같은 모든 사용자를 대상으로 콘텐츠를 숨기는 방법이 아니므로 사용에 주의해야 합니다. 또한, 링크, 버튼과 같이 초점을 받.. 2023. 2. 15. [CSS] linear-gradient 로 background에 색상 입히기 linear-gradient 로 background에 색상 입히기 .div0{ background: linear-gradient(red, blue); } ※ 방향을 따로 설정하지 않으면 위의 그림처럼 to bottom이 default 입니다. .div0{ background: linear-gradient(to right, red, blue); } to right top 오른쪽 대각선 위, to bottom right 오른쪽 대각선 아래로도 그라데이션으로 설정할 수 있습니다. 🟦 그라데이션 변경 시점 설정 각 색깔 뒤에 %, px 값을 설정하면 변경 시점부터 색깔이 변경되기 시작합니다. 이때 색깔이 완전 변경되는 것이 아니라 그라데이션으로 다른 색으로 전환이 됩니다. .div0{ background: li.. 2023. 1. 3. [Javascript] 소수점 2자리까지 표시하기 소수점 2자리까지 표시하기 🟦 float 2 decimal Math.round(data * 100) / 100 🟩 N번째 자리에서 반올림 toFixed(N) 으로 입력하면 N+1번째 자리에서 반올림을 하게 됩니다. (Math.round(data * 100) / 100).toFixed(2); 2023. 1. 2. [CSS] !important 사용 !important 사용 CSS는 같은 속성을 여러 번 정의했을 때, 나중에 설정한 값이 적용됩니다. width: auto !important ※ 만약 나중에 설정한 값이 적용되지 않게 하려면 속성 값 뒤에 !important를 붙입니다. p { color: blue; } p { color: red; } 문단의 글자색을 마지막에 설정된 color 값인 red로 디스플레이가 됩니다. p { color: blue !important; } p { color: red; } blue 다음에 !important를 붙이면, 문단의 글자색이 blue로 유지가 됩니다. 2022. 12. 1. [NPM] npm package.json 버전 명시 시 캐럿(^) 사용하기 npm package.json 버전 명시 npm 문서에는 package.json 에서 아래의 방식으로 버전 명시를 할 수 있다고 되어 있습니다. 1.2.3 >1.2.3 >=1.2.3 = 0.1.1 = 0.1.0 = 0.0 < 1.0 Node.js 와 npm의 모듈은 모두 Semantic Versioning(축약 SemVer)를 따르고 있습니다. SemVer 알아보면, MAJOR 버전은 API의 호환성이 깨지말한 변경사항을 의미한다. MINOR 버전은 하위호환성을 지키면서 기능이 추가된 것을 의미한다. PATCH 버전은 하위호환성을 지키는 범위내에서 버그가 수정된 것을 의미한다. MAJOR version when you make incompatible .. 2022. 11. 7. [CSS] CSS란 무엇인가? CSS(Cascading Style Sheets) : HTML 요소들이 각종 미디어에서 어떻게 보이는가를 정의하는 데 사용되는 스타일 시트 언어입니다. CSS를 사용하는 이유 HTML 만으로 웹 페이지를 제작할 경우 HTML 요소의 세부 스타일을 일일이 따로 지정해 주어야만 하는데 이 작업은 매우 많은 시간이 걸리며, 완성한 후에도 스타일의 변경 및 유지 보수가 매우 힘들어집니다. 이러한 문제점을 해소하기 위해 W3C(World Wide Web Consortium)에서 만든 스타일 시트 언어가 바로 CSS입니다. CSS 버전 인터넷의 발전에 따라 CSS는 현재까지 새로운 버전이 계속해서 발표되고 있습니다. 현재 최신 버전의 CSS 표준 권고안은 CSS Level 2 Revision 1 (CSS 2.1)입.. 2022. 10. 31. [Javascript] Object 배열에서 객체와 JSON 내용 확인 Object 배열에서 객체 확인하기 let myJson = JSON.stringify(myObject) // Object를 JSON으로 변환 console.log(myJson) // 각 객체 정보 출력 ※ JSON.stringify라는 메소드를 이용하여 객체(오브젝트 object)와 JSON의 내용을 그대로 콘솔에 출력할 수 있습니다. 2022. 10. 17. [Javascript] Timestamp to date converter(convert to timestamp) Converter Timestamp Date 아래의 사이트를 이용하시면 편리합니다. Timestamp Converter https://www.epochconverter.com/ 2022. 10. 17. [프로그래머스] 문제 설명 및 풀이 프로그래머스 프로그래머스 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 연습 문제 관련 문제 설명 및 풀이 https://programmaster.tistory.com/ Mastering a program programmaster.tistory.com ※ 비영리 및 비상업적인 블로그에서 따로 정리합니다. 2022. 10. 7. 이전 1 2 3 4 다음 728x90
