항해99

[대나무숲] 2. 부트스트랩 템플릿 / API 설계 / 협업 규칙

부트스트랩 템플릿 빠른 작업을 위해 부트스트랩 템플릿을 사용하기로 결정하였다. 익명고민상담소의 소소하면서도 친근한 분위기와 딱 맞는 테마를 팀원분이 찾아주셨다. 기초가 될 레이아웃은 템플릿, 디자인적인 요소는 테마에서! API 설계 기초 뼈대 HTML 작업 팀원분들이 편하게 작업하실 수 있도록 기초 뼈대를 만들었다. 와이어프레임을 기준으로 부트스트랩 요소들을 조합하고, 테스트까지 완료! 완성본은 팀원분들과 Github을 이용하여 공유하였다. Python Flask 폴더 구조 static/assets → 프로젝트에 사용할 리소스(css, img, js, vendor) static/dist → 가져다 쓸 부트스트랩 템플릿(.gitignore에 추가) templates → HTML 파일 HTML, CSS, J..

[대나무숲] 1. 기능 명세서 / 와이어 프레임 / DB schema

항해99 본과정에 앞서 사전 스터디를 진행하며 웹개발 종합반 강의를 완강했다. 그 강의에 기반하여 팀원들과 토이 프로젝트를 진행하기로 결정! 늦게 합류한만큼 본과정 시작 전까지 시간이 많지 않기에 기본 게시판 CRUD를 구현해보기로 하였다. 프로젝트 주제 선정 대나무숲 - 익명 고민 상담소 : 익명으로 고민을 털어놓고, 익명으로 해답을 알려주는 상담소(게시판) 기술 스택 Frontend : HTML5, CSS3, Bootstrap5.0, JavaScript, Jquery, Ajax Backend : Python, Flask DB : MongoDB Infrastructure : AWS EC2 기능 명세서 🚩 표시는 Option 기능 1. 고민 게시판 닉네임, 비밀번호, 제목, 내용, 작성 시간으로 고민 글..

[TIL] Python 문자열 제거, pymongo 역정렬, MongoDB에 id 부여

✍ Today I Learned 2022.10.29 - [TIL] 웹의 동작 개념, CSS 모바일, DOMContentLoaded 웹개발 종합반 1주차 ~ 2주차 강의에 이어 3주차 ~ 4주차 강의를 듣고 정리한 내용이다. 사용 경험이 적은 언어(Python)와 데이터베이스(MongoDB)였지만 내가 알고 있는 것들과 비교해보는 재미가 있었다! 특정 문자열 대체, 제거 replace() string.replace(oldvalue, newvalue, count) 차례대로 찾을 값, 바꿀 값, 바꿀 횟수(옵션)를 입력하면 해당 string에서 특정 문자열을 대체한다. 문자열 및 공백 제거 strip() string.strip(characters) 인자로 전달받은 문자를 String의 왼쪽과 오른쪽에서 제거한..

[TIL] 웹의 동작 개념, CSS 모바일, DOMContentLoaded

✍ Today I Learned 항해99를 본격적으로 시작하기에 앞서 사전에 제공되는 강의를 통해 워밍업을 해보려 한다. 다음 내용은 웹개발 종합반 1주차 ~ 2주차에 해당한다. 이전에 들었던 강의이기 때문에 다시 한번 짚고 넘어갔으면 하는 조각 지식 위주로 정리했다. 웹의 동작 개념 브라우저가 API에 요청을 보내고, 받은 HTML 파일을 받아서 그려준다. HTML만 받느냐? 데이터만 내려줄 때가 더 많다. → JSON형식 CSS 모바일 가로길이 설정 꿀팁 화면 폭 500px 전에는 95%로 맞추다가, 넘으면 500px으로 보여줘 라고 할 수 있다면? width: 95%; max-width: 500px; 이벤트 리스너는 죄가 없다 uncaught typeerror cannot read propertie..