3. 접속 불가 사태 발생! 초보 개발자의 눈물겨운 서버 복구 성공기

👤 관리자

조회 수 128

들어가며: 식은땀이 흐르던 그날 밤

지난 2편 마지막에서 예고해 드린 대로, 겁 없이 파일질라(FileZilla)로 코드를 덮어씌운 대가는 참혹했습니다. 웹사이트 주소를 입력해도 하얀 도화지 같은 화면에 원인을 알 수 없는 에러 메시지만 덩그러니 떠 있었죠. 가장 끔찍했던 것은 제 웹사이트의 심장부와도 같은 EasyWP(이지워드프레스) 관리자 페이지마저 접속 불가 상태가 되어버렸다는 점입니다.

'이대로 40만 원 상당의 내 프로젝트가 날아가는 건가?' 모니터 앞에서 식은땀을 뻘뻘 흘리며 마우스만 헛되이 클릭하던 순간의 막막함은 아직도 잊히지 않습니다. 하지만 이대로 포기할 수는 없었습니다.

1. 24시간 고객센터의 기적과 첫 번째 눈물

나를 여러번 살려준 고객센터

<나를 여러번 살려준 고객센터>

제가 할 수 있는 물리적인 조작이 모두 막힌 상태에서, 유일한 희망은 호스팅 업체뿐이었습니다. 천만다행으로 제가 이용 중인 **Namecheap(네임칩)**에는 24시간 라이브 채팅을 지원하는 고객센터가 있었습니다.

짧은 영어 실력이지만 번역기와 AI의 도움을 총동원하여 현재 상황을 다급하게 설명했습니다. "코딩 초보인데 파일질라로 워드프레스 코드를 수정하다가 관리자 페이지까지 완전히 죽어버렸다. 제발 살려달라!"

간절함이 통했을까요? 네임칩의 상담원은 제 예상보다 훨씬 친절하고 신속했습니다. 상황을 확인한 지 대략 **10분 만에 제 서버를 에러가 발생하기 직전의 '초기 상태'로 롤백(Rollback)**해 주었습니다. 비록 그동안 밤을 새우며 끙끙대며 맞춰두었던 설정과 초기 코드 작업물은 허공으로 날아갔지만, 다시 정상적으로 접속되는 제 웹사이트의 메인 화면을 보는 순간 모니터 앞에서 진짜 감사함의 눈물이 찔끔 흘렀습니다.

2. 백업(Backup)의 중요성을 깨닫고 두 번째 위기를 넘기다

고객센터 상담원이 채팅을 종료하며 제게 남긴 아주 중요한 조언이 있었습니다. "앞으로 코드를 건드리기 전에는 무조건 백업부터 하세요."

네임칩 EasyWP 대시보드 기능을 찬찬히 살펴보니, 클릭 한 번이면 현재 서버와 데이터베이스(DB) 상태를 고스란히 저장해 주는 수동 백업(Backup) 기능이 있었습니다. '아, 선배 개발자들이 왜 그렇게 입버릇처럼 백업을 외쳤는지 알겠다'며 뼈저리게 교훈을 얻은 저는, 상담원이 알려준 대로 현재의 깨끗한 상태를 가장 먼저 백업해 두었습니다.

숨을 고른 뒤, 다시 파일질라를 켜서 잃어버렸던 코드를 조심스럽게 업데이트했습니다. "이번엔 괜찮겠지?"라는 마음으로 새로고침을 누른 순간... 아뿔싸! 웹사이트는 또다시 기절해 버렸습니다. 두 번째 접속 불가 사태가 터진 것입니다.

하지만 이번엔 당황하지 않았습니다. 저에게는 방금 만들어둔 든든한 '백업본'이 있었으니까요. 고객센터에 매달릴 필요 없이, EasyWP 대시보드에서 '복원(Restore)' 버튼을 누르니 단 몇 분 만에 사이트가 제 손으로 직접 복구되었습니다. 위기를 스스로 통제할 수 있게 된 순간이었습니다.

3. 원인 분석: 바이브 코딩(Vibe Coding)과 휴먼 에러

사이트를 안정화시킨 후, 도대체 왜 코드를 넣기만 하면 서버가 뻗어버리는지 원인을 분석하기 시작했습니다. 평소 제가 애용하는 AI 도구인 제미나이(Gemini)와 ChatGPT를 켜고, 제가 작성했던 코드 전체를 복사해 붙여넣으며 오류 검수를 요청했습니다.

원인은 정말 허탈하게도 저의 **'휴먼 에러(Human Error)'**였습니다. 현재 제 웹사이트는 워드프레스에서 기본적으로 제공하는 뼈대인 Astra(아스트라) 테마를 사용하고 있습니다. 그런데 웹브라우저 창에서 제미나이가 짜준 코드를 복사한 뒤, VS Code(비주얼 스튜디오 코드) 에디터 창으로 화면을 전환해 붙여넣는 과정에서 사고가 난 것입니다.

어디에 코드를 넣어야 하는지 정확한 맥락을 모르니 엉뚱한 줄에 코드를 끼워 넣었고, 그 과정에서 세미콜론(;)을 빼먹거나 Astra 테마가 구동되는 데 필수적인 기존 코드를 실수로 지워버린 것이죠. 코딩의 구조를 이해하지 못하고 AI가 주는 대로 무작정 복사-붙여넣기만 하는 이른바 **'바이브 코딩'**의 처참한 부작용이었습니다.

4. 어둠 속의 빛, VS Code 플러그인 'Copilot(코파일럿)'

바이브 코딩을 위한 한줄기 빛 Copilot

<바이브 코딩을 위한 한줄기 빛 Copilot>

이대로라면 백업과 복원만 무한 반복하다가 지쳐 쓰러질 것이 뻔했습니다. 웹브라우저와 에디터를 번갈아 보며 코드를 옮겨 적는 과정에서 발생하는 사람의 실수를 원천적으로 차단할 방법이 절실했습니다.

해결책을 강구하며 며칠 밤낮으로 개발자 커뮤니티와 구글링을 헤매던 중, 마침내 어둠 속에서 한 줄기 눈부신 빛을 발견했습니다. 바로 VS Code 프로그램 내에 직접 설치해서 사용할 수 있는 AI 어시스턴트 플러그인, **'GitHub Copilot(깃허브 코파일럿)'**이었습니다.

코파일럿은 제가 굳이 웹브라우저의 AI 채팅창을 띄워놓지 않아도, VS Code 에디터 안에서 제가 짜려는 코드의 의도를 파악해 실시간으로 다음 줄을 추천(자동 완성)해 주는 마법 같은 플러그인이었습니다. 더 이상 코드를 뭉텅이로 복사하다가 괄호를 빼먹어 서버를 날려 먹는 끔찍한 실수를 하지 않아도 된다는 뜻이었죠.