김동진 / HealthProtector

Go to a project
Toggle navigation Toggle navigation pinning
김동진
dac55a27 1 parent 79ff3a16

readme.md 수정

Inline Side-by-side
Showing 5 changed files with 183 additions and 17 deletions
<p align="center">
<a href = "https://healthprotector.herokuapp.com/">
<h1 align="center">Health Protector</h1>
</a>
</p>
## 목차
- [소개](#소개)
- [개발 환경](#개발-환경)
- [사용한 API](#사용한-api)
- [사용한 데이터베이스](#사용한-데이터베이스)
- [설치 방법](#설치-방법)
- [환경 구축](#환경-구축)
- [설치](#설치)
- [이용 방법](#이용-방법)
- [기여하기](#️기여하기)
- [연락처](#연락처)
## 소개
![home](/uploads/60aa61fe92b7e41b213b36ef403d443c/home.JPG)
사용자의 건강 증진을 도모하는 사이트입니다.<br>
칼로리 계산, 헬스장 위치 찾기, 식품 영양정보 조회 등의 기능이 있습니다.
### 개발 환경
- [node.js - 14.15.0 LTS](https://nodejs.org/ko/)
- [jquery - 3.5.1](https://jquery.com/)
- [mysql - 2.18.1](https://www.mysql.com/)
- HTML5
- CSS3
### 사용한 API
- [kakaomap](https://apis.map.kakao.com/)
- [google font](https://fonts.google.com/)
- [image api](https://source.unsplash.com/)
- [icon](https://fontawesome.com/?from=io/)
### 사용한 데이터베이스
- [식품 영양 정보](https://www.foodsafetykorea.go.kr/fcdb/index.do)
## 설치 방법
서버 설치 방법을 소개합니다. 이 방법은 Local에서만 동작합니다.
### 환경 구축
- node.js
이 [링크](https://nodejs.org/ko/)에서 설치할 수 있습니다.
- mysql
이 [링크](https://dev.mysql.com/)에서 설치할 수 있습니다.
- npm
node.js와 함께 설치됩니다.
혹은 가장 최신 버전으로 업데이트합니다.
```sh
npm install -g npm
```
### 설치
1. [리포지토리](http://khuhub.khu.ac.kr/2019102154/HealthProtector) 클론
원하는 디렉토리에서 아래의 명령어를 입력해 이 리포지토리를 가져옵니다.
```
git clone http://khuhub.khu.ac.kr/2019102154/HealthProtector.git
```
2. npm 패키지 설치
서버 실행에 필요한 패키지(mysql, jquery 등)를 설치합니다.
```
npm init
npm install --save
```
3. 포트 변경
main.js에서 포트를 변경합니다. ( 기본값: 23000 )
```js
// main.js
app.listen(process.env.PORT || "Enter your port", function () {
console.log("Server on!");
});
```
4. 카카오맵 api key 등록
카카오맵 api를 사용하려면 api key가 필요합니다.
> [kakao developers사이트](https://developers.kakao.com/)에 접속
> 로그인 후 애플리케이션 생성(web)
> 내 애플리케이션>앱 설정>플랫폼>Web 에서 사이트 도메인 등록(`http://localhost:"your port num"`)
> 내 애플리케이션>앱 설정>요약 정보>앱 키 중 JavaScript키를 복사합니다.
> lib폴더의 appkey.js에서 process.env.KAKAOMAP_KEY 대신 넣어줍니다.
```js
// lib/appkey.js
var key = {
kakaomapKey: "your kakao javascript key",
};
```
5. 식품영양정보DB 구동<br>
식품영양정보DB를 필요한 정보를 바탕으로 가공하여 foodDB.csv를 이용했습니다.
<br>DB를 사용하기 위해선 아래와 같이 작업하면 됩니다.
> 사용할 mysql의 database에 foodDB.csv를 import 합니다.(mysql workbench를 사용하면 편리)
> lib폴더의 db.js 파일 내용을 수정합니다.
```js
var db = mysql.createConnection({
host: "your host",
user: "your user",
password: "your password",
port: "your port",
database: "your database",
});
```
6. 서버 구동
main.js를 실행합니다.
```
node main.js
혹은
npm start
```
## 이용 방법
1. 웹 브라우저로 localhost:"your port num"에 접속합니다.<br>
![home](/uploads/60aa61fe92b7e41b213b36ef403d443c/home.JPG)<br>
2. 세 가지 기능이 있습니다.
**칼로리 계산**
![countKcal](/uploads/a92c5562a25d7201338b168bab7042d1/countKcal.JPG)
맞춤 권장 칼로리, 섭취 음식 칼로리 계산을 해볼 수 있습니다.<br><br><br>
**맞춤 권장 칼로리 계산**
![countKcal_body](/uploads/4f58d0a4235766ad61dd30b6e063508a/countKcal_body.JPG)<br>
키, 몸무게 등 개인의 신체 정보와 목표 체중, 목표 기간 등 목표를 입력한 후 계산하기 버튼을 누릅니다.<br>
![countKcal_body_process](/uploads/d55c2de746780e96a39dcb0c3ce2bb85/countKcal_body_process.JPG)<br>
**음식 칼로리 계산**
![countKcal_food](/uploads/1875d161050bf4d3743b91f7d104b42a/countKcal_food.JPG)<br> - 먹은 음식의 이름이나 키워드를 검색합니다.<br> - 검색 결과 리스트 중 알맞은 음식을 찾아 '선택' 체크를 한 후 추가하기 버튼을 누릅니다.<br> - 먹은 음식을 모두 검색하여 체크 한 후 하단의 선택한 음식 리스트를 확인합니다.<br> - 알맞지 않은 항목은 '삭제하기' 버튼을 통해 삭제할 수 있습니다.<br> - 음식 선택이 완료되었다면 '총 칼로리 더하기' 버튼을 눌러 계산 결과를 확인할 수 있습니다.<br><br>
**헬스장 찾기**
![searchGym](/uploads/35d1570df4f75d98efbbae11d6365cb8/searchGym.JPG)<br> - 화면 좌측의 키워드 검색을 통해 해당 장소 주변의 헬스장 위치 정보를 알려줍니다.<br> - 지도 위의 파란 색 마크를 클릭하면 헬스장의 상세 정보를 확인할 수 있습니다.<br>
**식품 영양정보**
![foodInfo](/uploads/283ca41ef9a93cdf3e86feb482d4f55c/foodInfo.JPG)<br> - 알고자 하는 음식이나 키워드를 입력하면 해당 음식의 칼로리, 단백질, 지방 등의 영양 정보를 확인할 수 있습니다.<br>
## 기여하기
이 프로젝트는 오픈소스입니다. 이 프로젝트가 발전할 수 있도록 기여해주세요.
1. [리포지토리](http://khuhub.khu.ac.kr/2019102154/HealthProtector)에서 프로젝트 포크
2. 새 브랜치 생성(`git checkout NewFeature`)
3. 변경사항 커밋(`git commit -m 'New Features Added'`)
4. 생성한 브랜치에 푸시(`git push origin NewFeature`)
5. [머지 리퀘스트](http://khuhub.khu.ac.kr/2019102154/HealthProtector/merge_requests) 요청
## 연락처
김동진/rlaehdwls310@khu.ac.kr<br>
양효빈/qls0786@khu.ac.kr
궁금한 점이나 피드백, 오류 수정 등의 연락은 언제나 환영입니다!
var template = require('./template.js');
exports.home = function(request, response){
var title = 'home';
var description = '개개인의 신체 정보에 따라 일일 권장 섭취량을 알려주고, 좋아하는 음식을 검색하면 영양정보를 알려주는 사이트 입니다.';
var html = template.html(title,`
<div style= font-size:40px;background-image:url("https://source.unsplash.com/jFCViYFYcus");padding:50px;>
......@@ -12,26 +11,20 @@ exports.home = function(request, response){
<h2><font color="black">&nbsp &nbsp &nbspOur Services</font></h2>
</div>
<div style= width:30%;float:left;padding:5px;>
<div style="color : gray";>
<i class="fas fa-calculator fa-3x"></i>
</div>
<div style= width:30%;float:left;padding:5px;>
<a href="/countKcal"><i class="fas fa-calculator fa-3x" style="color :gray";></i></a>
<h2><a href="/countKcal"><font color="black">칼로리 계산</font></a></h2>
<h4><font color="gray">나에게 맞는 일일 권장 섭취량(kcal)을 계산해보세요!</font></h4>
</div>
<div style= width:33%;float:right;padding:5px;>
<div style="color : gray";>
<i class="fas fa-book fa-3x"></i>
</div>
<h2><a href="/foodInfo"><font color="black">음식별 영양정보</font></a></h2>
<a href="/foodInfo"><i class="fas fa-book fa-3x" style="color :gray";></i></a>
<h2><a href="/foodInfo"><font color="black">식품 영양정보</font></a></h2>
<h4><font color="gray">음식별 식품 영양정보에 대해 알려드립니다!</font></h4>
</div>
<div style= width:33%;float:right;padding:5px;>
<div style="color : gray";>
<i class="fas fa-location-arrow fa-3x"></i>
</div>
<a href="/searchGym"><i class="fas fa-location-arrow fa-3x" style="color :gray";></i></a>
<h2><a href="/searchGym"><font color="black">헬스장 찾기</font></a></h2>
<h4><font color="gray">위치를 입력하면 그 주위의 헬스장을 찾아드립니다!</font></h4>
</div>
......
......@@ -9,7 +9,6 @@ module.exports = {
<style>
@import url('https://fonts.googleapis.com/css2?family=Do+Hyeon&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Trade+Winds&display=swap');
</head>
</style>
<script
src="https://code.jquery.com/jquery-3.5.1.js"
......@@ -43,7 +42,7 @@ module.exports = {
<h3 style=width:120px;float:left;><a href="/foodInfo"><font color="#213b19">식품 영양정보</font></a></h3>
<div style="color :#213b19";>
<h3 style=width:160px;float:right;>
<i class="fas fa-info-circle fa-3x"style="font-size: 20px;"></i><a href="/info"><font color="#213b19">&nbsp;Info</font></a></h3>
<a href="/info"><font color="#213b19"><i class="fas fa-info-circle fa-3x"style="font-size: 20px;"></i>&nbsp;Info</font></a></h3>
</div>
</div>
<hr width = "100%" color ="#213b19" style=margin:0px;>
......
......@@ -5,9 +5,6 @@ var searchGym = require('./lib/searchGym.js');
var foodInfo = require('./lib/foodInfo.js');
var countKcal = require('./lib/countKcal.js');
var info = require('./lib/info.js');
console.log(process.env.NODE_ENV);
console.log(process.env.KAKAOMAP_KEY);
console.log(process.env);
var app = http.createServer(function(request,response){
var _url = request.url;
var queryData = url.parse(_url, true).query;
......