프로젝트 발표

발표할 때 각자 자신의 각오를 준비하라고 하셔서 좀 부담스럽기도 하고 어색했는데 막상 끝나고 보니 발표 내용보다 각오가 더 기억에 남는다. 나와 같은 고민과 걱정을 가지신 분들이 많았어서 다른 분들의 각오를 듣는 게 생각보다 큰 위로와 용기가 됐다. '아는 게 없는데 잘 따라갈 수 있을까?', '내가 팀에서 한 사람의 몫을 제대로 할 수 있을까?'와 같은 고민들 말이다. 혼자서는 자신 없어도 팀을 이뤄 협동하면 어떻게든 해낼 수 있을 거란 생각이 들었다.

그리고 팀 프로젝트를 할 때 용건만 간단히 말하는 게 가장 효율적인 방법이라 생각했는데 다른 팀들을 보니 팀의 분위기를 재밌게 만드는 것 또한 아주 중요하다는 것을 깨달았다. 분위기가 어느정도 편하고 즐거워야 의견을 쉽게 내고 그래야 원활한 의사통이 이루어지는 것 같다. 막히는 부분이 생기면 검색을 통해 혼자 해결하려고 했는데 다음부터는 좀 더 팀원들에게 질문도 하고 적극적으로 의사소통해보고 싶다.

 

 

 

'TIL > WEEK1' 카테고리의 다른 글

WEEK1. POST와 PUT의 차이점  (0) 2023.05.18
WEEK1. PUT방식으로 수정기능 구현  (0) 2023.05.17
WEEK1. REST API  (0) 2023.05.16
WEEK1. Git  (0) 2023.05.15

GET

GET 메서드는 특정한 리소스를 가져오도록 요청한다. GET 요청은 데이터를 가져올 때만 사용해야 한다.

 

 

POST

POST 메서드는 서버로 데이터를 전송하여 리소스를 추가하거나 생성하기 위해 사용하는 메서드이다. GET 메서드와 반대로 요청 Header의 Content-Type에 컨텐츠 타입을 명시하며, HTTP 패킷의 Body에는 데이터를 담아 서버로 전송한다. 

 

 

PUT

PUT 메서드는 요청 페이로드를 사용해 새로운 리소스를 생성하거나, 대상 리소스를 나타내는 데이터를 대체한다. 즉 PUT 메소드는 문서 전체의 완전한 교체만을 허용한다. PUT과 POST의 차이는 멱등성으로, PUT 메서드는 멱등성을 가진다. 이는 한 번을 보내도, 여러 번을 연속으로 보내도 같은 효과를 보인다는 뜻이다.

 

 

PATCH

PATCH 메소드는 리소스의 부분적인 수정을 할 때 사용된다. PATCH 메서드는 멱등성을 가지지 않는데, 이는 동일한 patch 요청이 다른 결과를 야기할 수도 있음을 뜻한다. 하지만 PATCH를 PUT과 같은 방식으로 사용함으로써 멱등성을 가지게 할 수도 있다.

 

 

* 멱등성이란, 수학에서 사용하는 용어에서 유래한 것으로. 연산을 여러 번 적용하더라도 결과가 달라지지 않는 성질을 뜻한다. 동일한 요청을 한 번 보내는 것과 여러 번 연속으로 보내는 것이 같은 효과를 지니고, 서버의 상태도 동일하게 남을 때, 해당 HTTP 메서드가 멱등성을 가졌다고 한다. 다른 말로는, 멱등성 메서드에는 통계 기록 등을 제외하면 어떠한 부수 효과(side effect)도 존재해서는 안된다는 뜻이다.

GET, HEAD, PUT, DELETE 메서드는 멱등성을 가지며, POST 메서드는 그렇지 않다.

 

 

 

 

'TIL > WEEK1' 카테고리의 다른 글

WEEK 1. 드디어 첫 프로젝트 끝!  (0) 2023.05.19
WEEK1. PUT방식으로 수정기능 구현  (0) 2023.05.17
WEEK1. REST API  (0) 2023.05.16
WEEK1. Git  (0) 2023.05.15

팀프로젝트 진행사항

    <script>
        function update_profile() {
            let name = $('#name').val()
            let blog = $('#blog').val()
            let mbti = $('#mbti').val()
            let desc = $('#desc').val()
            let img = $('#img').val()
            let merit = $('#merit').val()

            var data = {
                "name": name,
                "blog":blog,
                "mbti":mbti,
                "desc":desc,
                "img":img,
                "merit":merit
            }
            
            var jsonData = JSON.stringify(data);

            fetch("/update/{{ member_id['_id'] }}", {
                method:'PUT',
                headers:{'content-type':'application/json'},
                body:jsonData
            }).then((res) => res.json()).then((data) => {
                alert(data['msg'])
                location.reload()
            })
            
        }
    </script>
    
    <body>
    <div class="container">
        <div class>
            <div class="input-group mb-3">
                <label class="input-group-text" for="size">사진</label>
                <input id="img" type="url" class="form-control" />
            </div>
            <div class="input-group mb-3">
                <span class="input-group-text">이름</span>
                <input id="name" value="{{ member['name']}}" class="form-control" />
            </div>
            <div class="input-group mb-3">
                <span class="input-group-text">블로그 주소</span>
                <input id="blog" value="{{ member['blog']}}" class="form-control" />
            </div>
            <div class="input-group mb-3">
                <label class="input-group-text" for="size">MBTI</label>
                <input id="mbti" value="{{ member['mbti']}}" type="text" class="form-control" />
            </div>
            <div class="input-group mb-3">
                <label class="input-group-text" for="size">장점</label>
                <input id="merit" value="{{ member['merit']}}" type="text" class="form-control" />
            </div>
            <div class="input-group mb-3">
                <label class="input-group-text" for="size">자기소개</label>
                <input id="desc" value="{{ member['desc']}}" type="text" class="form-control" />
            </div>
        </div>
        <div class="d-flex justify-content-around">
            <button type="button" onClick="update_profile()" class="btn btn-light">수정</button>
            <a href="/view/{{ member_id['_id'] }}"><button class="btn btn-light">취소</button></a>
        </div>
    </div>

</body>
@app.route("/update/<id>", methods=["PUT"])
def update_post(id):
    receive = request.get_json()
    name_receive = receive['name']
    blog_receive = receive['blog']
    mbti_receive = receive['mbti']
    img_receive = receive['img']
    desc_receive = receive['desc']
    merit_receive = receive['merit']
    
    doc = {
        'name':name_receive,
        'blog':blog_receive,
        'mbti':mbti_receive,
        'img':img_receive,
        'merit':merit_receive,
        'desc':desc_receive
    }

    db.members.update_one({'_id': ObjectId(id)},{'$set':doc})
    return jsonify({'msg':'수정완료!'})

어제 FormData로 시도했다가 실패해서 데이터를 JSON으로 변환해서 시도해봤더니 잘 작동했다.

 

  • JSON.stringify(): JavaScript 객체를 JSON 문자열로 변환해준다.
  • request.get_json() : JSON 형식으로 전달된 요청 본문은 flask에서 request.get_json() 함수로 받을 수 있다.

 

 

 

 

 

'TIL > WEEK1' 카테고리의 다른 글

WEEK 1. 드디어 첫 프로젝트 끝!  (0) 2023.05.19
WEEK1. POST와 PUT의 차이점  (0) 2023.05.18
WEEK1. REST API  (0) 2023.05.16
WEEK1. Git  (0) 2023.05.15

1. 리소스

리소스는 URI로 식별한다.

Collection : 복수의 element

Element : 하나하나의 데이터

 

2. REST 

Representational State Transfer

  • 자원(Resource): URI
  • 행위(Verb): HTTP Method
  • 표현(Representations)

 

3. HTTP Method

REST를 지키면서 행위를 전달하는 방법

 

patch는 부분 수정이 가능하지만 put은 전체 데이터를 입력받아 덮어쓰므로  전송하지 않은 데이터는 삭제한다.

팀프로젝트 진행사항

프로필 수정기능을 구현해봤다.

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
        integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
        integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
        crossorigin="anonymous"></script>
    <title>수정하기</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
    </script>
    <style>
        .container {
            justify-content: center;
            margin: auto;
            width: 50%;
            padding: 4rem;
        }
    </style>
</head>

<body>
    <div class="container">
        <form action="/update/{{ member['_id'] }}" method="post">
            <div class>
                <div class="input-group mb-3">
                    <label class="input-group-text" for="size">사진</label>
                    <input name="img_give" type="url" class="form-control" />
                </div>
                <div class="input-group mb-3">
                    <span class="input-group-text">이름</span>
                    <input name="name_give" value="{{ member['name']}}" class="form-control" />
                </div>
                <div class="input-group mb-3">
                    <span class="input-group-text">블로그 주소</span>
                    <input name="blog_give" value="{{ member['blog']}}" class="form-control" />
                </div>
                <div class="input-group mb-3">
                    <label class="input-group-text" for="size">MBTI</label>
                    <input name="mbti_give" value="{{ member['mbti']}}" type="text" class="form-control" />
                </div>
                <div class="input-group mb-3">
                    <label class="input-group-text" for="size">장점</label>
                    <input name="merit_give" value="{{ member['merit']}}" type="text" class="form-control" />
                </div>
                <div class="input-group mb-3">
                    <label class="input-group-text" for="size">자기소개</label>
                    <input name="desc_give" value="{{ member['desc']}}" type="text" class="form-control" />
                </div>
            </div>
            <div class="d-flex justify-content-around">
                <button type="submit" class="btn btn-light">수정</button>
                <a href="/view/{{ member_id['_id'] }}"><button class="btn btn-light">취소</button></a>
            </div>

        </form>
    </div>

</body>

</html>
#수정
@app.route("/update/<id>", methods=["GET"])
def update_get(id):
    find_member = db.members.find_one({"_id": ObjectId(id)})
    find_member['_id'] = str(find_member['_id'])
    find_id = db.members.find_one({'_id' : ObjectId(id)},{'id':True})
    return render_template('update.html', member=find_member, member_id=find_id)

@app.route("/update/<id>", methods=["POST"])
def update_post(id):
    name_receive = request.form['name_give']
    blog_receive = request.form['blog_give']
    mbti_receive = request.form['mbti_give']
    img_receive = request.form['img_give']
    desc_receive = request.form['desc_give']
    merit_receive = request.form['merit_give']

    find_member = db.members.find_one({"_id": ObjectId(id)})
    find_member['_id'] = str(find_member['_id'])

    db.members.update_one({'_id': ObjectId(id)},{'$set':{'name':name_receive}})
    db.members.update_one({'_id': ObjectId(id)},{'$set':{'blog':blog_receive}})
    db.members.update_one({'_id': ObjectId(id)},{'$set':{'mbti':mbti_receive}})
    db.members.update_one({'_id': ObjectId(id)},{'$set':{'img':img_receive}})
    db.members.update_one({'_id': ObjectId(id)},{'$set':{'desc':desc_receive}})
    db.members.update_one({'_id': ObjectId(id)},{'$set':{'merit':merit_receive}})

    return redirect('/view/'+id)

put 방식을 이용해 업데이트 기능을 구현해보고 싶었는데 form에서는 put을 지원하지 않아 post방식으로 구현했다. 다른 방법을 생각해봐야 될 것 같다.

'TIL > WEEK1' 카테고리의 다른 글

WEEK 1. 드디어 첫 프로젝트 끝!  (0) 2023.05.19
WEEK1. POST와 PUT의 차이점  (0) 2023.05.18
WEEK1. PUT방식으로 수정기능 구현  (0) 2023.05.17
WEEK1. Git  (0) 2023.05.15

1. CLI 명령어

pwd 현재 경로 확인
ls
ls -al		 현재 경로의 파일 및 폴더 조회
숨김 파일 및 폴더까지 조회
cd
cd ..
cd ~
디렉토리 이동
상위 디렉토리로 이동
홈 디렉토리로 이동
touch 비어있는 파일 생성
cat 파일 내용 확인
vi
a 또는 i
ESC
:w
:q
(:wq로 한번에 써도 됨)		 파일 편집
입력모드
빠져나가기
저장
닫기
rm
rm -rf		 비어있는 디렉토리 및 파일 삭제
비어있지 않은 디렉토리 삭제
mkdir 디렉토리 생성

 

2. commit

유의미한 변화가 결과물로 나온 것

ex) 새 기능 추가, 버그 삭제, 버그 수정

 

3.  깃이 관리하는 세개의 공간

  • 작업 디렉토리 : 버전 관리 대상이 위치하는 공간 ( .git이 있는 디렉토리)
  • 스테이지 : 다음 버전이 될 후보가 올라가는 공간
  • 저장소 : 버전이 만들어지고 관리되는 공간

 

4. 브랜치

브랜치로 문제 해결하기

브랜치로 문제 해결하기

빨리감기 병합 : 기존의 branch에서 수정/추가 사항이 추가된 branch를 병합하는 과정

빨리감기 병합

 

5. HEAD

현재 작업중인 브랜치의 커밋을 가리킨다.

일반적으로 현재 작업 중인 브랜치의 최신 커밋을 가리킨다.

한 마디로 '내가 지금 어디에서 작업중인가'를 가리킨다.

 

6. git 명령어

[기본]

git init
  - 현재 디렉토리를 git local repository[Working Directory]로 지정(생성)
  - ls -al 명령어로 .git 숨김파일 생성 확인
  - rm -rf .git 명령어로 local repository 삭제
git status
  - 파일 상태 확인(staged, untracked, ..)
git add 파일명
  - 해당 파일을 [Staging Area]로 이동(tracking)
git add .
  -현재 폴더의 전체 파일을 이동
git commit
  - [Staging Area]에 있는 파일을 원격저장소[Repository]로 커밋
  - 옵션없이 해당 명령어만 입력할 경우 editor 호출
git commit -m "커밋메세지"
  - editor 호출없이 바로 커밋
git commit -am "커밋메세지"
  - [Staging Area]에 올림과 동시에 커밋(= git add .+ git commit -m "커밋메세지")
  - 단, 1번이라도 커밋된 대상만 사용 가능
git diff
  - local repository[Working Directory]와 [Staging Area]의 차이를 보여줌
git log
  - commit 로그 확인

 

[브랜치]

git branch
  - 브랜치 목록 조회(현재 속한 브랜치는 앞에 *가 붙음)
git branch 브랜치명
  - 브랜치명으로 브랜치 생성
  - 단, main 브랜치에 1번 이상 commit 해야함
git branch checkout 브랜치명
  - 해당 브랜치로 local repository[Working Directory] 변경
git branch -b 브랜치명
  - 브랜치 생성 후 checkout(= git branch 브랜치명 + git branch checkout 브랜치명)
git branch -d 브랜치명
  - 브랜치명 브랜치 삭제
git branch merge 브랜치명

 

'TIL > WEEK1' 카테고리의 다른 글

WEEK 1. 드디어 첫 프로젝트 끝!  (0) 2023.05.19
WEEK1. POST와 PUT의 차이점  (0) 2023.05.18
WEEK1. PUT방식으로 수정기능 구현  (0) 2023.05.17
WEEK1. REST API  (0) 2023.05.16

+ Recent posts

티스토리툴바