[UPDATE] 리드미 gif 추가 및 사용방법 수정

@@ -8,7 +8,7 @@
 
 
 20대 남자면 꼭 가야만 하는 군대, 어떤 보직이 알맞을지 미리 추천해 드리겠습니다.
 20대 남자면 꼭 가야만 하는 군대, 어떤 보직이 알맞을지 미리 추천해 드리겠습니다.
 
 
-> (이미지 추가 예정)
+![쿠사트](https://khusinsa.s3.amazonaws.com/khusatmain.gif)
 
 
 ## 🔖 프로그램 구조
 ## 🔖 프로그램 구조
 
 
@@ -18,8 +18,6 @@
 - `pages` : 기능별 화면을 모아놓은 라우팅 페이지들 입니다.
 - `pages` : 기능별 화면을 모아놓은 라우팅 페이지들 입니다.
 - `store` : 상태관리를 위한 redux store 입니다.
 - `store` : 상태관리를 위한 redux store 입니다.
 
 
-`KHUSAT-SERVER`
-
 ## 🌏 개발환경 및 사용 언어
 ## 🌏 개발환경 및 사용 언어
 
 
 `KHUSAT-FRONT`
 `KHUSAT-FRONT`
@@ -41,35 +39,11 @@
 - axios
 - axios
 - react-router-dom
 - react-router-dom
 
 
-`KHUSAT-SERVER`
-
 ## 🔎 사용 방법
 ## 🔎 사용 방법
 
 
-**(배포 이전) Local에서 동작하는 방법을 소개합니다.**
-> 서버 및 클라이언트 배포 예정
-
-1. repository clone 하기
-    > 원하는 디렉토리에서 khusat-front 를 클론해옵니다.
-
-    ```jsx
-    git clone http://khuhub.khu.ac.kr/khusat/khusat-front.git
-    ```
-
-2. package 파일 설치하기
-    > 빌드를 위한 패키지 모듈들을 설치합니다. (yarn을 추천합니다)
-
-    ```jsx
-    yarn // yarn 만 입력합니다.
-    npm install // npm 사용시 npm install을 입력합니다.
-    ```
-
-3. application 실행하기
-    > `yarn start` 로 실행 후 [`localhost:3000`](http://localhost:3000) 으로 접속하여 테스트 할 수 있습니다!
+- 별도의 설치 없이 http://khusat.herokuapp.com 에서 자유롭게 사용하실 수 있습니다!
 
 
-    ```jsx
-    yarn start
-    https://localhost:3000
-    ```
+> [!지금 테스트 체험해보기](http://khusat.herokuapp.com)
 
 
 ## 👥 구성원 소개
 ## 👥 구성원 소개
 
 
@@ -86,5 +60,5 @@ MIT License Copyright(c) [Kyhong Park]
 
 
 ## ☎️ Contact
 ## ☎️ Contact
 프로젝트에 문제가 있거나 궁금하신 사항은 메일로 연락주세요
 프로젝트에 문제가 있거나 궁금하신 사항은 메일로 연락주세요
-- Email: junolee7803@gmail.com [JunHo Lee]
-- Email: kyhong222@naver.com [Kyhong Park]
\ No newline at end of file
+- Email: junolee7803@gmail.com 
+- Email: kyhong222@naver.com
\ No newline at end of file

@@ -27,7 +27,7 @@
     "web-vitals": "^0.2.4"
     "web-vitals": "^0.2.4"
   },
   },
   "scripts": {
   "scripts": {
-    "start": "react-scripts start .env",
+    "start": "react-scripts start",
     "build": "react-scripts build",
     "build": "react-scripts build",
     "test": "react-scripts test",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
     "eject": "react-scripts eject"

 import React, { useEffect } from "react";
 import React, { useEffect } from "react";
 import "./kakaoBtn.scss";
 import "./kakaoBtn.scss";
-import dotenv from "dotenv";
 import kakao from "../../assets/kakao.png";
 import kakao from "../../assets/kakao.png";
-dotenv.config();
 
 
 const KakaoBtn = ({result}) => {
 const KakaoBtn = ({result}) => {
-  useEffect(() => {
+  useEffect(()=>{
     createKakaoButton();
     createKakaoButton();
-  }, []);
-
+  },[]);
   const createKakaoButton = () => {
   const createKakaoButton = () => {
     // kakao sdk script이 정상적으로 불러와졌으면 window.Kakao로 접근이 가능합니다
     // kakao sdk script이 정상적으로 불러와졌으면 window.Kakao로 접근이 가능합니다
     if (window.Kakao) {
     if (window.Kakao) {

+import React,{useEffect} from "react";
 import useScript from "../hooks/useScript";
 import useScript from "../hooks/useScript";
 import KakaoBtn from "../components/kakao/KakaoBtn";
 import KakaoBtn from "../components/kakao/KakaoBtn";
 
 
 const KakaoBtnContainer = ({result}) => {
 const KakaoBtnContainer = ({result}) => {
   useScript("https://developers.kakao.com/sdk/js/kakao.js");
   useScript("https://developers.kakao.com/sdk/js/kakao.js");
+  
   return (
   return (
     <div className="layout">
     <div className="layout">
       <KakaoBtn result={result} />
       <KakaoBtn result={result} />

-import React from "react";
+import React,{useEffect} from "react";
 import styled, { css } from "styled-components";
 import styled, { css } from "styled-components";
 import { lighten,darken } from "polished";
 import { lighten,darken } from "polished";
 import KakaoBtn from "../containers/KakaoBtnContainer";
 import KakaoBtn from "../containers/KakaoBtnContainer";