본문 바로가기

전체 글

 (79)
AWS EC2 배포 과정 Flow AWS에 작성한 코드를 배포하다가 이것저것 세팅할 것도 많고 헷갈려서 그 과정을 한 번 정리해보았다. 세부적인 설정이나 이런 것은 공식문서를 참고하면 될 것 같고, 기본적인 Flow, 큰 그림을 아는 것이 중요하다고 생각했다. AWS EC2를 들어가게 되면 인스턴스라는 것이 존재한다. 이 인스턴스 안에 배포할 파일을 올려놓는 것이다. 인스턴스 안에 파일을 올려놓고, 여러가지 환경설정을 하기 위해선, 인스턴스에 접속해야 한다. 인스턴스에 접속하기 위해선 Secure Shell(SSH)를 이용하면 된다. 나의 경우에는 윈도우 환경이기 때문에 Git bash 명령어 ssh로 인스턴스에 접속하였다. 이 때 ssh로 인스턴스에 접근하기 위해선 암호키가 있어야 한다. Key Pair가 그 역할을 하는데, 이것은 인..
#10. 프로젝트를 끝내며 https://github.com/chanmin-kim/react-firebase-linkedin chanmin-kim/react-firebase-linkedin react-firebase linkedin clone . Contribute to chanmin-kim/react-firebase-linkedin development by creating an account on GitHub. github.com 최종코드는 여기서 확인할 수 있다. 백엔드를 따로 구성하지 않고, firebase로 백엔드를 구성한 뒤, 프론트엔드는 React오 링크드인 클론앱을 만들어 보았다. React를 사용하면서 느낀 것은, 단순히 UI적인 측면에서의 가독성을 넘어, 백엔드(Firebase)에서 보내준 정보를 state에 담..
#6. 프로젝트 후기 https://github.com/chanmin-kim/flask-mongodb-kleague chanmin-kim/flask-mongodb-kleague flask-mongodb web application for scheduling k-league matches - chanmin-kim/flask-mongodb-kleague github.com 전체 소스코드는 여기서 확인할 수 있다. 3가지 기능을 주로 활용하였다. 1) JWT방식을 통한 로그인 2) Flask + MongoDB를 통한 CRUD 3) ajax 통신 (혹은 fetch) 먼저 1의 측면에서, 세션/토큰/소셜로그인의 방식이 있는데, 토큰을 사용해보는 것에서 배우는 것이 있었다. 각자 장단점이 있다고 생각하는데, 내가 서비스를 설계할 때는 ..
#5. 경기정보 삭제, 댓글 삭제 관리자 페이지에서 회원정보를 삭제하는 코드를 작성하였는데, 경기정보와 댓글을 삭제하는 것도 이와 유사하다. # 경기 삭제 //경기인덱스를 파라미터로 받는다 @app.route("/delMatch/", methods=['GET']) def del_match(matchIdx): //우선 matches라는 collection에 담긴 경기정보들을 정렬한다 matches = list(db.matches.find().sort('cheer_datetime', -1)) //경기정보의 id값을 문자열데이터로 바꾸어준다. for match in matches: match["_id"] = str(match["_id"]) //파라미터에 담긴 경기인덱스에 해당하는 경기를 찾아 삭제한다. db.matches.delete_one(..
#4. 상세페이지 구현 | 경기 상세정보와 댓글 # 상세 페이지 //경기인덱스를 파라미터로 받는다 @app.route("/cheer/", methods=['GET']) def cheer(matchIdx): //경기인덱스에 해당하는 경기정보를 불러온다 match = db.matches.find_one({"_id": ObjectId(matchIdx)}) //경기일정에 맞게 경기정보를 정렬한다 contents = list(db.contents.find({"match_idx": ObjectId(matchIdx)}).sort('cheer_datetime', -1)) //각 경기별 인덱스 값을 문자열로 바꾼다 for content in contents: content["_id"] = str(content["_id"]) //토큰을 꺼내서 token_receive ..
#3. 관리자 페이지 | 경기정보, 회원비활성화 앞서서, 회원가입 시 유저 등급을 grade라는 항목으로 설정해주었다. 이렇게 한 이유는 일반유저와 구분되는 관리자 계정을 위해서인데, 이 관리자 계정에서는 경기정보를 입력하고, 회원 활성화/비활성화를 가능하게 하며, 글도 삭제할 수 있는 권한을 주기 위해서이다. 그렇다면, 관리자 계정에서 이러한 기능들을 어떻게 수행하는지를 확인해보자. # 관리자 페이지 //url에 파라미터를 설정하여, 각각의 기능을 수행하는 페이지로 이동하게 하였다. @app.route("/admin/", methods=['GET']) def admin(manageType): # return render_template('adminSchedule.html') //request에 담긴 토큰을 확인한다. 즉, 관리자 계정으로 접속했는지를..
#2. 회원가입 및 로그인 로그인 기능과 회원가입 기능에 대해서 정리하고자 한다. 이 두가지 기능을 위해서는 어떻게 api를 설계해야 할까. 우선, 로그인 기능에 대해, 1) 로그인페이지가 있어야 한다. 2) 로그인페이지에서 아이디와 패스워드를 입력 후 로그인 요청을 누르면 api로 post요청이 간다. 이 때, api에서 렌더링할 필요 없이, 프론트 단에서 post요청을 처리하기 위해, ajax통신이나 혹은 fetch를 사용할 수 있다. 3) api단에서는, post요청에 담긴 id와 패스워드를 DB에서 찾는다. 4) DB에서 찾았다면, 유저정보에 따른 토큰을 발급해준다. 5) 최종적으로 로그인한 유저정보, 그리고 유저정보에 따른 토큰을 같이 보내준다. 6) api에서는 렌더링해줄 필요가 없기 때문에, ajax나 fetch에서는..
#1. 홈페이지 화면 설계 먼저 홈페이지 화면을 위한 소스코드를 정리하고자 한다. 홈화면은 우선 저장된 경기정보를 띄워주는 식으로 구성되어 있다. 이를 위해선 다음과 같은 것들이 필요하다. 1) JWT방식으로 로그인이 되어 있는지 체크해야 하고, 2) index.html을 렌더링해줄 때, 경기정보를 같이 보내주어야 한다. html 파일이 짧지 않기 때문에 로직을 담당하는 파일만 살펴보고자 한다. @app.route('/') def home(): //matches라는 collection에서 응원시간의 최신순으로 데이터를 가져온다. matches = list(db.matches.find().sort('cheer_datetime', -1)) //그리고 가져온 데이터에서 id를 하나씩 꺼내 문자형 데이터로 변환해준다 for match i..

티스토리툴바