[개인플젝 : Waste-less] 2주차 개발로그 - Flask에서 내부 링크 만들기

rimu·2020년 4월 13일
1

1차로 템플릿 렌더링을 하고 난 뒤에 내가 하고 싶었던거슨...
바로 네비게이션바에 내부 링크를 연결하는거였다. shop 누르면 shop 페이지로 이동하는거.. 처음에 바보같이 onclick 함수를 연결해서 flask에 api를 만들어줘야하나 하고 이리저리 삽질을 하고 있었는데..바보 같은 생각이었다.ㅎㅎㅎ 그냥 a태그에 링크 달듯이 하되 플라스크 문법으로 수정만 해주면 되었던 것.

기존에 서버 연결을 하지 않고 html,css,js로만 만들었을때는

<a href="index.html"></a>

이런식으로 연결을 했다면 이제는 flask를 이용하고 있는 상태기때문에 이 방식이 무의미해진다. 이것도 플라스크가 알 수 있는 방식으로 링크를 연결해줘야한다.



flask에서 내부링크 연결하기

{{url_for('')}}

 <a href="{{url_for('mall')}}"> Shop</a>
 #Shop 클릭 시 http://localhost:5000/mall로 이동

(홈으로 라우팅한 페이지 연결은 살짝 다르게 생긴거 주의)

<a class="title" href="/"> Waste-less </a>
 # 타이틀 클릭 시 http://localhost:5000/로 이동

물론 여기서 나오는 url_for 다음에 들어가는 애는 플라스크로 템플릿 렌더링할때 정의한 함수 이름!

@app.route('/')
def home():
    return render_template('index.html')


@app.route('/mall')
def mall():
    return render_template('mall.html')

여기에서 더 나아가서 url에 파라미터를 설정하는 방법도 있다. 이 부분도 알아둬야하는데 아직은 다른 부분 먼저 건드릴 생각이라 나중에 돌아와서 자료들 다시 봐야겠다.

동적URL
내부링크만들기

profile
Perfectly imperfect ✨

0개의 댓글