New_5주차

버킷리스트

1. 나중에 업데이트 등을 위해 번호를 만들어줘야 함

2. (완료버튼) 받아올 때 숫자로 받아오므로 update할 때도 숫자로 되게 바꿔줘야 함

2. POST 입력

1. app.py

   @app.route("/bucket", methods=["POST"])
   def bucket_post():
   	bucket_receive = request.form['bucket_give']
   	bucket_list = list(db.bucket.find({}, {'_id': False}))
   	count = len(bucket_list) + 1
   	doc = {
   		'num': count,
   		'bucket': bucket_receive,
   		'done': 0
   	}
   	db.bucket.insert_one(doc)
   	return jsonify({'msg': '등록 완료!'})

2. index.html

   function save_bucket(){
     let bucket = $("#bucket").val();
     $.ajax({
       type: "POST",
       url: "/bucket",
       data: {bucket_give:bucket},
       success: function (response) {
         alert(response["msg"])
         window.location.reload();
       }
     });
   }

3. GET

1. app.py

   @app.route("/bucket", methods=["GET"])
   def bucket_get():
       buckets = list(db.bucket.find({}, {'_id': False}))
       return jsonify({'all_bucket': buckets})

2. index.html

   $(document).ready(function () {
     show_bucket();
   });
   function show_bucket(){
     $.ajax({
       type: "GET",
       url: "/bucket",
       data: {},
       success: function (response) {
         let buckets = response['all_bucket']
         for (i = 0; i < buckets.length; i++) {
           let bucket = buckets[i]['bucket']
           let num = buckets[i]['num']
           let done = buckets[i]['done']
           let temp_html = ``
           if (done == 0) {
             temp_html = `<li>
                           <h2>✅ ${bucket}</h2>
                           <buttontoken interpolation">${num})" type="button" class="btn btn-outline-primary">완료!</button>
                         </li>`
           } else {
             temp_html = `<li>
                           <h2>✅ ${bucket}</h2>
                         </li>`
           }
           $("#bucket-list").append(temp_html)
         }
       }
     });
   }

4. POST 완료

1. app.py

   @app.route("/bucket/done", methods=["POST"])
   def bucket_done():
       num_receive = request.form['num_give']
       db.bucket.update_one({'num': int(num_receive)}, {'$set': {'done': 1}})
       return jsonify({'msg': '버킷 완료!'})

2. index.html

   function done_bucket(num){
     $.ajax({
       type: "POST",
       url: "/bucket/done",
       data: {num_give:num},
       success: function (response) {
         alert(response["msg"])
         window.location.reload();
       }
     });
   }

AWS

1. EC2 인스턴스 구매
2. Git Bash로 구매한 컴퓨터에 접속

   ssh -i 구매할 때 설정한 키페어 끌어온 후 ubuntu@퍼블릭IPv4주소

3. 폴더 만들기

   mkdir 만들폴더명

4. 현재 위치 보기

   ls

5. 폴더로 들어가기 / 나가기

   cd 들어갈폴더명 # 들어가기
   cd .. # 나가기

서버세팅

1. 서버 한번에 세팅

# python3 -> python
sudo update-alternatives --install /usr/bin/python python /usr/bin/python3 10

# pip3 -> pip
# pip 패키지 설치 마법사
sudo apt-get update
sudo apt-get install -y python3-pip
sudo update-alternatives --install /usr/bin/pip pip /usr/bin/pip3 1

# port forwarding
# 5000을 떼는 명령어
sudo iptables -t nat -A PREROUTING -i eth0 -p tcp --dport 80 -j REDIRECT --to-port 5000

2. 포트 열어주기

보안 → 보안그룹 → 인바운드 규칙 편집

1. 포트 5000, Anywhere-IPv4 열기
2. 포트 80, Anywhere-IPv4 열기

3. nobup 설정

1. ssh 접속 끊겨도 서버 계속 돌게 하기

   nohup python app.py &

2. nobup 강제 종료

   ps -ef | grep 'python app.py' | awk '{print $2}' | xargs kill

3. 가비아

DNS 설정
1. 구매한 도메인 DNS 설정
2. 값 위치에 퍼블릭IPv4주소 추가 후 저장

4. og태그 넣기

<meta property="og:title" content="내 사이트의 제목" />
<meta property="og:description" content="보고 있는 페이지의 내용 요약" />
<meta property="og:image" content="이미지URL" />

페북 og 태그 초기화
카톡 og 태그 초기화