WELCOME TO MY HOMEPAGE
공부하고, 기록하고, 공유하는 곳
HOW IT WAS BUILT & WHAT'S NEXT
ROADMAP
TECH STACK
모든 페이지를 직접 짰음사진 마퀴와 ROADMAP 연출은 CSS 애니메이션으로 만들었음폰 화면에 맞춘 반응형도 적용함
프레임워크 없이 순수 JS로만 만들었음방명록 API 호출, roadmap.json 읽어 타임라인 그리기, 3D 방 조작까지 함
ARCHIVE의 3D 방과 INTRODUCE의 밤길 여정을 실시간으로 그림CDN에서 불러 써서 따로 설치할 건 없음
ARCHIVE 액자 지도를 누르면 열리는 맛집 지도에 사용함지역 경계선·핀·맛집 목록을 그리고, 주소를 좌표로 바꾸는 데 씀
백엔드를 돌리는 실행 환경임방명록 API 서버가 여기서 돌아감
방명록 글·쪽지를 주고받는 API를 만들었음입력 검증, 도배 방지, 보안 설정도 여기서 처리함
방명록 글과 쪽지를 저장함앱은 읽기·쓰기만 되는 전용 계정으로 접속, DB에서도 수정·삭제를 막아 둠
서버 앞에서 HTTPS 요청을 받아 Express로 넘겨 줌인증서 자동 갱신과 요청 횟수 제한도 담당함
프론트(HTML·JS·CSS)를 올려 두는 곳임GitHub에 푸시하면 자동으로 배포됨
서울 서버 한 대를 빌려 백엔드를 운영함Node.js·MySQL·Nginx가 한 서버에 같이 올라가 있음 (한 달 약 5$)
seongdae5.com 도메인을 구입한 곳임api 주소를 서버 IP로 연결하는 DNS 설정도 여기서 함
주로 내가 직접 데이터를 넣을 때 쓰는 편집기임맛집·음악·사진 같은 데이터 파일을 열어 채움
작업을 커밋으로 남기고 GitHub에 저장함ROADMAP 날짜도 커밋 기록에서 가져오고, 서버는 GitHub에서 받아 업데이트함
처음엔 모르는 걸 물어보며 직접 코딩하는 보조로 썼음
프로젝트를 다시 시작한 뒤의 메인 개발 파트너임프론트·백엔드·QA 에이전트로 역할을 나눠 바이브 코딩, 보안 점검까지 함
CONTACT
궁금한 점이나 하고 싶은 말이 있다면 편하게 연락 주세요.