etc/[Python] Flask

[Flask] 파이썬으로 웹페이지 만들기 (3) URL Building(url_for)

코딩무민 2020. 12. 28. 18:31
반응형

[Flask] 파이썬으로 웹페이지 만들기 (1) 환경설정 및 기본 페이지 구성

[Flask] 파이썬으로 웹페이지 만들기 (2) Bootstrap 연동하기

[Flask] 파이썬으로 웹페이지 만들기 (3) URL Building(url_for)

[Flask] 파이썬으로 웹페이지 만들기 (4) 페이지 로그인 기능 만들기( 값 입력 및 출력)

[Flask] 파이썬으로 웹페이지 만들기 (5) 이미지 삽입하기

 

 

지금까지 페이지를 만들고, Bootstrap Starter Template으로 웹을 꾸며보았습니다. 

결과 예시

 

이제 위의 icon을 누르면 starter-template이 아닌 위 페이지가 뜨도록 바꾸어봅시다. 

 

1. url_for을 사용하는 이유

url_for을 사용하면, 기본 주소가 바뀌더라도 이를 route로 지정하여 open이 가능합니다.

 

2. 사용 방법

(1) index.html 고치기

경로 : Project_Name/app/templates/main/index.html 

 

index.html에 들어가 아래 부분을 수정해줍니다. 

 

수정할 부분

href 부분을 다음과 같이 바꾸어 줍니다. 

          <a class="navbar-brand" href="{{ url_for('main.index') }}">Flask 예시 - 코딩무민</a>
        </div>
        <div id="navbar" class="collapse navbar-collapse">
          <ul class="nav navbar-nav">
            <li><a href="{{ url_for('main.index') }}">Home</a></li>
            <li><a href="{{ url_for('main.url') }}">New_Url</a></li>
            <!-- <li class="active"> 하면 icon active 가능 -->
          </ul>
        </div><!--/.nav-collapse -->
      </div>
    </nav>

 -<a href ="{{ url_for('main.index') }}"> :  main/index.html으로 url을 옮겨라 

- <a href ="{{ url_for('main.url') }}"> :  main/url.html으로 url을 옮겨라 (url.html은 만들것)

- <li class="active"> : icon active 가능 

(2) 새로운 페이지 만들기 (* url.html)

경로 : Project_Name/app/templates/main/url.html 

index.html을 그대로 복사해온 뒤, 아래 부분을 수정합니다. 

수정할 부분 

<body> 에서 <div class ="container"> 부분 수정 

    <div class="container">

      <div class="starter-template">
        <p class="lead"> 이렇게 url building 완료
            <br> </p>
      </div>

    </div><!-- /.container -->

(3) index.py 수정 

from flask import Blueprint, request, render_template, flash, redirect, url_for
from flask import current_app as app


main = Blueprint('main', __name__, url_prefix='/')

@main.route('/main', methods = ['GET'])
def index():
    return render_template('/main/index.html')

#추가
@main.route('/main/url', methods = ['GET'])
def url():
   return render_template('/main/url.html')

 

(4) 결과 예시

이제 결과를 살펴보면 다음과 같이 나옵니다. 

1) 메인창

http://127.0.0.1:8001/main 

2) New_Url 창

http://127.0.0.1:8001/main/url 

 

반응형