ITRecipe

[프론트단 리눅스에 소스 배포 하는법] - 기존 폴더 지우는 명령 rm -rf /home/test/fe/test_front - 기존 폴더 이름 바꿔서 복사해두는 명령 mv /home/test/fe/test-front /home/test/fe/test_front _backup - 타르 파일 해제 명령 tar -xvf test-front.tar - 세션 유지시키고 죽여버리는 명령 1~6 # 1. 새 세션 시작 (예: 이름을 front로 지정) screen -S front# 2. 이제 여기에 npm run dev 같은 장기 실행 명령어 입력 # 3. m.x 창을 닫고 싶을 땐: Ctrl + A → D (화면에서 분리됨, 백그라운드 실행 유지됨) # 4. 나중에 재접속하고 싶을 땐: screen -ls ..

오늘은 Spring Boot + Thymeleaf 이메일 템플릿을 구성하면서,줄바꿈(\n)과 행띄우기(line-height) 처리가 되지 않는 이슈를 해결한 과정을 정리합니다.문제 상황이메일 본문(추천 내용)에서 줄바꿈을 입력했는데도,실제 메일에서는 줄바꿈이 적용되지 않고 모두 한 줄로 출력됨로 치환해도 th:text 때문에 HTML 태그가 문자로 출력됨해결 방법 요약1. 백엔드에서 줄바꿈을 로 변환 String contentWithBr = param.getEmailContent() .replaceAll("(\\r\\n|\\r|\\n)", ""); 모든 줄바꿈 문자(\r, \n, \r\n)를 안전하게 로 치환템플릿에서 줄바꿈 되도록 준비2. 템플릿에서 th:text → th:utext로 변경 td col..

{/* 포인트 마커 등록 팝업 전체 컨테이너 (가운데 정렬) */} {/* 주소 표시 (기본주소 + 상세주소) */} {baseAddress}{detailAddress} {/* 포인트 마커 '지정' 버튼 (고정형 하단 버튼) */} 지정 {/* 아래는 버튼 비활성화 시 대체 코드로, 현재는 주석처리됨 */} {/* 지정 */} >> 줄바꿈 처리 기준: 시스템/DB 조합 데이터(주소 등...)특징: 서버 / DB에서 제공하는 한 줄 문자열 (주소, 코드, 로그 등)문제: 줄바꿈 기호 없음 → 길어지면 글자가 잘리거나 한 줄만 보임처리 방법: CSS로 자동 줄바꿈 + 잘..

1. 검색 조건 누락 원인 및 해결문제: API 호출 시 q 값이 전송되지 않음원인: 내부의 input, select 등에 name 속성이 누락되어 있었음해결: 모든 입력 요소에 name 속성 명시 2. ImageDatePicker 초기화 문제문제: ImageDatePicker 사용 시 외부 상태 변경으로 초기화되지 않음원인: 컴포넌트 내부에서 useState로 날짜를 자체 보관 중이며, 외부 props가 반영되지 않는 구조해결 불가 조건: 내부 로직 수정 없이는 초기화 불가능 (controlled input 아님)대안: 일반 사용 권장3. API URL 경로 오류문제: 백엔드에서 No static resource admin/notice/find-list 에러 발생원인: API 요청 시 /api/ p..

[2025년 6월 20일 트러블 슈팅 내역 정리]1. 전체 구조 설계와 인식 변화상태 관리 흐름에 대한 인지가 부족하여 초기화 및 중첩 form 구조에서 문제 발생key는 리렌더링 최적화 및 상태 감지를 위한 핵심 요소전역 CSS는 _app.tsx에서 @/_styles/공통ui.css를 import하여 적용 중 2. 초기화 이슈 해결 const handleAllReset = () => { setSearchKeywordType("all"); setSearchKeywordValue(""); setIsSearch(false); setSelectedGroupCodePk(""); setGroupCodeCurrentPage(1); setCodeCurrentPage(1); setListCode([])..

SQL 핵심 키워드 & 접근 요약표유형핵심 키워드개념 요약주의사항연산자 우선순위AND, ORAND가 우선 → 괄호로 묶어 해석 필수괄호 생략하면 조건 왜곡됨집계함수 + GROUP BYAVG, SUM, MAX, MIN그룹화 후 통계처리필터링은 HAVING 사용중복 제거DISTINCT, UNIONDISTINCT: 중복 제거UNION: 중복 제거UNION ALL: 중복 포함ORDER BY 반드시 명시카운트 함수 차이COUNT(*) vs COUNT(컬럼)*: NULL 포함 / 컬럼: NULL 제외NULL 포함 여부 주의서브쿼리WHERE 안에 SELECT평균보다 큰 값 등 조건 처리SELECT 절에 사용 X정렬ORDER BY + ASC/DESCASC: 오름차순 / DESC: 내림차순기본 정렬 없음데이터 수정UPD..

자바스크립트 내장 함수 총정리 (자료형별 실무 활용 예시)문자열(String) – 폼 처리, 검색, 비교에서 필수(함수명/설명/사용예시)trim()앞뒤 공백 제거유효성 검사 전 정제toLowerCase() / toUpperCase()대소문자 변환검색어 비교, 필터 처리includes()특정 문자열 포함 여부키워드 검색, 필터startsWith() / endsWith()특정 시작/끝 여부파일 확장자 확인 등split()구분자로 문자열 분리쉼표/공백 기준 나눌 때replace()문자열 치환마스킹, 포맷 변경 등substring() / slice()문자열 일부 추출날짜, 미리보기 등padStart() / padEnd()문자열 자릿수 맞춤시간, 숫자 포맷 정렬숫자(Number) – 계산, 통계, 정렬 시 필수(..

안녕하세요 ITRecipe 입니다.SpringBoot3 & Next.js 환경에서 지리정보 시스템 관리자 페이지 작업중에정리 해놓으면 유용하게 쓰일것 같아 정리하러 왔습니다.그럼 아래에 간단히 정리해 보도록 하겠습니다.{/* 줄바꿈 및 행 띄우기 처리 적용하는 방법 */}{row.noticeContent?.split("\n").map((line, idx) => ( {line || }))}{/* 줄바꿈 및 행 띄우기 처리 적용하는 방법 (위 코드와 같은 의미 => 축약형) 하지만 이 방법은 리액트에서 사용할 수 있는 방법은 아님 */}{data.noticeContent.replaceAll("\n", "")}위 코드를 어디다 활용하냐면 게시판 상세 페이지에상세 정보를 뿌리는 영역에 내용란이존재하는 경우, ..

공통 코드 그룹 검색 기능 구현 정리1. 프론트엔드 작업 정리검색 폼 구성 검색 항목 선택 드롭다운 (searchKeywordType) 검색어 입력 필드 (searchKeywordValue) onSubmit 이벤트를 통해 검색 시 handleSearch 호출const handleSearch = (e: React.FormEvent<HTMLFormElement>) => { e.preventDefault(); setIsSearch(true); setCodeGroupCurrentPage(1);};상태 변수 isSearch: 검색 시도 여부 표시 searchKeywordType, searchKeywordValue: 입력된 검색값 저장검색 조건 직렬화const q = serialize..

목표 관리자 페이지 상단의 <select> 박스를 통해 선택한 메뉴로 페이지 이동 기존 하드코딩된 옵션을 동적 메뉴 데이터로 대체적용 코드 (Next.js 기준)import { useRouter } from "next/navigation";const AdminTitle = ({ user }: any) => { const router = useRouter(); const pathName = ""; // 현재 페이지 경로 설정 필요 const handleChange = (e: React.ChangeEvent<HTMLSelectElement>) => { const selectedUrl = e.target.value; if (selectedUrl) { ro..