클로드코드로 구현한 홈페이지 소개 (금토끼부동산)

오랜만에 다시 합류했습니다.

금토끼부동산을 운영 중인 골든레빗입니다.

11기, 14기 참여해서 다양한 분야에서 도움을 많이 받았습니다.

부동산중개업을 시작하면서 홈페이지를 만들어보자는 목표로 과정을 진행했었습니다.

우여곡절 끝에 현재 홈페이지는 만들었고, 돌아기기는 합니다.

하지만 아쉽게도 유입을 만들지는 못하고 있습니다.

이번에 이 페이지를 활성화하는 방법을 배우고자 신청하게 되었습니다.

그래서 시작하기 전에 우선 제가 만든 페이지를 소개하는 글을 올려보려고 합니다.

https://goldenrabbit.biz/

1. 서버와 도메인

카페24에서 가상서버 호스팅(월 5,500원)을 통해 서버를 만들었습니다.

가비아에서 저렴한 도메인(goldenrabbit.biz)을 구매했습니다. (연 30,000원)

한국사이트 스크린샷

2. 코드 작성, 수정

클로드코드가 없던 시절에 시작해서 클로드 웹으로 코드를 붙여넣고 물어보고,

수정된 코드 다시 입력하는 방식으로 진행했었습니다.

오류 하나를 못잡아서 하루를 넘기는 일이 빈번했었죠.

(참고로 저는 프로그래밍 언어를 정식으로 배워본 적이 없습니다.)

그리고 최근에 클로드코드를 사용하면서 신세계를 경험하고 있습니다.

클래식 코드 편집기의 스크린샷

3. 사용 도구들

우선 데이터베이스는 에어테이블을 사용 중입니다.

너무 좋아서 사용법 강의 영상도 만들었습니다. (저작권 문제로 유튜브 계정정지 중이라...ㅜㅜ)

복잡한 건축물이나 토지의 정보를 자동으로 불러올 수 있도록 구현했습니다.

V-world와 공공데이터포털의 API를 사용해서 번지만 입력하면 데이터를 불러옵니다.

일반서비스도 가능하도록 인쇄/pdf저장 기능도 넣었습니다.

젤 중요한 게 내가 가진 매물을 잘 소개하는 페이지였습니다.

그래서 지도상에 표시되도록 구현하는데 신경을 썼습니다.

지도는 V-world를 활용해서 표시해 줬습니다.

다양한 위치가 있는 도시 지도

매물 관련 정보들은 에어테이블의 데이터를 직접 불러오도록 설정했습니다.

한국어 숫자 목록 스크린샷

4. 페이지 구성

네비게이션바를 하단에 설치해서 페이지 이동할 수 있도록 했고,

서브메뉴는 상단에 표시했습니다.

1페이지는 소개페이지와 상담신청을 넣었고, 강의 영상도 넣었습니다.

상담신청을 하면 에어테이블에 입력되고, 메일 발송되도록 설정했습니다.

한국사이트 스크린샷

2페이지는 뉴스와 블로그 페이지입니다.

매일 네이버 부동산뉴스를 정리해서 가져오고, 제 블로그 글도 나타납니다.

네이버블로그를 썼는데, 번거로워서 자체 블로그페이지를 만들었습니다.

한국 여행 웹사이트 스크린샷
한국 뉴스 앱 스크린샷

3페이지는 매물정보입니다.

직접 지번을 검색할 수도 있고, 조건을 입력해서 검색할 수도 있고,

한국사이트 스크린샷

지도 상에서 검색할 수도 있습니다.

추천매물도 정리해서 쉽게 조회할 수 있도록 했습니다.

한국의 호텔 홈페이지

4페이지는 부동산조회서비스입니다.

지번을 입력하면 해당 건물의 정보를 볼 수 있고, 출력도 할 수 있습니다.

한국사이트 스크린샷

아래에는 참고할만한 부동산 관련 사이트들의 바로가기도 넣어놨습니다.

한국어 웹사이트 스크린샷

이상 제가 만든 홈페이지 소개였습니다.

프로그래밍언어를 배운 적 없는 제가 이런걸 만들 수 있을 거라고 상상해 본 적 없는데

클로드, 클로드코드 덕분에, 그리고 지피터스 덕분에 여기까지 왔습니다.

세 가지 목표를 가지고 있습니다.

하나는 페이지 리뉴얼입니다. 디자인감각이 없어서 클로드가 만들어준 대로 쓰고 있는데,

보기 좋게 만들고 싶어요.

두번째는 제가 만든 페이지를 활성화시키는 것입니다.

어떻게 유입을 만들지를 고민하고 있습니다.

마지막은 그동안 만들었던 걸 토대로 서비스를 만드는 것입니다.

아직 어떤걸 어떻게 구현할지 몰라서 여러분들이 도움을 받아보려고 합니다.

잘 부탁드립니다.

4
2개의 답글
지피터스 뉴스레터

이번 주 AI, 딱 쓸 것만

매주 월요일 오후,
읽고 바로 써먹을 AI 소식만