이미지의 어떤 영역에 마우스를 올려놓으면 설명을 띄우거나 링크를 연결하고 싶었는데 map 태그로 쉽게 기능을 구현할 수 있었다. Image Map Generator 사이트에서 사용할 이미지를 업로드(Select Image from My PC) 한 후 해당 이미지의 부분만 설정해 주면 쉽게 선택에 부분의 좌표가 포함된 map 태그를 가져올 수 있다. https://www.image-map.net/ Free Online Image Map Generator Easy free online html image map generator. Select an image, click to create your areas and generate html your output! www.image-map.net 복사한 코드를..

바닐라 자바스크립트로 웹사이트를 만들고 있는데, 외부 HTML 파일을 가져와 화면에 렌더링 하고자 하였다. 이때 Ajax처럼 기존에 렌더링 된 화면은 그대로 두고 원하는 부분만 새로 렌더링 하고 싶었다. 결과적으로 적용한 코드는 다음과 같다. // ID에 렌더링 function openContent(htmlFileName) { const h = `` document.querySelector("#showContents").innerHTML = h; loadHtml(); // 외부 HTML 파일 로딩 호출 } // 외부 HTML파일 로딩 함수 function loadHtml() { window.addEventListener('click', function() { var allElements = documen..

1. 더미 데이터 생성 https://json-generator.com/ JSON Generator – Tool for generating random data Generate any random data you want with power of agile templates and save it to our servers for later use. json-generator.com 2. 언더스코어가 붙은 "_id" JSON Generator에서 생성한 더비 데이터를 가지고 JavaScript DOM 실습 중이다. 아래는 해당 더미 데이터 중 하나인데 아이디 키가 "_id"와 같이 언더스코어가 붙어있다. 대수롭지 않게 생각하고 실습을 진행 중이었는데 문제가 생겼다. { "_id": "632561efe6b7..

1. Install Visual Studio Code for Java VS Code에서 Java를 사용하기 위해서는 아래 URL에 접근하여 [그림 1]의 코딩 팩을 설치한다. 자바 코딩 팩 https://code.visualstudio.com/docs/languages/java#_install-visual-studio-code-for-java 2. Package 생성 Java Package 생성은 아래 그림을 따라 하면 된다. [그림 8]에서 com.dandy.java 패키지를 생성하였는데 생성 방법은 src 폴더에서 com 폴더 생성, com 폴더 안에서 dandy 폴더 생성, dandy 폴더 안에서 java 폴더 생성을 차례대로 해주었다. 이클립스에서는 기본적으로 패키지를 생성하면서 진행되는데 반해 ..

java -jar 파일명.jargradle로 빌드한 jar 파일을 위 명령어로 실행했는데 8080 포트가 이미 사용 중이라는 에러가 발생했다. 코드를 수정하고 다시 빌드하는 일은 번거롭기 때문에 기존에 실행 중인 8080 포트를 죽이기로 했다.Microsoft Windows [Version 10.0.19044.1889](c) Microsoft Corporation. All rights reserved.C:\Users\J\Documents\GitHub\spring-boot-webservice-java11\spring-webservice\build\libs>java -jar spring-webservice-0.0.1-SNAPSHOT.jar . ____ _ __ _ _..

gradlew build gradlew test는 성공했는데 gradlew build 명령어 실행 시 아래와 같은 에러와 함께 빌드가 실패했다. 프로젝트에 main 클래스가 2개가 있어서 발생한 에러였다. Microsoft Windows [Version 10.0.19044.1889] (c) Microsoft Corporation. All rights reserved. C:\Users\J\Documents\GitHub\spring-boot-webservice-java11\spring-webservice>gradlew build > Task :bootJarMainClassName FAILED FAILURE: Build failed with an exception. * What went wrong: Execu..

gradlew test 위 명령을 실행해 build test를 진행했는데 아래와 같이 에러가 발생했다. C:\Users\J\Documents\GitHub\spring-boot-webservice-java11\spring-webservice>gradlew test > Task :test SpringWebserviceApplicationTests > contextLoads() FAILED java.lang.IllegalStateException at DefaultCacheAwareContextLoaderDelegate.java:132 Caused by: org.springframework.beans.factory.support.BeanDefinitionOverrideException at DefaultLis..

"이동욱. (2019). 스프링 부트와 AWS로 혼자 구현하는 웹 서비스. 프리텍"으로 실습 중인데 책에서는 IntelliJ를 IDE로 사용하고 있지만 나의 경우 STS로 실습을 진행 중이다. "Chapter 04 - 머스태치로 화면 구성하기"에 대한 실습을 하던 중 STS에서는 Mustache 설정에 차이가 있음을 확인했다. ▍build.gradle STS에서 Gradle의 dependencies에 아래 코드를 추가하고 Refrash 한다. implementation 'org.springframework.boot:spring-boot-starter-mustache' ▍src/main/resources/templates/index.mustache index.mustache 파일을 생성하고 아래 코드를 작..