awspspgh 님의 블로그

1. 이벤트 모달창, 출석체크 css▷ 출력

1. 마우스 드래그 시 색상 변경▷ 출처 ▣ 참고 자료 출처https://hianna.tistory.com/823 [HTML/CSS] 마우스 드래그 배경색, 글자색 변경하기마우스로 텍스트 영역을 드래그했을 때, 선택된 부분의 배경색과 글자색을 변경하는 방법입니다. ::selection ::selection은 사용자가 마우스로 드래그하거나 클릭하여 선택한 텍스트 영역에 스타일hianna.tistory.com

1. swiper pagination & select▷ 출력 ▣ 참고 자료 출처https://velog.io/@yejine2/TIL-10-swiper-pagination-bullet-%EC%BB%A4%EC%8A%A4%ED%85%80 [TIL #10] swiper pagination bullet 커스텀내가 원하는 사이트를 클론 코딩해보는 과제를 받았다.아래 이미지 처럼 슬라이더 영역이 있어서 swiper 라이브러리로 구현하고자 했다.swiper에서 제공하는 pagination은 기본이 파란색 bullet이다.이velog.io  https://wazacs.tistory.com/34 select 태그 커스텀 하기, 혹은 직접 만들기 (feat. javascript)1. Select CSS Customizing..

1. 시세 조회 꾸미기▷ 출력

에러 고치기 GetMapping("/") -> getmapping이라서 redirect를 붙여야하고 "/"를 썼기에 "/index"가 아닌 "/"를 사용해야 함 @GetMapping("/") public String showWeatherForm(@RequestParam(name = "address", required = false) String address, Model model, Principal principal) { @PostMapping("/register") public String register(@ModelAttribute BoardVO boardVO, Principal principal){ log.info("boardVO >>> {} ", boardVO); ..

목차1.로그인 상태에 따른 주소, 날씨 출력하기 1. 로그인 상태에 따른 주소, 날씨 출력하기▷ 출력

목차1.db의 주소를 지도로 출력하기 1. db의 주소를 지도로 출력하기▷ 출력 ▣ 참고 자료 출처◈ 주소로 장소 검색https://apis.map.kakao.com/web/sample/addr2coord/  ◈ model의 변수 -> javascripthttps://velog.io/@gimminjae/Spring-Boot-model%EB%A1%9C-%EB%84%98%EA%B2%A8%EC%A4%80-%EB%B3%80%EC%88%98-javascript%EC%97%90%EC%84%9C-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0 Spring Boot - model로 넘겨준 변수 javascript에서 사용하기Spring Boot를 사용하는 사람이라면, 스프링 컨트롤러에서 model로 ..

목차1.db 연동 1. db 연동db에 있는 user의 도로명 주소 가져오기- 날씨 API와 도로명 주소 가져오는 Controller가 각각 나눠져 있어서 index.html에 동시에 출력하기 매우매우 어려웠다. 하루종일을 한 결과 Controller를 하나로 합치기로 나 자신과 합의를 보기로 했다 ▷ 출력

목차1.swiper 1. swiper▷ 출력 ▣ 참고 자료 출처https://swiperjs.com/swiper-api Swiper - The Most Modern Mobile Touch SliderSwiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior.swiperjs.com https://ktsmemo.cafe24.com/s/SwiperJS/777 Swiper 이미지 동적 로딩 (lazy)자바스크립트 스와이퍼 예제 모음ktsmemo.cafe24.com https://jineecode.tistory.com/77 swiper-button-next , pr..

목차1.날씨 아이콘 1. 날씨 아이콘▣ OpenWeather APIOpenWeather API에서 날씨 아이콘을 출력하려면 weather에서 날씨에 따른 아이콘 코드를 가져와야 함... "weather": [ { "id": 500, "main":"Rain", "description": "light rain", "icon": "10n" } ],... icon의 코드는 weather 배열에 있는 첫 번째 객체에 있음 아래의 OpenWeather API URL을 통해서 이미지를 화면에 출력할 수 있음https://openweathermap.org/img/wn/10d@2x.png URL을 해석하자면- https://openweathermap.org/img/wn/: OpenWeatherMap의..