몰입공간

#1. 문제 예를 들어 유저의 모든 post를 feed에 출력한다면 DB에서 쿼리를 조회하고 templates에 Jinja2 언어를 사용하여 렌더링하는것이 일반적이다. 이 경우 post 데이터는 참조 가능한 모든 데이터의 id 혹은 객체를 가지고 있다. (user, profile image, comment 등) @app.route('/show') def post_list(): posts = list(db.posts.find({})) return render_template('show.html', posts = posts) 다만 여기서 문제가 되는 것이 GridFS로 저장한 파일(여기서는 프로필 이미지)은 템플릿에 렌더링하기 위해 다음과 같은 일련의 인코딩 과정이 필요하다. def return_img(us..

본 내용은 내일배움캠프 과제로 나온 주식종목 조회 웹페이지 구현을 위해 실행 과정을 처음부터 차근차근 뜯어본 코드입니다. 틀린 내용이 있을 수 있습니다. 아래의 내용은 철저하게 코딩을 처음 배우는 사람의 눈높이로 작성되었습니다. #1. 시작 누구나 다 그럴지는 모르겠지만, 공학적 감각이 없는 사람이 코딩을 배우기 시작하면 적어도 나의 경우엔 항상 드는 생각이 있다. 그것은 바로 '설계'이다. 즉, 100줄 짜리 코드를 가진 프로그램을 만들더라도, DB를 어떻게 활용할 것인가? 함수는 어떻게 작성해야 보다 직관적인가? 매개변수를 어떻게 쓰도록 설계해야 여러 함수의 상호작용이 가능한가? 프로그램을 만드는 개발자들은 이러한 아키텍쳐 설계의 흐름이 단번에 머릿속에 그려지는 것일까? 하는 생각만 하다가,막상 어떠..

본 내용은 내일배움캠프 과제로 나온 주식종목 조회 웹페이지 구현을 위해 실행 과정을 처음부터 차근차근 뜯어본 코드입니다. 틀린 내용이 있을 수 있습니다. #1. 즐겨찾기 기능 구현하기 즐겨찾기 기능은 기존의 데이터에 추가적인 요소 하나만 달아주고 html에 렌더링하면 끝이기 때문에 이전 내용보다는 비교적으로 쉬운편이다. function makeStock(stock) { ```생략``` if(stock['isLike']){ tempHtml += `취소`; } else { tempHtml += `즐겨찾기`; } tempHtml += `정보 `; $("#select-box").append(tempHtml); } stock의 이름과 정보를 표시하는 버튼을 생성하는 makeStock(stock) 함수에서 stoc..

본 내용은 내일배움캠프 과제로 나온 주식종목 조회 웹페이지 구현을 위해 실행 과정을 처음부터 차근차근 뜯어본 코드입니다. 틀린 내용이 있을 수 있습니다. #1. 첫 페이지 로딩 let g_base_codes = []; let g_index = 0; let g_select_values = []; $(document).ready(function () { getBaseCodes(); }); function getBaseCodes() { $.ajax({ type: "GET", url: "/base/codes", data: {}, success: function (response) { g_base_codes = response; console.log(g_base_codes) } }) } 웹페이지가 로딩되면 자바스..

공부한 내용을 정리해놓은 글 입니다. 틀린 내용이 있을 수 있습니다. #1 GET과 POST 개념이 궁금하다면, 여기에서 확인 [Web] 클라이언트 - 서버 모델, GET과 POST 개념 잡기 #1 클라이언트 - 서버 모델 1-1. 클라이언트 엄밀히 말해 서버에 접근해 상호작용이 가능한 브라우저(혹은 소프트웨어)를 의미하지만 보통 '사용자(user)'를 지칭한다. 유저의 입력을 처리하고 이를 sahayana.tistory.com #2 GET 방식 사용자 입력을 받아 서버에 요청하는 것이 클라이언트, 요청을 처리하고 답하는 것이 서버라고 한다. 여기서 서버는 로컬 환경의 파이썬 Flask로 동작하는 웹 어플리케이션이고 사용자 입력을 받는 클라이언트는 자바스크립트 ajax가 그 기능을 쉽게 도와준다고 생각할..