README.md update

@@ -7,36 +7,45 @@
 <br>
 <br>
 <h3>css 폴더</h3>
-> 스타일에 대한 class와 id가 저장됨
+> 스타일에 대한 class와 id가 저장됨<br>
 >   > style.css : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/css/style.css>
 <br>
 <br>
 <h3>html 폴더</h3>
-> 웹페이지의 양식을 표현하며, style.css를 이용함
->   > 1. index.html은 홈이며 악질 직업을 생성하는 페이지이다.
->   >   > index.html : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/html/index.html>
->   > 2. detail.html은 나의 웹에 대한 설명이 담긴 페이지다.
->   >   > detail.html : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/html/detail.html>
->   > 3. statistics.html은 방문자 통계 그래프를 그려주는 페이지다.
->   >   > statistics.html : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/html/statistics.html>
+    웹페이지의 양식을 표현하며, style.css를 이용함<br>
+        1. index.html은 홈이며 악질 직업을 생성하는 페이지이다.<br>
+            <img src="/img/indexHtml.png"><br>
+            index.html : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/html/index.html>
+        2. detail.html은 나의 웹에 대한 설명이 담긴 페이지다.<br>
+            <img src="/img/detailHtml.png"><br>
+            detail.html : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/html/detail.html>
+        3. statistics.html은 방문자 통계 그래프를 그려주는 페이지다.<br>
+            <img src="/img/statisticsHtml.png"><br>
+            statistics.html : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/html/statistics.html>
 <br>
 <br>
 <h3>js 폴더</h3>
-> 웹을 동적으로 만들어주는 기능들을 담은 폴더
->   > 1. common.js는 글자수 제한에 관한 기능이 담겼다.
->   >   > common.js : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/js/common.js>
->   > 2. contents.js는 악질 직업을 생성하는데 필요한 단어들이 어레이 형태로 저장된 곳이다.
->   >   > contents.js : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/js/contents.js>
->   > 3. generate.js는 contents.js에 담긴 단어를 규칙에 맞게 조합하여 result를 만들어주는 기능이 담겼다.
->   >   > generate.js : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/js/generate.js>
->   > 4. josa.js는 조사의 구분이 필요한 특별 케이스에 조사를 붙여주는 기능이 담겼다.
->   >   > josa.js : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/js/josa.js>
->   > 5. statistics.js는 amChart 모듈을 이용해 방문자 통계 데이터를 데이터베이스에서 가져와 그래프를 그려주는 기능이 담겼다.
->   >   > statistics.js : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/js/statistics.js>
+    웹을 동적으로 만들어주는 기능들을 담은 폴더
+        1. common.js는 글자수 제한에 관한 기능이 담겼다.<br>
+            <img src="/img/글자수제한.png"><br>
+            common.js : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/js/common.js>
+        2. contents.js는 악질 직업을 생성하는데 필요한 단어들이 어레이 형태로 저장된 곳이다.<br>
+            <img src="/img/컨텐츠생성.png"><br>
+            contents.js : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/js/contents.js>
+        3. generate.js는 contents.js에 담긴 단어를 규칙에 맞게 조합하여 result를 만들어주는 기능이 담겼다.<br>
+            <img src="/img/result.png"><br>
+            generate.js : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/js/generate.js>
+        4. josa.js는 조사의 구분이 필요한 특별 케이스에 조사를 붙여주는 기능이 담겼다.<br>
+            예 : oo을/를 선물받고좋아하는
+            josa.js : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/js/josa.js>
+        5. statistics.js는 amChart 모듈을 이용해 방문자 통계 데이터를 데이터베이스에서 가져와 그래프를 그려주는 기능이 담겼다.<br>
+            <img src="/img/chart.png"><br>
+            statistics.js : <http://khuhub.khu.ac.kr/2019102216/opensource_term_project/blob/master/js/statistics.js>
 <br>
 <br>
 <h3>app.js 파일</h3>
-> node.js를 이용해서 백엔드를 구현했으며, 데이터베이스에 데이터 인설트, 특정 페이지에서 데이터를 호출하는 등의 기능을 구현했다. 또 https 연결을 위해서 openssl에서 인증서를 받아와 연결했다. 
+    node.js를 이용해서 백엔드를 구현했으며, 데이터베이스에 데이터 인설트, 특정 페이지에서 데이터를 호출하는 등의 기능을 구현했다. 또 https 연결을 위해서 openssl에서 인증서를 받아와 연결했다. 
 <br>
 <br>
+<h4>클론에 관한 공지</h4>
 <h3>이 프로젝트는 MIT LICENSE를 바탕으로 진행되었습니다. MIT LICENSE를 따르신다면, 이 프로젝트를 마음대로 클론해가도 됩니다.</h3>
\ No newline at end of file