📒솜이노트

# GIS시스템, Geoserver - WMS와 WFS의 차이점

지도 서비스나 공간정보 시스템을 구축하다 보면 WMS와 WFS라는 용어를 자주 접하게 됩니다.둘 다 OGC(Open Geospatial Consortium)에서 만든 표준 서비스이지만, 제공 방식과 활용 목적이 다릅니다.처음 접하면 헷갈리기 쉽지만, 핵심 차이만 알면 언제 WMS를 쓰고 WFS를 써야 하는지 명확해집니다.1. WMS (Web Map Service) 서버에 저장된 공간 데이터를 **이미지(PNG, JPEG)**로 제공사용자는 지도를 보는 용도로 활용확대·축소 시 화질이 떨어질 수 있고, 속성 데이터 분석에는 부적합장점: 빠른 렌더링, 데이터 유출 위험이 적음활용 예시: 배경지도, 항공사진, 행정구역 경계 2. WFS (Web Feature Service) 서버에 저장된 공간 데이터를 **벡..

🖥️ 프론트엔드/🌏GIS 2025. 9. 19. 08:19

# CSS 리셋(Reset)코드 CDN 연결

CSS Reset 이란?웹 브라우저마다 기본 제공하는 CSS 스타일(여백, 글자 크기, 테이블 간격 등)이 조금씩 다르기 때문에, 같은 HTML을 작성해도 크롬·파이어폭스·사파리 등에서 모양이 달라집니다.이를 통일하기 위해 CSS Reset을 적용합니다.대표적으로 많이 쓰이는 것이 Eric Meyer의 Reset CSS입니다. 적용방법1. 직접 파일로 넣기프로젝트 css 폴더에 reset.css 저장HTML 에 링크 추가Eric Meyer’s Reset CSS (v2.0)https://meyerweb.com/eric/tools/css/reset/ CSS Tools: Reset CSSCSS Tools: Reset CSS The goal of a reset stylesheet is to reduce brow..

🖥️ 프론트엔드/🎨퍼블리싱 2025. 9. 16. 13:35

# 부트스트랩 및 부트스트랩 아이콘(bootstrap icons) CDN

부트스트랩 CDN 사용방법부트스트랩은 가장 널리 쓰이는 CSS 프레임워크 중 하나입니다.CSS와 JS를 추가하면 바로 반응형 레이아웃, 다양한 컴포넌트(버튼, 네비게이션바 등)를 사용할 수 있습니다. CDN으로 포함시키기CSS 불러오기 script 불러오기 그밖의 다양한 import 방법을 원하시면 공식사이트에서 확인할 수 있습니다.https://getbootstrap.kr/ Bootstrap강력하고 확장 가능하며 기능이 풍부한 프론트엔드 툴킷. Sass로 빌드 및 커스터마이징하고, 사전 빌드된 그리드 시스템 및 구성 요소를 활용하고, 강력한 JavaScript 플러그인으로 프로젝트에 생기getbootstrap.kr 부트스트랩 아이콘 CDN 사용방법Bootstrap 팀에서 공식으로 제공하는 아이콘 세트입..

🖥️ 프론트엔드/🎨퍼블리싱 2025. 9. 15. 08:48

# Spring boot 기초 - 프로젝트 생성부터 로그인 기능 만들기 (Session기반) 2탄

결과화면로그인이 되지 않았으면 로그인버튼이 뜨고, 로그인이 되면 로그아웃과 정보수정버튼이 생깁니다.로그인, 로그아웃 기능Controller1탄에서 만들 때 코드에 파라미터 안에 HttpSession session이라는 매개변수가 있었습니다.세션의 원리 1. 로그인 성공 시 서버가 사용자 정보 저장2. 서버가 클라이언트(브라우저)에 JSESSIONID 쿠키 발급3. 요청 올 때마다 서버가 JSESSIONID 확인4. 로그아웃 시 세션 삭제@PostMapping("/login") public String login(LoginDTO dto, Model model, HttpSession session) { LoginResult result = memberService.login(dto); ..

🗄️ 백엔드/🍃Spring 2025. 9. 11. 09:34

# Spring boot 기초 - 프로젝트 생성부터 로그인 기능 만들기 (Session기반) 1탄

Spring boot, Java 17, Mybatis, PostgreSQL 인텔리제이 환경 기반으로 작성된 글 입니다. Spring boot 프로젝트 생성하기1. 프로젝트 생성File - Project에서 Spring Boot를 선택한 후Dependencies는 Spring Web, PostgreSQL, Thymleaf, Loombok 등을 선택해 주고 Create버튼을 클릭하여 생성해줍니다.(어차피 나중에 추가할 수 있기때문에 크게 중요하지 않습니다.)2. DB연결에 필요한 설정하기postgresbuild.gradle 추가runtimeOnly 'org.postgresql:postgresql' properties 설정spring.datasource.driver-class-name=org.postgresq..

🗄️ 백엔드/🍃Spring 2025. 9. 10. 16:46

# 최신 제이쿼리(jQuery), 제이쿼리 UI CDN

https://releases.jquery.com/ jQuery CDNjQuery CDN – Latest Stable Versions jQuery Core Showing the latest stable release in each major branch. See all versions of jQuery Core. jQuery 3.x jQuery 2.x jQuery 1.x jQuery Migrate jQuery UI Showing the latest stable release for the current and legacreleases.jquery.com jQueryjQuery = DOM 조작/이벤트 처리 기본기 1. 현기준 jQuery 최신 슬림 최소화 버전 2. jQuery UI 슬림, 최소화 버전 j..

🖥️ 프론트엔드/🎨퍼블리싱 2025. 9. 10. 13:21

# 타임리프 기본 문법 + fragment(공통 헤더/푸터) 구조화

타임리프(Thymeleaf)란?타임리프(Thymeleaf)는 Spring MVC + 뷰 템플릿 엔진으로 가장 많이 쓰이는 기본 템플릿이다.보통 기본 틀이라고 하면, HTML 안에서 타임리프를 적용하는 공식 구조를 의미한다. 1.HTML 문서 기본 구조 기본 제목 기본 메시지 로그인 상태입니다. 로그인이 필요합니다. 아이템 회원목록 2. 컨트롤러 예시 (Spring mvc)@Controllerpublic class ThymeleafController { @RequestMapping("/example") public String example(Model model) { ..

🗄️ 백엔드/🍃Spring 2025. 9. 10. 08:14

# Spring Boot 3.5.5 + MyBatis 사용 시 factoryBeanObjectType 에러 해결

1. 발생한 에러Spring Boot 3.5.5 프로젝트 실행 시 다음과 같은 에러가 발생했다.org.springframework.beans.factory.BeanDefinitionStoreException: Invalid bean definition with name 'memberMapper' Invalid value type for attribute 'factoryBeanObjectType': java.lang.String @mapper도 넣고 @mapperscan도 넣어봤지만 아무 소용 없었다.결국 버전문제.. 2. 원인 분석프로젝트의 build.gradle을 보면 MyBatis Starter 버전이 다음과 같았다.implementation 'org.mybatis.spring.boot:mybatis..

❗에러해결모음 2025. 9. 9. 15:31

# Leaflet vs OpenLayers 차이 정리 + Leaflet 예제

1. 기본 철학Leaflet"가볍고 간단"을 목표로 만든 라이브러리핵심 기능만 제공 (타일맵, 마커, 팝업, GeoJSON 표시 등)플러그인 생태계가 풍부해서 필요한 기능만 붙이는 방식OpenLayers"올인원" GIS 라이브러리벡터/래스터, 좌표 변환, 스타일링, WMS/WFS 같은 고급 GIS 기능을 기본 내장기능은 많지만 러닝커브가 있음2. 성능Leaflet가볍고 빠르지만, 대규모 데이터(수만 개 피처)를 다룰 때는 성능 저하가 생김모바일 최적화가 잘 돼 있음 OpenLayers복잡한 대용량 데이터도 처리 가능 (수만~수십만 피처)WebGL 기반 렌더링 지원 → 성능적으로 더 강력3. 좌표계/투영법Leaflet기본이 EPSG:3857(Web Mercator)다른 좌표계 지원은 제한적 → proj4j..

🖥️ 프론트엔드/🌏GIS 2025. 9. 8. 14:01

# GPT 502 bad gateway 현상 원인, 해결방법

원인파악GPT가 렉이걸려서 새로고침하고 다시 접속해보니 502에러가 뜬금없이 터졌다. 502에러는 쉽게 말하면“내 브라우저 → 서버” 사이에 끼어 있는 중간 게이트웨이(프록시, 로드밸런서, 클라우드 서버 등) 가 정상적으로 응답을 못 받았을 때 나는 오류다. 그렇다면 이 에러는 왜 생길까? 서버 자체 문제서버가 다운되었거나, 응답이 너무 느려서 게이트웨이가 “응답 없음” 처리함.프록시/로드밸런서 문제Nginx, Cloudflare, AWS ELB 같은 게 중간에서 백엔드 서버와 연결 못했을 때.잘못된 서버 응답백엔드가 잘못된 HTTP 헤더나 포맷을 보내서 게이트웨이가 해석 실패했을 때 등이 있다.해결 방법502 에러의 특징 502는 보통 일시적 오류라 새로고침으로 해결되는 경우가 많음.하지만 장시간 지속..

❗에러해결모음 2025. 9. 4. 14:20