잉여개발자

DB 에서 값을 가져와 Ranking을 출력 해본다. GET 방식으로 URL에 page_num=1을 붙여서 보내주는 것이 핵심. ranking.html {% set page_count = (ranking_list|length)//page_unit %} {% set start = page_count*(page_num-1) %} {% set result_list = ranking_list[start : start+4] %} namescoredate {% for result in result_list %} {{result['name']}}{{result['score']}}{{result['date']}} {% endfor %} {% for i in range(1, (page_count)+2)%} {{i}} {..

1. [GET] 태그 href 속성 a 태그로 이동 # a태그 / JS window.location.href 방식 @app.route('/test/basic', methods=['GET']) def test_basic(): print('test 수신') return "Simple TEST" 2. [GET] 태그 href 속성 + url_for() a 태그 + Url_for # a태그 + url_for() @app.route('/test/name', methods=['GET']) def test_name(): name = request.args.get('name') return "이름은" + name + "입니다." 3. [GET] JS onclick() + window.location.href 방식 Bu..

Flask 이미지 업로드 기능에 대한 템플릿. 단순 태그를 이용한 방법(왼쪽) 과 DragDrop을 통한 모달 버전(오른쪽) 이 있다. 1. 소스코드 Github 코드 링크 GitHub - SeonminKim1/Python: Python Framework & Libary Python Framework & Libary. Contribute to SeonminKim1/Python development by creating an account on GitHub. github.com 2. 구현 간 중요 Keyword (1) 이미지 전달시 request.files 안에 파일이 담겨서 전달된다. (werkzeug.datastructures.FileStorage 객체) file = request.files['file..

Flask 에는 API Endpoints를 여러 .py 파일에 분리하여 작성하기 위한 Blueprint 라는 모듈이 있다. 해당 모듈을 사용하면 면 큰 API를 중간 Routers 처럼 묶어 줄 수 있다. 사용 예시로는 다음과 같다. Structure ├── routers │ ├── router_1.py // money │ └── router_2.py // greet └── app.py // 진입점 API Endpoint @router1.route("/earn") => money/earn @router1.route("/lose") => money/lose @router2.route("/hi") => greet/hi @router2.route("/hello") => greet/hello 코드 링크 Gith..

프로젝트를 진행 하다보니 긴 html 코드 파일을 분리할 방법을 찾아보다가, Flask의 Jinja2 에서 제공하는 {% Include %} 와 {% extends %} 를 알게 되었고, 두 기능이 유사하여 차이점을 정리 해보았다. 1. Jinja Include 문법 {% Include 'a.html' %} 코드를 작성하고 nav.html, div1.html 등으로 저장 main.html 에서 {% include 'nav/nav.html' %} 등으로 사용 복잡한 div 구조를 가지거나 공통되는 영역 (nav 등)이 있을 때 빼서 쓰기 좋다. 사용 예시 1) nav.html 을 작성해두고 각 page에서 nav를 참조해 쓴다. GIt 코드 링크 GitHub - SeonminKim1/Python: Pyth..

프로젝트 간 모달 창을 만드는데 굉장히 애를 많이 먹었기에. (인터넷에 있는 오픈 소스도 원리나 코드를 이해하는데 어려웠다) 다음에 재활용하기 위해 코드를 정리해서 남겨 두었다. 모달 창 원리 모달 창의 가장 큰 원리는 Block을 미리 만들어 놓고 보였다, 안보였다 하는 것이다. 몇가지 Key는 다음과 같다. 1. Overlay Div와 Modal Div를 만드는 것 2. CSS 'Display' 속성을 'none'과 'block(flex)' 등으로 바꾸는 것 (JS Event) 3. CSS Position 으로 Modal 위치 조정 하는 것 (absolute, top:0, left:0 ) 4. CSS Z-Index : Overlay Div를 Z축 최상단으로 조정하는 것 소스 코드 GitHub - Se..

로그인, 회원가입, JWT Token 등은 웹 페이지 개발 간 항상 많이 쓸 것 같아서 기존 프로젝트에 사용한 코드를 정리하여 예시 템플릿 코드로 작성해 보았다. 1. Flask 로그인 / 회원 가입 기능 구현하기 Github 링크 GitHub - SeonminKim1/Python: Python Framework & Libary Python Framework & Libary. Contribute to SeonminKim1/Python development by creating an account on GitHub. github.com 2. Flask 로그인 / JWT Token 으로 쿠키 유지 관리 Github 링크 GitHub - SeonminKim1/Python: Python Framework & L..

1. HTML 분리하기 기본적으로 Templates 안에 같이 있어야 됨. (Templates 내에서 폴더 구분 가능) {% include 'nav/nav.html' %} ex) {% include 'header.html' %} {% include 'nav.html' %} {% include 'article.html' %} {% include 'footer.html' %} 2. CSS 분리하기 url_for를 이용하여 분리 # CSS 파일 body { font-family: 'Noto Sans KR', sans-serif; } 3. JS 분리하기 url_for를 이용하여 분리 // js 파일 function includeHTML() { //... a = document.getElementsByTagNam..

Flask에서는 Jinja2 라는 템플릿 엔진을 통해 웹 화면 구성을 보다 동적으로 가능하게 함 애플리케이션 내 변수, 조건문, 반복문 등을 랜더링 함 Jinja2 홈페이지 https://jinja.palletsprojects.com/en/3.1.x/ Jinja — Jinja Documentation (3.1.x) jinja.palletsprojects.com 예제 1. 변수 / 변수 함수 / 조건문 적용 {{변수명}}, {{변수명 | 함수}} {% if %}, {% elif %}, {% else %}, {% endif %} # app.py from flask import Flask, render_template app = Flask(__name__) @app.route('/') def index(): ..

1. Flask Error Handling 처리 방법 @app.errorhandler(status code) 사용자 정의 에러 핸들러 (데코레이터)가 존재함. 2. Example code from flask import Flask, jsonify app = Flask(__name__) @app.errorhandler(401) def page_not_found(error): return redirect("https://developer.mozilla.org/ko/docs/Web/HTTP/Status/401", code=401) @app.errorhandler(500) def error_handling_500(error): return jsonify({'Error': " 500 Error.."}, 500) ..