전체 글 96

프롬프트 엔지니어링 잘하기

개요generative AI는 사람과 유사하게 동작하며 좋은 결과를 얻기 위해 자세하게 프롬프트를 작성해야한다.실제로 사람에게 어떤 일을 시키는 것 이라고 생각하면 이해하기 쉬울 것 같다.프롬프트 엔지니어링은 사람 대신 AI에게 업무를 지시해 원하는 결과를 얻는 과정이다. 이때 AI 모델의 한계와 성능을 이해하고, 이를 바탕으로 자신의 창의성 사이에서 적절한 균형을 맞추어 최적의 결과를 이끌어내야 한다. 즉, 프롬프트 엔지니어링은 이러한 이해와 능력을 바탕으로 이루어지는 예술이자 과학 전반을 아우르는 작업이라고 말할 수 있다.COSTARCOSTAR는 좋은 프롬프트 작성을 위한 방법론이다.Context - 모델에게 배경지식을 알려주면 특정 시나리오 처리에 도움이 된다.Objective - 목표를 명확하게 ..

ai 2025.06.09

광역지하철 역, 노선도 지도에 올려보기

1. 데이터 구하기한국의 지하철 역사 정보는 공공데이터 포털에서 받을 수 있다. 좌표까지 포함된 데이터를 받은 뒤 geojson형태로 직접 가공해준다. Point 형태의 geojson예시는 아래와 같다.{ "type": "Feature", "geometry": { "type": "Point", "coordinates": [126.807969, 37.319791] }, "properties": { "name": "초지", "name:ko": "초지", "name:en": "Choji", "name:ja": "チョジ", "name:zh": "草芝", "public_trans..

frontend 2025.04.20

한국 지도에 지하철 역,노선도를 추가해서 지도 UX 개선하기

위 이미지는 OSM에서 제공하는 한국 지리 정보를 기반으로 렌더시킨 지도의 수도권 이미지이다. 당장 사용하기에는 불편해보이니 이 지도 위에 철도, 지하철 노선, 역사 데이터를 추가하려고 한다.  아래 파일은 공공 데이터 혹은 서칭을 통해 직접 만든 한국 철도, 지하철 노선, 역사 데이터이다.  https://github.com/onthegomap/planetiler GitHub - onthegomap/planetiler: Flexible tool to build planet-scale vector tilesets from OpenStreetMap data fastFlexible tool to build planet-scale vector tilesets from OpenStreetMap data fast..

frontend 2025.03.29

MapLibre 기반으로 커스텀 타일을 기존 타일에 오버라이드 하기

개요PMTiles 병합 과정이 워낙 오랜 시간이 걸리다보니 데이터를 수정할 때 마다 매 번 병합을 하기에는 쉽지 않다. 또한 괜찮은 데이터셋이 없다면 데이터 타입을 일일히 맞춰주는 작업도 그리 쉬운 작업은 아니다.  따라서 데이터를 수정할 일이 잦으며 굳이 전역 맵 타일 데이터에 포함되지 않아도 되는 경우라면 타일 데이터를 오버라이드 하는식으로 보여주는 것도 나쁘지 않은 방안중 하나일 수 있다.  이러한 방식이  정말 옳은지에 대해서는 100% 맞다라고 말할 수 없지만 적어도 내가 생각하기에는 한국의 지하철 역 데이터 정도는 오버라이드하여 보여주는것이 관리도 쉽고 개발적인 코스트도 적게 들수도 있다는 생각이 들었다.  글로벌 맵 데이터에서는 한국 지하철 노선도에 대한 정보가 많이 들어있지 않다. 하지만 ..

frontend 2025.03.22

여러개의 PMTiles 파일을 병합하여 스토리지에 올리기

준비먼저 최신 맥이라고 하더라도 노트북의 성능으로는 지도 타일을 만드는데 시간이 매우 오래 걸리기에 지도 타일을 만들기 위한 ec2인스턴스를 잠깐 빌려준다.  64vcpu, 128기가 이상의 메모리, 500기가 ssd 이상 성능을 가진 인스턴스를 빌리는게 가장 좋지만  백그라운드에서 돌아가게 할거이기에 시간이 좀 걸려도 상관 없으니 32vcpu, 128기가 메모리, 500기가 ssd정도로 타협한 m5.8xlarge 인스턴스를 사용한다 만약 이래도 메모리가 부족 문제가 발생한다면 더 높은 메모리의 인스턴스를 사용한다. 타일 다운로드이후 해당 인스턴스에 ssh를 통해 접속 후 아래 명령어를 실행하여 전세계 PMTiles 파일을 다운받아준다. wget https://build.protomaps.com/2025..

frontend 2025.03.15

지도 타일과 PMTiles

지도 타일우리가 흔히 보는 지도는, 사용자가 어떤 줌 레벨에서 지도를 보고 있느냐에 따라 표시해야 하는 정보의 양이 달라진다. 예를 들어,줌 레벨 0에서는 전 세계 지도를 단 1×1, 즉 한 개의 타일로 표현한다.줌 레벨 1에서는 2×2, 즉 4개의 타일로 표현한다.줌 레벨 15인 경우에는 2^15 × 2^15라는 방대한 수의 타일을 갖게 된다. 또한 줌 레벨에 따라 동일한 좌표의 타일이라 하더라도, 실제로 표시해야 하는 정보의 종류나 양이 달라질 수 있다. 예를 들어, 줌 레벨 5에서는 지하철 노선도를 표시하지 않다가, 줌 레벨 6부터는 해당 지하철 정보를 포함하도록 구성할 수 있다. 이는 지도 타일을 어떻게 제작하느냐에 따라 각각 달라진다. 지도 라이브러리의 동작 방식 사용자가 특정 지역을 보고 있을..

frontend 2025.03.04

vscode git 명령 속도 개선을 위해 extension을 만들어 배포해보기

개요 VSCode의 GUI를 통한 Git 명령어는 기본적으로 속도가 느린 편이다. 레포지토리 크기가 커질수록 이 문제는 더욱 심해지는데, 이는 모노레포가 갖는 단점 중 하나이다.현재 회사의 코드는 25년 이상 유지되고 있고, 메인 레포지토리는 10GB 이상의 용량과 약 29만 개의 파일로 구성되어 있다. 이렇게 많은 파일이 존재하다 보니 PC 성능에 따라 VSCode GUI를 통한 Git 명령어 실행 시간이 크게 지연되는 문제가 발생하게 되었다.내가 사용하는 PC는 회사에서 가장 성능이 낮은 편이라, 전체 빌드시 생성되는 수만 개의 파일을 UI를 통해 git reset하는 데에만 약 3분이 걸렸으며 GUI명령을 통해 git reset을 실행시에 최대 9999개의 파일만 reset 가능하기에 여러번 실행해..

etc 2025.01.20

당근(당근마켓) 최종 면접 회고

당근 면접 후기지난해 당근에 지원했던 경험을 공유해보고자 한다. 처음에는 지원 동기가 당근에서 꼭 일해야한다 라는 느낌의 이유보다는 좋은 환경에서 좋은 사람들과 일하며, 개발자로서 어느 정도까지 성장할 수 있을지 시험해보고 싶었고, 또한 '당근'이라는 간판을 통해 훌륭한 개발자로 인정받고 싶은 마음으로 지원하게 되었다. 1차·2차 기술 면접당근의 면접은 총 3차로 진행됐는데, 1·2차는 기술 면접, 3차는 인성(컬쳐 핏) 면접이다. 여러 곳에서 기술 면접을 봐왔지만, 널리 알려져 있는 대로 당근의 기술 면접은 다른 회사들과 확실히 결이 다르다는 느낌을 받았다.시간 구성1차 면접: 약 1시간 30분2차 면접: 약 2시간일반적인 기술 면접에서는 주로 '이미 갖고 있는 지식을 제대로 이해하고 있는지'를 검증한..

etc 2025.01.14

토스 테스트 자동화 플랫폼 구축 영상 요약

개요현재 직장에서 puppeteer기반 cypress 문법을 사용하는 e2e 테스트 프레임워크를 개발하고 있는데 알고리즘의 선택인지 우연인지는 모르겠지만 토스에서 비슷한 것을 만들고 발표한 영상이 눈에 들어오게 되었고 관심이 생겨 해당 영상을 꼼꼼히 보고 요약한 내용이다. 테스트 자동화 플랫폼을 만드는 목적이 다 같아서 그런건지 사람 생각이 다 거기서 거기라서 그런건지 cypress, playwright와 같은 타 테스트 프레임워크를 사용하지 않고 puppeteer 기반으로 테스트 프레임워크를 직접 만든다는 큰 차이를 제외하고는 많은 부분의 플랫폼 설계가 비슷하여 좀 신기했다.  e2e 플랫폼을 만든다는 큰 목적을 가지고 구조와 흐름을 설계하게 되면 결국 누가 만들던간에 이런 느낌으로 완성이 되지 않을까..

frontend 2025.01.07

Cypress의 단점을 극복하기 위한 puppeteer 기반의 e2e 테스트 프레임워크 개발(2)

https://jjongsk.tistory.com/entry/Cypress%EC%9D%98-%EB%8B%A8%EC%A0%90%EC%9D%84-%EA%B7%B9%EB%B3%B5%ED%95%98%EA%B8%B0-%EC%9C%84%ED%95%9C-Puppeteer-%EA%B8%B0%EB%B0%98-%EC%95%84%ED%82%A4%ED%85%8D%EC%B3%90-%EA%B5%AC%ED%98%841 Cypress의 단점을 극복하기 위한 puppeteer 기반의 e2e 테스트 모듈 구현(1)개요 e2e 테스트 라이브러리가 필요하여 cypress에 대해 분석하다가 이를 사용하는 것은 현재 구조에서 불가능하다고 판단하여 puppeteer를 사용하여 e2e 테스트 아키텍쳐를 직접 구현하기로 결정하jjongsk.tist..

frontend 2024.12.20