2-2플라스크로 멀티페이지 사이트 만들기 - 기초

페이지 간 이동하기

메인 페이지에서 링크를 클릭하면 상세 페이지로 가고, 상세 페이지에서 다시 메인으로 갈 수 있게 하려면 어떻게 해야할까요?

페이지 연결하기

• 상세 페이지로 가는 하이퍼링크는 이렇게 만듭니다.

<a href="/detail">상세 페이지로 가기</a>

• 메인 페이지로 돌아가는 버튼은 이렇게 만들 수 있겠죠!

// script 태그 안에 정의하기

function to_main() {

        window.location.href = "/"

}

 

<!-- 버튼에 함수 연결하기 -->

<button onclick="to_main()">메인으로 돌아가기</button>

 

• 짧은 코드는 onclick에 바로 넣을 수 있습니다.

<button onclick='window.location.href = "/"'>메인으로 돌아가기</button>

※작은따음표와 큰 따음표 구분

Jinja2 템플릿 언어 이용하기

• 서버에서 name이라는 이름으로 값을 보내줍니다.

@app.route('/')

def main():

      myname = "sparta"

      return render_template("index.html", name=myname)

• html 파일에서 이 값이 들어갈 자리를 표시해줍니다.

<h3>Hello, {{ name }}!</h3>

 

파이참 Settings(맥은 Preferences) > Languages & Frameworks > Template Languages에서

템플릿 언어를 Jinja2로 설정해주면 자동완성과 하이라이팅 기능을 사용할 수 있어요!