2024.04.15

우리 동네 국회의원

:

지역별 국회의원 후보 및 공약 모음 사이트


뒤로가기

우리 동네 국회의원

취미로 2024 대한민국 국회의원 선거를 앞두고 개발한 사이트다. 지도에서 지역을 선택하면 해당 지역의 국회의원 후보 및 정당 공약을 보여준다. 현재는 선거가 다 끝나서 사이트를 내린 상태다. 계속 올려두고 싶지만, 이게 선거기간이 끝나면 후보자 정보를 공개하면 안된다는 법이 있어서 내릴수밖에 없었다. 나중에 시간되면 후보자 정보를 더미데이터로 숨기고 사이트 모양만 남겨서 사이트를 살려볼까 고민 중이다.

우리동네 국회의원 사이트 이미지

사이트 제작 과정

데이터 수집

사이트를 만들기 위해서 상당히 많고 다양한 정보를 수집했다.

시군구 지리 데이터

지도 표시를 위해서 시군구 경계에 대한 데이터가 필요했다. 브이월드에서 데이터를 구했다. 이 데이터도 그냥 사용할수는 없고, 파이썬으로 파일을 열어서 좌표계를 변화시켜줘야 네이버 지도에서 사용할수 있었다. 최종적으로 json으로 만들어서 asset에 넣어두었다. 근데 사실 지도 데이터는 정말 정밀한데, 이 모든 vertex를 네이버 지도위에 올리면 포인트가 너무 많아서 메모리가 넘쳐서 브라우져가 죽거나 엄청 버벅인다. 그래서 버텍스 개수도 줄이고 이것저것 데이터를 튜닝할수 밖에 없었다. 나중에 다시 비슷한걸 만든다면 네이버 지도를 안쓰고, 그냥 이미지로 만들어서 webgl을 사용해 다이렉트로 렌더링할것 같다.

국회의원 후보 데이터

지역별 국회의원 후보 데이터 및 지난 선거 투표율 등의 데이터는 공공데이터포털에서 구했다. API 형식으로 데이터를 요청해서 로컬 DB에 저장해두었다. 이후 파이썬으로 후보자 정보를 json으로 변환해서 읽는 방식이다. 각 지역별 후보자 목록을 생성할때 고생을 좀 했다. 데이터마다 지역 코드도 다르고, "전라북도"로 표시되는 데이터도 있고, "전북특별자치도"로 표시되는 데이터도 있다. 이것저것 정말 다양한 케이스가 있어서 좀 성가셨다.

사이트 제작

사이트는 리액트로 만들었다. 로직과 관련된 코드는 다 직접 작성했지만 (ChatGPT의 도움을 많이 받았다) 코드의 상당수는 파이썬을 이용해 생성했다. 각 지역별로 후보 정보를 로딩하는 loader 코드인데, 이를 손으로 작성할수는 없기에 파이썬으로 아래와 같은 코드를 생성해야했다. 이를 이용해 사용자가 특정한 지역을 클릭하면 해당 지역에 해당하는 후보자 json 파일을 로딩하는 방식이다.

📋 COPY
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
// This code is generated from candidates.generate_candidate_loader_tsx function
import canddiate100152821 from "../../../assets/candidatejson/100152821.json";
import canddiate100151969 from "../../../assets/candidatejson/100151969.json";
import canddiate100153028 from "../../../assets/candidatejson/100153028.json";
import canddiate100152721 from "../../../assets/candidatejson/100152721.json";
import canddiate100152084 from "../../../assets/candidatejson/100152084.json";
export default function loadCandidateJson(){
let regionCandidateJson: any[] = [];
regionCandidateJson.push(canddiate100152821);
regionCandidateJson.push(canddiate100151969);
regionCandidateJson.push(canddiate100153028);
regionCandidateJson.push(canddiate100152721);
regionCandidateJson.push(canddiate100152084);
return regionCandidateJson;
}

(이런 파일이 수백개 생성된다)

사이트 호스팅

사이트 호스팅은 그냥 무로료 간편하게 github pages를 사용했다.

홍보

사이트 구현이야 어떻게는 할수 있는데 역시 홍보가 제일 어려웠다. 네이버 카페, 각종 오픈채팅방을 들어가서 사이트를 열심히 홍보했지만 그렇게 많은 사람들이 들어오진 않았다. 페이스북이나 인스타는 일종의 페이지를 만들어서 해당 광고를 띄울수도 있다. 그래서 광고 띄우려고 페이지 만들고 광고신청까지 했지만, 광고가 거절당했다. 정치와 민감하게 관련되어있어서 쉽게 허락해주지 않는것 같다. 다음에 이런 사이트를 만든다면 홍보 채널을 잘 알아보고 고려해야할듯 싶다.

향후 해볼 일

  • 후보자 정보 제거하고, 사이트 틀만 남기기
  • 뒤로가기