[WIL] 항해99 (9기) - 1주차 회고

2022.09.09 ~ 2022.09.13

사용언어 : 파이썬(python)

 

4일간 파이썬언어를 사용해서 풀스텍 미니 프로젝트를 만들어봤어요 !

파이썬은 처음이라... 걱정반 기대반이였다 두근두근 💬

 

1. 팀배정 

처음 항해99가 시작될 때부터 팀배정이 이루어졌습니다

우리팀 인원은 3명였고 처음 맡게된 팀장..! (아니..내가..?)

걱정보다는 기대가 더 많이 됐고 즐거운 4일이 되지않을까 하는 생각뿐이였습니다 !

 

2. 주제설정,  와이어프레임 작성, 역할분담

기간이 4일밖에 없어서 세가지 모두 빠르게 진행했습니다

 

- 주제: 제주도 핫플정보 제공 서비스 ( 프로젝트명: 혼저옵서예)

    유일하게 비행기를타고 여행을 가는 여행지가 제주도라서 지역을 제주도로 결정했습니다 ! 🌴

    사용자들이 제주도를 가기전에 검색을 많이 하고 간다고 생각해서 제주도의 핫플을 공유할 수 있는 서비스를 만들면

    좋겠다는 팀원들의 생각이 모두 일치해서 주제정하는 것은 순조로웠습니다

 

- 와이어프레임 작성

   저희조는 kakao oven을 사용하여 UI 디자인과 기능을 조금 더 구체적으로 만들었습니다

   처음 구성이 자세하게 되어 있어야 만들때 혼동이 오지 않을 것 같았어요!

 

▶ 회원가입 / 로그인

회원가입

로그인

▶ 글 등록 / 수정

 

 

▶ 글 조회 / 삭제

 

- 역할분담

역할은 자신이 해보고 싶었던 기능, 할 수 있는 기능을 구현을 맡기로 했습니다

팀장) 메인화면 및 flask서버 설정. 게시글 수정, 삭제, 로고 생성

팀원1) 로그인, 회원가입

팀원2) 게시글 조회, 등록

 

 

3. 기능구현: 메인화면 및 flask서버 설정. 게시글 상세보기, 수정, 삭제, 로고 생성

- flask서버 설정

사용하는 기능을 인터프리터를 다운받아서 기본설정을 해줬습니다

DB는 몽고DB를 사용했습니다

 

 

- 메인화면 

● 로그인을 하면 메인화면과 배너를만들어서 상단에 배치해 두었습니다

● 하단에는 로그인 정보와 로그아웃할 수 있는 버튼, 글쓰기 버튼을 배치했습니다

● 제주 날씨는 API를 사용했습니다

● 로고는 무료로 로고를 만들어 주는 사이트에서 제작했습니다

 

 

-  게시글 상세화면 및 수정하기

 

● 메인화면에서 [글보기] 버튼을 클릭하면 상세화면으로 넘어갑니다

● 상세화면에서 [수정하기] 버튼을 클릭하면 글을 작성한 내용들을 DB에서 가져옵니다

● 수정 후 [수정] 버튼을 클릭하면 수정이 완료되고, 메인화면으로 돌아갑니다

● 선택한 글을 찾기위해 글의 정보를 insert할때 id를 고유값으로 주어 상세페이지 및 수정 기능을 구현했습니다

 

-  게시글 삭제

● [삭제]버튼을 누르면 "정말로 삭제하시겠습니까?"라고 comfirm한 후 [확인] 버튼을 누르면 정상적으로 삭제됩니다.

● 선택한 글을 삭제하기 위해서 id값으로 구분해 삭제 기능을 구현했습니다.

 

4. git link

https://github.com/kimhuigon/miniPJ.git

GitHub - kimhuigon/miniPJ: 미니프로젝트

 

5. 배운 내용들

프로젝트를 구성하고 있는 주요 방식은 JWT인증방식과 서버사이드 렌더링방식을 사용했고, jinja2 문법을 사용했습니다

 

1) JWT

JWT는 Json Web Token의 약자로 인증에 필요한 정보들을 암호화시킨 토큰을 뜻합니다. JWT의 인증방식은
1. 사용자가 로그인을 하면 서버에서 계정정보를 읽고 사용자 확인 후, 사용자의 고유ID값과 기타정보를 Payload에 넣습니다.
2. 암호화할 SECRET KEY를 이용해 ACCESS TOKEN을 발급하고 사용자는 이를 받아 저장한 후 인증이 필요한 요청마다 토큰을 Header에 실어보냅니다.
3. 서버는 해당 토큰을 Verify Signature를 복호화한 후 조작여부와 유효기간을 확인합니다.
4. 검증이 완료된다면, Payload를 디코딩하여 사용자의 ID에 맞는 데이터를 가져옵니다.
이러한 JWT방식은 세션/쿠키와 다르게 별도의 저장소의 관리가 필요하지 않고 발급 후 검증만 하면 되기 때문에 간편하게 사용할 수 있습니다. 그래서 서버를 확장하거나 유지, 보수하는데 유리합니다.
또한 확장성이 뛰어나 토큰을 기반으로 하는 다른 인증 시스템에 접근이 가능합니다.

 

2) 서버사이드 렌더링

서버 사이드 렌더링이란 서버에서 페이지를 그려 클라이언트(브라우저)로 보낸 후 화면에 표시하는 기법을 의미합니다. 
서버 사이드 렌더링의 장점은 
1. 검색 엔진 최적화입니다.
사이트에서 검색했을 때 결과가 사용자에게 많이 노출될 수록 최적화 하는 기법입니다. 또한 OG태그를 페이지 별로 적용하기 위해서는 서버 사이드 렌더링이 효율적 입니다.
2. 빠른 페이지 렌더링입니다.
클라이언트 사이드렌더링과 다르게 서버에서 미리 그려서 브라우저로 보내주기 때문에 페이지를 그리는 시간을 단축할 수 있습니다. 사용자 입장에서는 화면에 유의미한 정보가 표시되는 시간이 빨라집니다.

 

3) 깃허브 사용

협업을 하기 위해서 필수적으로 사용하는 프로그램 입니다

 

6. 아쉬웠던 점 

프로젝트 기간이 좀 짧아서 많은 기능을 구현하지 못한것과, 반응형으로 만들어 UI를 사용자가 보기좋게 만들지 못해서 아쉬었습니다. 그리고 git 사용법!!!! 정말 많이 공부를 해야할 것 같았어요

충돌나면 심장이 쿵..하고 떨어지는 기분이였습니다 ... 

첫 프로젝트였던만큼 아쉬움도컸지만 얻은것도 많아서 기분좋은 한 주 였습니다.

처음 팀장을 맡게되어서 팀원들에게 좋은 팀장이 되고싶었는데 다행히 팀원분들께서 잘 따라와주셔서 

정말 고맙고 즐거운 프로젝트 기간이였습니다 ! 

2주차에도 화이팅 하겠습니당!!!!!!