[React/SpringBoot] RPA 주간보고 자동화 시스템 (사이드 프로젝트)
·
🏅 Project
서론사실 거창한 이유에서 시작된 프로젝트는 아니었습니다. 회사에서 일을 하다 보면 매주 반복되는 보고서 작성이 늘 번거롭게 느껴졌습니다.주 후반에 몰아서 한 주를 정리하다 보면, "아, 이걸 그때그때 간단히라도 기록해뒀다면 얼마나 편했을까?"라는 생각이 들곤 했고,그러다 문득 "이 반복적인 업무를 조금이라도 줄여보면 어떨까?" 라는 아이디어가 떠올랐습니다.그 계기로 사이드 프로젝트로 시작된 것이 바로 이 "RPA 주간보고 자동화 시스템"이었습니다.RPA란 ?RPA(Robotic Process Automation)는 사람이 컴퓨터 앞에서 반복적으로 수행하는 업무를 소프트웨어 로봇(봇)으로 자동화하는 기술입니다.즉, 사람이 마우스 클릭이나 키보드 입력으로 하던 단순·반복적인 작업을 로봇이 대신 처리하는 것...
[Linux] 내부망 · 외부망 · 망연계 환경 설치 - 자동화 스크립트 제작기
·
🗄️ Backend/Linux
서론최근 내가 담당한 프로젝트를 운영 서버에 설치하는 작업을 진행하게 되었다.겉보기에는 단순히 WEB/WAS/DB 설치 후 DB dump를 올리면 끝나는 단순한 작업처럼 보였다.하지만 실제 현장에서는 인바운드/아웃바운드 통신 문제 때문에 예상보다 훨씬 많은 시간을 소모해야 했다.이 글에서는 내가 겪은 실제 상황을 바탕으로, 내부망·외부망·망연계라는 개념을 정리하고,앞으로 같은 문제를 줄이기 위해 준비한 방법을 적어두려고 한다.사건 재구성출장 당시, 외부망에 위치한 WAS 서버에서 내부망에 위치한 DB 서버로 접속해야 했다.당연히 미리 네트워크 정책이 세팅되어 있을 거라 생각하고, 설치와 테스트를 진행했다.그러나 실제로는 DB 통신이 되지 않았고, 뒤늦게 인바운드/아웃바운드·망연계 장비 정책을 다시 확인하..
[React] 무한 스크롤(Infinite Scroll) 적용 – 시행착오와 최적화
·
🖥️ Frontend/React
프로젝트에서 게시판 목록을 불러오는 기능을 구현하면서 무한 스크롤(Infinite Scroll)을 적용했습니다.처음에는 단순히 스크롤 이벤트와 데이터 요청(fetch)을 한 컴포넌트에 모두 넣었는데, 코드가 복잡해지고 유지보수가 어려워졌습니다.이번 글에서는 제가 겪은 시행착오와 개선 과정을 정리해 보았습니다.1. 초기 구현 – 컴포넌트 내부 처리처음에는 게시판 컴포넌트 안에 스크롤 이벤트와 API 호출을 모두 넣었습니다.useEffect(() => { const container = containerRef.current; if (!container) return; const handleScroll = () => { const { scrollTop, scrollHeight, clientHeigh..
React 입력값 처리 최적화: Debounce vs 클라이언트 필터링
·
🖥️ Frontend/React
React에서 사용자의 입력을 처리할 때 흔히 고민하는 문제가 있습니다. 바로 실시간으로 입력값이 바뀔 때 서버 호출을 최소화할 수 있는가 입니다. 오늘 회사에서 React 입력값 처리 방식에 대해 팀과 의견을 나누는 자리가 있었습니다.제가 예전에 적용했던 “클라이언트 필터링”과 onChange Debounce 전략에 대해 이야기하다가, 잘 모르면서 상사 분들과 동료 직원분들께 아는 척을 한 순간이 있었습니다.사실 정답이 있는 것은 아니지만 , 그때 무심코 제가 잘 모르는 Debounce에 대해 코드만 읽고 단순하게 판단하여 ..지금 생각하면 쥐구멍에라도 숨고 싶은 심정이지만… 이미 엎어진 물은 돌이킬 수 없으니 ㅠ이 글에서는 당시 제가 고민했던 문제와, 입력값 변화 시 서버 호출을 최소화하는 여러 전략..
[정보처리기사] 자격증 시험 회고
·
📜 Certs/정보처리기사
올해 정기 기사 2회 시험 "정보처리기사" 에 합격했고, 이번 글에서는 개발 업무와 병행하면서 한 달 동안 정보처리기사를 준비하며 배운 점과 느낀 점을 솔직하게 기록하려 합니다.1. 공부 환경과 기간기간: 4주(한 달) 집중 학습평일: 퇴근 후 1~2시간 → 이론 1시간 + 문제 풀이 1시간주말: 3~4시간 → 전체 복습 + 실전 문제 풀이타이머 활용, 집중 모드 유지, 휴식 시간 최소화짧지만 집중적인 학습으로 효율을 극대화했습니다.2. 25년 개정판 출제 경향과 시험 포커스2025년 개정판부터 정보처리기사 문제는 실무와 연계된 난이도 있는 문제 비중이 증가했습니다.제가 준비하면서 파악한 출제 트렌드는 다음과 같습니다.이론 문제자료구조: 연결 리스트, 스택, 큐, 트리, 해시 구조 등 실제 구현과 시간 ..
React에서 필요한 Hook 정리
·
🖥️ Frontend/React
1️⃣ useState – 상태 관리용도: input, select, checkbox 등 값을 저장하고 변경특징: 값이 바뀌면 컴포넌트 리렌더링import { useState } from "react";export default function ExampleUseState() { const [formData, setFormData] = useState({}); // 초기값 없이 빈 객체 가능 const handleChange = (e) => { const { name, value } = e.target; setFormData(prev => ({ ...prev, [name]: value })); }; const handleSubmit = (e) => { e.preventDefault..
배포 회고록: Web 서버 vs WAS, 제대로 이해하기
·
🗄️ Backend/Linux
🚀 배포 회고록: Web 서버 vs WAS, 제대로 이해하기 신규 프로젝트를 배포하던 날이었습니다.아키텍처는 단순했죠.WAS 서버: Tomcat + MySQL, war 파일 배포Web 서버: Nginx 설치, 정적 파일 처리 + 리버스 프록시Tomcat이 돌아가는 WAS 서버에 Nginx를 설치해 버린 겁니다. 😅“어차피 Nginx도 필요하잖아? 그냥 여기 깔면 되지 않을까?”→ 이렇게 생각했던 게 화근이었죠.결과는?정적 리소스 요청이 꼬이고,Tomcat과 Nginx가 같은 포트를 두고 충돌하고,DB 연결까지 지연되는 대참사 발생.그제서야 저는 Web 서버와 WAS의 차이를 명확히 이해하지 못했다는 걸 뼈저리게 깨달았습니다.2. Web 서버란? (Nginx, Apache)Web 서버는 말 그대로 정적..
[빅데이터분석기사] 1과목 요약정리
·
📜 Certs
📘 빅데이터분석기사 필기1. 빅데이터 개념과 특징빅데이터의 특징은 가트너 그룹의 3V (규모 Volume, 유형 Variety, 속도 Velocity)에 더해 최근 가치(Value)와 품질(Veracity) 요소가 추가된 5V로 정의됨.규모(Volume): 데이터 양이 급격히 증가유형(Variety): 데이터 종류와 근원 확대속도(Velocity): 데이터 수집과 처리 속도의 고속화, 값이 실시간 변경품질(Veracity): 데이터의 신뢰성·정확성·타당성 보장 필수가치(Value): 대용량 데이터 안에 숨겨진 가치 발굴 중요2. 데이터 분석데이터 분석은 분석용 데이터 준비 → 텍스트 분석 → 탐색적 분석 → 모델링 → 모델 평가 및 검증 과정으로 수행됨.3. 빅데이터 플랫폼빅데이터 플랫폼은 빅데이터 수..
[React] JSX(TSX) 문법 정리
·
🖥️ Frontend/React
💡 JSX(TSX)란?JSX는 JavaScript를 확장한 문법(JavaScript XML)입니다. 쉽게 말해, JavaScript 파일 안에서 HTML과 비슷한 코드를 작성할 수 있게 해주는 특별한 문법이죠. 우리가 보기엔 HTML 같지만, 사실 이 코드는 브라우저가 읽기 전에 바벨(Babel)이라는 도구를 통해 순수한 JavaScript 객체로 변환됩니다.TSX도 JSX의 문법을 따릅니다.React는 UI를 만들기 위한 라이브러리입니다.JSX는 React에서 UI를 더 쉽고 직관적으로 표현하기 위해 사용하는 문법입니다.예를 들어, 우리가 이렇게 JSX를 작성하면:const element = 안녕하세요, 리액트!;바벨은 이 코드를 아래와 같은 순수 JavaScript 코드로 바꿔줍니다.const el..
20대의 마지막 생일, 회사에서의 6개월
·
일상
첫 회사에서 보낸 6개월의 시간, 그리고 20대의 마지막 생일.무심히 지나갈 수도 있었던 하루였지만,동료들과 선배님들의 축하를 받으며저는 마음속 깊이 “참 다행이다”라는 말을 떠올렸습니다.⸻유정화의 〈다행〉에는 이런 구절이 있습니다.“나는 불행 중 수많은 다행으로 자랐다.”삶은 언제나 불완전하고, 때론 힘겹습니다.하지만 그 속에서 건네받은 작은 친절, 따뜻한 말 한마디가어떤 이의 인생을 버티게 만드는 힘이 되곤 합니다.⸻그리고 이번 6개월의 회사생활 역시 수많은 ‘다행’으로 채워져 있었습니다.• 땡볕 아래 출근길을 배려해주신 이사님의 셔틀,• 바쁜 와중에도 제 얘기에 귀 기울여주시는 과장님의 따뜻한 마음,• 늘 응원과 친절을 건네주신 대리님과 동료들,• 스쳐가는 순간에도 안부를 물어주신 임원분들의 미소…..
[트러블슈팅] Spring Tx 이중 Ajax 업로드 트랜잭션 처리 로직 해결
·
🗄️ Backend/Spring
한 줄 요약컨트롤러 내 컨트롤러 호출 → 트랜잭션 분리 → 파일 누락 발생, 서비스 계층에서 통합 Tx로 해결현대 웹 애플리케이션에서 파일 업로드는 게시판, 이미지 첨부, 견적서·계약서 등 다양한 기능에서 필수 요소입니다. 특히, 비즈니스 로직상 첨부 파일이 반드시 등록되어야 하는 경우, 파일 시스템 저장과 데이터베이스 메타 정보의 원자성(atomicity) 보장이 생명입니다.이번 포스트에서는:Ajax 요청을 2회로 분리하던 기존 로직에서 발생한 부분 커밋(orphan record) 문제선언적 @Transactional 적용만으로는 해결 불가능했던 이유서비스 계층에서의 명시적 트랜잭션 관리(programmatic transaction management) 도입으로 완벽히 문제를 해결한 과정을 순서대로 상..
신입 개발자로서의 3개월, 앞으로의 목표
·
일상
지난주, 드디어 저의 수습 기간이 끝났습니다.처음 업무를 시작했을 때 '무엇을 어떻게 해야 할지' 막막했던 3주차가 엊그제 같은데,벌써 3개월 차가 되어 수습 기간을 조용히 마무리했습니다.수습 기간이 지나며 비로소 진정한 일원이 된 듯한 뜻깊은 시간이었습니다.3개월간의 성장 과정3개월이란 시간 동안 가장 많은 노력을 기울인 부분은 회사의 공통 코드와 선임 개발자분들의 MVC 패턴을 분석하며 코드 작성 방식을 이해하는 것이었습니다. 아직 3개월 차라 부족한 점이 많지만, 이제는 선임분들이 어떤 방식으로 구현하고자 했는지 느낌을 이해하고, 때로는 '내가 이런 방식을 시도해봐도 괜찮지 않을까?' 하는 생각도 할 수 있게 되었습니다.물론 제 의견을 조심스럽게 제시할 뿐, 회사의 개발 방식과 원칙을 존중하며 모두..
-
·
일상
때로는 내 삶이 비포장 도로를 달리는 것과 같다고 느껴왔다.누구나 인생에 험준함이 있겠지만, 나의 경우는 그 험준함이 오히려 자유로움에 가까웠던 것 같다.어린 시절, 나는 또래보다 특출나게 잘하는 것들이 있었음에도 그것들이 너무나 먼 꿈처럼 느껴졌다.주변에서는 "미래가 유망하지 않다"며 포기하라는 말을 들었던 그 꿈들이, 어느새 모두가 선망하는 직업이 되어있었다.뒤돌아보니 내 발자국은 무질서했다."나는 무엇을 위해, 어떤 꿈을 향해 걸어왔던 걸까?" 싶을 정도로 방향 없이 걸어왔다.그럼에도 그 시간들은 나름대로 자랑스럽고 감사한 순간들이었다.하지만 진짜 내 꿈을 향해 걸으려 하니 막막함이 밀려왔다."이 길이 정말 맞는 걸까?""너무 늦은 건 아닐까?""시간이 얼마나 더 필요할까?"이런 의문들과 함께 막연..
신입 개발자 3주 차 : 풀스택 개발자로 살아남기
·
일상
오늘로 풀스택 웹앱 개발자로 첫 직장에 입사한 지 정확히 3주가 됐습니다.입사 전만 해도 직장인으로 살아가는 나의 모습이 그려지지 않았는데,어느덧 매일 아침 회사에 출근하고, 코드를 짜고, 코드리뷰를 하는 일상이 자연스러워지고 있어요.저처럼 취업 준비를 하면서 막막해하거나,이제 막 개발자의 길을 걷기로 마음먹고 고민하는 분들에게 조금이라도 현실적인 도움이 되고 싶어서,그리고 지금 제 마음 가짐을 잊지 않기 위해서.그래서 제가 어떤 준비를 해서 입사를 하게 됐는지,짧지만 지금까지 회사 생활을 하면서 어떤 일을 겪고 느꼈는지,솔직한 이야기를 써보려고 합니다.💻 3주 동안 내가 한 일1️⃣ 개발 환경 셋업과 코드에 적응하기입사 첫 날, OJT를 간단하게 마치고 , 제 자리의 회사 컴퓨터를 켜고 개발 환경 구..
[정보처리기사 실기] C언어 - (2)
·
📜 Certs
1. 숫자 변환 함수 (atoi, atof, strtol 등)정보처리기사 실기에서 문자열과 숫자 변환 문제도 출제될 가능성C 언어에서는 문자열을 숫자로 변환할 때 atoi, atof, strtol, strtod 등의 함수를 사용합니다. atoi() - 문자열 → 정수 변환#include #include int main() { char str[] = "1234"; int num = atoi(str); // "1234" → 1234로 변환 printf("변환된 정수: %d\n", num); // 출력: 변환된 정수: 1234 return 0;}📝 주의점atoi()는 문자열에 숫자가 아닌 문자가 포함되면 예측할 수 없는 값을 반환할 수 있음."123abc" 같은 문자열을 변환하면 12..