뉴스피드 프로젝트 정리

쥬·2022년 12월 8일

뉴스피드 프로젝트

프로젝트

목록 보기

2/3

1. 필수기능구현

1.로그인
2.회원 가입
3.게시판
4.파일 업로드, 다운로드
5.마이 페이지
6.프로필 수정
7.데이터 또는 게시판 Pagination

추가 필수사항:
CRUD 를 이용한 Mysql 작업 (join 활용) & 세션관리
로깅시스템
로그인, 회원 가입 예외 처리
비밀 번호 찾기 기능 => 암호화로 인해 아이디찾기기능과 탈퇴기능, 아이디 저장기능 구현
client side pagination : LIST 또는 무한 스크롤

HTML, JS, CSS, Bootstrap로 디자인
Python(Flask), JS, DBeaver, Jquery, Ajax, MySQL를 이용해서 서버에서 데이터를 처리
GIT, Sourcetree 이용해서 협업

업무분담

천준기 : 메인페이지, 게시판별 페이지 + 페이지네이션(무한 스크롤)
정지우 : 로그인/회원가입페이지, 글 작성 페이지
(로그인, 회원가입 예외처리-중복체크/유효성검사 + 아이디 저장 + 아이디 찾기 + 회원탈퇴 + Tiny Editor 이용 +글 작성시 이미지 저장경로)
장빈 : 마이페이지, 프로필 수정 페이지
변준혁 : 글 상세 페이지

2. 와이어프레임

개발 is in 와이어프레임

3. API설계

완성된 api

4. DB설계

DB설계

5. 마음에 드는 코드

가장 마지막에 작성한 코드인데, 지금까지 작성해온 코드(암호화/sql문)를 바탕으로 혼자서 작성해낸 코드라서 가장 마음에 듭니다!

# 회원탈퇴-----------------------------------------------------
@app.route('/delete/user', methods=['POST'])
def deleteUser():
    db = pymysql.connect(
        user='',
        password='',
        host='',
        port=3306,
        database='',
        charset='utf8'
    )
    curs = db.cursor()

    idf = request.form['idf']
    pwf = request.form['pwf']
    byte_input = pwf.encode('UTF-8')
    # print(idf, pwf, 2)

    sql_check = f'select password from `user` where id = "{idf}" '

    curs.execute(sql_check)
    print(sql_check)
    result = curs.fetchone()
    print(result)
    if result is None:
        return jsonify({'msg': '회원이 아닙니다.'})

    origin_pw = bytes.fromhex(result[0])
    pw_check = bcrypt.checkpw(byte_input, origin_pw)
    db.commit()
    db.close()

    if pw_check is None:
        return jsonify({'msg': '회원이 아닙니다.'})

    db = pymysql.connect(
        user='',
        password='',
        host='',
        port=3306,
        database='',
        charset='utf8'
    )
    curs = db.cursor()

    idf = request.form['idf']
    pwf = request.form['pwf']

    sql_check = f'delete from `user` where id = "{idf}" '

    curs.execute(sql_check)
    db.commit()
    db.close()

    return jsonify({'msg': '회원탈퇴가 되었습니다.'})

6. 페이지상세사진

로그인회원가입페이지
메인페이지
글작성페이지
글상세페이지
글수정페이지
마이페이지
회원수정페이지

7. 느낀점

아직도 많이 부족하다고 느낀다.
물론 일주일전과 비교하자면 훨씬 발전을 한 것이 마지막 회원탈퇴코드를 짜면서 느껴졌다.
일주일 전만 해도 시작을 어떻게 해야할지 감을 잡지 못하고 프론트부분만 계속 만지작 거렸는데, 혼자 자료찾아서 코드짜고있는 내가 너무 대견하다고 해야하나.....
일주일이 진짜 어떻게 지나갔는지....매일 5시간이하로 자면서 노력한 보람이 있는거 같다!

8. 부족했던점

일단 sql강의 복습도 필요하고, 준기님이 사용하신 flask를 이용해 html문서를 html문서안에 넣는 방법에 대해서 공부가 필요하다!

<body>
{% include "components/header.html" %}
<div class="container-fluid">
  <div class="row">
    <div class="col-2"> <!-- [뉴스피드 분류], [나의 프로필] -->
      {% include "components/category_list.html" %}
      {% if session['id'] and component_name != 'mypage' and component_name != 'useredit' %}
        {% include "components/my_profile.html" %}
      {% endif %}
    </div>
    <div class="col-10"> <!-- [랜덤 프로필 & 뉴스피드], [마이 페이지], [프로필 수정 페이지] -->
      {% include "components/random_profile.html" %}
      {% if component_name == 'category' %}
        {% include "components/main_category.html" %}
      {% else %}
        {% include "components/main.html" %}
      {% endif %}
      <div class="d-flex justify-content-center" style="height: 32px; margin: 50px 0;"> <!-- 로딩 효과용 box -->
        <div class="spinner-border" id="loading-icon" role="status"></div>
        <div id="loading-message" style="display: none;">게시글이 없습니다. 새 게시글을 작성해주세요!</div>
      </div>
    </div>
  </div>
</div>
</body>

9. 피드백

API 손 볼 필요 있음
DB user id varchar는 nono
깃허브 PR 활용하기
alert 말고 모달창 위주로 쓰기
AWS 배포 뭘로했는지? (EC2(서버 호스팅만) + db는 빈님 mysql)

10. KPT회고

Keep : 같이 공유하는 부분(DB)은 처음부터 정해서 마지막에 오류날 일 없게 하는점이 정말 좋았기 떄문에 유지했으면 좋겠습니다!
Problem : 팀원 중 한 분이 갑자기 팀을 나가셔서 혼란스러웠지만, 빈님꼐서 자기랑 관련있는 부분이셔서 나서서 해주신다고 하셔서 잘 해결되었습니다.
Try : 다음 프로젝트 들어가기 전에 우리가 배우기로 목표한 노드를 드디어 배우는데 평소에 공부를 잘해둬서 나중에 프로젝트할 때 헤매지않도록 하는게 목표입니다.
Feel : 공부가 많이 필요한 것 같다. 기능을 구현할때 필요한 것들을 스파르타강의로 안배우는 것들이 많아서 배우지 않은 부분을 구현하려니까 많이 어려움을 느꼈기때문에 다음 프로젝트를 위해 미리 여러가지 공부를 해두는 것이 좋을 것 같다.