클로드코드로 입사지원페이지 제작해보기

소개

바이브코딩은 전혀 몰랐던 상태로 업무자동화를 시작해보려고 이번 스터디에 참여했습니다. 인사/총무 담당 업무 특성상 자동화할 꺼리들이 정말 많은데 개인정보를 다루는 부분은 아직 초보 단계에서 조심스러워서 어떻게 하면 좋을지 고민이 됐어요.

그래서 그부분까지 클러드코드 채팅으로 제가 이야기를 풀었고, 클러드코드가 그러면 시스템화 하는 걸로 접근해보는게 어떻냐고 제안을 해서 데이터베이스가 없어도 시도해볼 수 있는 게 어떤게 있을까? 고민한 끝에 채용 업무에서 입사지원서 페이지를 만들어봤어요.

진행 방법

어떤 도구를 사용했고, 어떻게 활용하셨나요?

클러드코드만 사용했고, 진행을 하면서 클러드 코드가 '000툴을 사용하시겠습니까?' 하면 그 의견을 따라서 진행하는 걸로 따라서 했어요.

"내가 인사 담당이거든, 채용 업무가 정말 손이 많이 가. 채용 정보를 접수할 수 있는 홈페이지를 만들어볼까? 이메일로 수신되는 방법도 좋을 것 같아."

위 프롬프트를 시작으로 어떤 항목이 필요한지, 어떻게 접수가 되었으면 좋겠는지 추가했어요. 저는 개인정보가 이 웹사이트에 남아있는게 싫어서 이 웹사이트를 통해 접수를 하되 그 접수 내용은 이메일로 바로 들어오게 해달라고 했어요. (그러면 추후에 이메일에서 다른 업무 자동화로 할 수 있을 것 같았고, 에어테이블로도 연결할 수 있을 것 같았어요.)

그랬더니 Formspree 제안했고, 50건 까지 무료라서 일단 시작했어요. 그순서대로 차례차례 진행하니 입사지원서 페이지는 클러드 코드 설치보다 쉬웠습니다.

기존에 쓰고있는 MS forms와 구글 forms 를 활용할 순 없는지 확인했는데 이 경우엔 각 항목들을 내가 직접 작성해야해서 내가 직접 작성하지 않는 버전으로 제안을 해달라고 했을 때 EmailJS가 최적이라고 함.

샘플 페이지를 만들고 샘플데이터 값을 입력하니까 실제로 제가 등록한 이메일로 입사신청서가 메일 바디에 담겨서 메일이 왔어요.

이 데이터 값을 에어테이블에 정리되도록 연결해달라고 했고, 에어테이블의 토큰에 해당 베이스를 연결하니까 각 필드값과 샘플데이터를 넣어줬어요. 그런데 삭제는 (아직) 못해서 아래와 같이 특정 항목을 삭제해달라고 했습니다.

*닿님이 전달해주시는 에어테이블 삭제 스킬? 이었던가요- 그걸 활용하면 나중에는 삭제도 포함시켜서 실행해볼 수 있을 것 같아요.

근데 여기까지 하고 나서야 클코가 에어테이블 폼을 활용해보겠냐고 다시 제안을 했어요.

근데 일단 지금의 UI가 좋은 것 같아서 일단은 이 화면을 더 진행시켜 보자고 했고- 여기까지 하고 입사지원서 페이지를 수정했어요.

조금 놀라웠던건 휴대폰 인증, 도로명 주소 검색 후 반영 등의 툴까지도 알아서 척척 찾아서 반영하다는 거였고, 이 부분은 아직 상용화를 하게 될지 내부 결재가 안되서 일단 보류해뒀어요. 이것들까지 연결하면 좀 더 실무와 연결된 것들을 해볼 수 있을 것 같습니다.

[결과 페이지 상단 부분만]

결과와 배운 점

배운 점과 나만의 꿀팁을 알려주세요.

• 배운점은 각각의 툴에 대해서 좀 더 알아보고 관련 툴이 어떤 것들이 있는지 먼저 물어본 다음에 최적의 것을 선택하는 단계를 한번 더 거치는게 좋을 것 같아요.

• 꿀팁은 아직 없습니다 ㅜㅜ 그저 해보는 것 밖엔... : )

과정 중에 어떤 시행착오를 겪었나요?

• 생소한 관련 툴 (EmailJS, Formspree..)이 나왔을 때 이게 최선의 선택인지 확신이 없었지만 일단은 초보니까 그냥 따라함. -> 클코도 일단 진행하다가 하다보면서 더 간편한 방법을 제안

도움이 필요한 부분이 있나요?

• 기획 단계에서 이런 걸 기획하고 싶은데 어떤 툴과 어떤 경로로 하는게 좋을지? 자문을 받고 하면 시행착오가 많이 줄어들 것 같아요.

• 저희는 MS Office 365를 쓰고 있고 바탕화면까지 모든 파일을 다 동기화를 시켜놓다 보니 어떤 DB파일을 활용하기가 좀 아직은 두려움이 큰 것 같아요. (분리해두면 괜찮을 것 같으면서도- 왠지 모르게 실행이 어렵네요.) 조언을 들어보고 싶어요.

앞으로의 계획이 있다면 들려주세요.

• form을 에어테이블 버전으로 해서 입력해서 진행해보면 더 좋을 것 같고, 이 웹페이지의 보안을 좀 강화해서 실제 실무에 반영해보고 싶어요.

도움 받은 글 (옵션)

• 21기 소셜임팩트 1차2차 수업 끝. : )