내일배움캠프 3일차

1. 프로젝트 마감

오늘은 미니프로젝트 마지막 날이었기 때문에 프로젝트 마감 및 제출을 했다.

코드는 모두 완성한 상태였기 때문에 코드 소개자료를 노션으로 작성하는 작업을 진행했다.

프로젝트를 구성한 코드들과 이에 대한 설명(왜 사용 하였는지, 코드의 기능)들을 작성하고, 프로젝트 중 힘들었던 점, 어떤 오류가 났고 어떻게 해결했는지, 제일 마음에 드는 코드 등을 작성했다.

이렇게 내가 진행한 프로젝트를 문서로 표현하고 나니 머리속으로 한번 더 정리가 되는 느낌이 들어 좋았다.

2. 미니프로젝트 발표회

미니프로젝트 발표회를 통해 튜터님들께 피드백도 받고 얻어가는 정보가 있어 좋았다.

튜터님들께는 문서정리와 Flask db 연동이 좋았다는 피드백을 받았다.

또한 다른 팀들의 발표를 듣는 도중 나도 다음에 시도해봐야 겠다는 것들이 몇가지 생겼다.

1. 화면비율 처리
   이번 프로젝트에서는 화면비율 처리를 신경쓰지 못했는데 비율처리를 하면 화면 크기가 바뀌어도 디자인이 깨지지 않기 때문에 다음 프로젝트를 진행 할 때에는 꼭 신경을 써야겠다고 생각했다.

• 이미지 비율 조절 방법

<img style="width=100%;height=100%;object-fit:contain;" src="이미지 주소"></img>

• 가로, 세로를 이용한 비율 조절 방법

width:100%;
width-max:100%;
height:100%;
height-max:100%;

(퍼센트는 알아서 조절)

• 패딩, 마진을 이용한 비율 조절 방법(가로, 세로를 이용할 수 없을 때)

width:0px or height:0px
padding-top:100%;
padding-bottom:100%;

(퍼센트는 알아서 조절)

예시)

.code { margin:0 auto; max-width:1000px; }
.inner {padding-top:56.25%; position:relative}
img {position:absolute; left:0; top:0; width:100%; height:100%; }

2. 사진 첨부 방법
   사진 첨부 방식을 인터넷에 사진을 업로드하여 그 사진의 이미지 링크를 받아서 첨부하는 방식밖에 알지 못해 인터넷에 업로드 하지 않는 방법은 없을까 고민을 했었다.
   오늘 발표에서 다른 팀에서는 구글 드라이브 주소를 참조하여 이미지 링크를 첨부하셨다고 해서 다음에는 그 방법을 사용해 봐야 겠다는 생각이 들었다.

• 사진을 구글 드라이브에 업로드 하고 외부 공개를 한다.
  외부 링크로 접근한 화면에서 우상단의 메뉴를 눌러 항목 삽입을 눌러보면 아래와 같은 iframe코드를 얻을 수 있다고 한다.

<iframe src="구글 드라이브 주소" width="ㅇㅇㅇ" height="ㅇㅇㅇ"></iframe>

• 그 후 에드온으로 파일 id를 구하여 아래의 코드에 집어넣고 위 코드의 구글 드라이브 주소에 입력하면 된다.

="https://drive.google.com/uc?export=view&id=" & {FILE_ID가 있는 셀의 주소}

3. 팀 프로젝트를 진행해본 결과 각자 맡은 파트를 만들어와 합치기 때문에 코드 옆에 주석을 달아주는 것이 다른 팀원들의 코드 이해속도를 높여줄 수 있다는 것을 겪고 주석의 중요성을 깨닫게 되었다.