Kimhae-WIFI

최초 커밋: 2023/6/4 최근 커밋: 2024/12/26

---

1. 프로젝트 개요

1. 프로젝트 정의

Kimhae-WIFI(이하 김해 와이파이)는 경남 김해시 와이파이 위치 정보를 표시해주는 웹페이지이다.

2. 프로젝트 배경

이 프로젝트는 한남대학교 스터디그룹 장학프로그램에서 진행한 팀 프로젝트이다.

스터디그룹 활동을 진행하고 활동 성과에 따라 장학금을 지급하는 교내 장학프로그램으로, 결성한 스터디 그룹에서 한 학기 동안 자바스크립트를 공부하면서 완성한 소규모 프로젝트이다.

말이 좋아서 팀 프로젝트이지 나 혼자 했다.

해당 장학 프로그램은 스터디 그룹 소개서와 구성 팀원의 성적을 바탕으로 선발하여 진행하는 활동이었다. 만약 선발이 되었다면 이후 스터디 그룹 활동 성과에 따라 장학금을 차등 지급하는 방식이었다.

자바스크립트 공부는 웹스크립트프로그래밍 전공 과목을 통해서 진행하였으며, 스터디그룹의 지도 교수님 해당 과목의 담당 교수님으로 배정 받았다. 이 과목은 HTML, CSS 그리고 JavaScript의 기본적인 문법을 다루는 수업으로 본 프로젝트 역시 매우 기초적인 수준의 목업(Mock-up) 디자인으로 만들었다.

김해시 와이파이 정보는 지자체에서 제공하는 공개 API를 활용하였다.

경상남도 김해시_WIFI AP위치 정보

3. 프로젝트 팀 구성

1. 팀 이름

스크립트 맨 파이터

2. 팀원

• 팀장(본인): 사재헌 - Zaixian5(jls15900@gmail.com)
• 팀원: 미공개(사유: 작성일 현재 본인은 한남대 중퇴자로 이들과 연락이 어려운 상황. 따라서 프로필 공개 의사를 물을 수가 없음)

4. 프로젝트 주요 기능

1. 화면에 핀(Pin)의 형태로 무료 와이파이의 이름과 위치가 표시됨
2. 화면을 스크롤로 크기를 키우거나 줄일 수 있음

2. 사용법

직접 서버를 운영하는 것은 비용문제가 발생하여 카카오 공개 지도 API를 vs code 라이브 서버로 받아서 만들었다

따라서 웹페이지를 구동하려면 무조건 vs code의 라이브서버(127.0.0.1:5500)만 사용해야 한다.

1. VS code 설치
2. VS code에서 Live Server 확장 패키지 설치
3. 크롬 브라우저 확장 프로그램 Allow CORS 설치 및 실행 (일시적으로 CORS 보안 에러를 무효화하는 프로그램)
4. wifi.js 파일을 wifi.html과 같은 디렉토리에 위치시키고 wifi.html파일 vs code로 열기
5. VS code에서 wifi.html 파일 우클릭 후 open with Live Server 클릭