Jinja 템플릿 - 메모장과 무료 샘플
본고는 간략하게 Flask/Jinja Template 시스템을 소개했는데 이것은 현대적이고 디자인이 우호적인 Python 언어로 Django의 모델을 모델로 한다.Jinja는 기본적으로 HTTP 응답을 통해 사용자에게 되돌아오는 HTML이나 XML을 만드는 엔진입니다.초보자에게 Jinja는 Python 라이브러리로 Flask, FastAPI, Django 등 유행하는 웹 프레임워크에서 사용되며 안전하고 효율적인 방식으로 HTML 페이지에 서비스를 제공한다.
Thanks for reading! - Content provided by App Generator.
🔥 새 대시보드 - 소프트 UI 대시보드
관리 대시보드는 Flask 프레임워크에서 AppSeed에 의해 생성됩니다.대시보드는 대담한 요소와 예쁜 사이트를 좋아하는 사람들을 위해 디자인된 것이다. Soft UI 대시보드는 놀라운 사이트와 인터넷 응용 프로그램을 만드는 데 도움을 줄 수 있다.Soft UI 대시보드는 버튼, 입력, 네비게이션 막대, 네비게이션 탭, 카드 또는 경고 등 70여 개의 프런트엔드 단일 요소로 구성되어 있어 자유롭게 선택하고 조합할 수 있습니다.
🔥 새 UI 키트 - 재료 설계
Material Kit는 무료 Bootstrap 5 사용자 인터페이스 패키지로 구글의 Material 디자인에서 영감을 얻었다.재료 세트는 빛, 표면, 운동을 이용한다.그것은 정성스럽게 고른 색깔, 가장자리부터 가장자리까지의 이미지, 대규모 조판을 사용했다.
뭐 공부 해요?
Jinja는 Python 라이브러리로 Flask와 Django 등 유행하는 웹 프레임워크에서 사용되며 안전하고 효율적인 방식으로 HTML 페이지에 서비스를 제공합니다.템플릿 엔진을 사용하는 것은 웹 개발에서 흔히 볼 수 있는 방법으로 웹 응용 프로그램을 작성하는 언어든 프레임워크든 상관없다.
금가 환경
Jinja는 Python 라이브러리로서 터미널을 통해 Python을 설치하고 사용하도록 요구합니다.파이썬 설치를 확인하려면
python --version 을 입력하십시오.Python을 설치하기로 결정하면 Python의 공식 패키지 관리자PIP를 통해 Jinja를 설치할 수 있습니다.$ pip install jinja2
>>> from jinja2 import Template
>>> t = Template("Jinja {{ token }}!")
>>> t.render(token="works")
u'Jinja works!'
Reasons/advantages of using a template engine
작업량을 줄이다
Jinja는 많은 페이지와 상하문에서 구성 요소 (일반 HTML 블록이라고도 함) 를 조금만 변경하면 다시 사용할 수 있습니다.만약 우리가 링크와 연락처가 있는 페이지를 가지고 있다면, 이러한 링크와 연락처는 웹 응용 프로그램의 모든 페이지에 통용된다.Jinja를 사용하면
footer.html라는 단독 파일을 정의할 수 있습니다. 간단한 include를 통해 다시 사용할 수 있습니다.쪽지.html 정의
<footer class="footer">
<div class=" container-fluid ">
<span>
© YourCompany;
</span>
<span>
Contact: bill [ @ ] microsoft.com
</span>
</div>
</footer>
<head>
<title>
Jinja Template - Cheat Sheet | Dev.to
</title>
</head>
<body>
<div class="content">
Some cool content
</div>
<!-- The magic include line -->
{% include 'footer.html' %}
</body>
</html>
템플릿 상속
Jinja 상하문에서 계승은 모든 후속 하위 템플릿의 기본 구조를 정의하기 위해
base template 를 정의하는 것을 의미한다.이 주 템플릿은 inherited 명령어extends를 통해 변형 (새 페이지) 을 생성할 수 있습니다.A real sample
상위 HTML - 다른 이름으로 저장
base.html<html>
<head>
<title>My Jinja {% block title %}{% endblock %} </title>
</head>
<body>
<div class="container">
<h2>This is from the base template</h2>
<br>
{ block content }{ endblock }
<br>
</div>
</body>
</html>
child.html{ extends "base.html" }
{ block title } MySample { endblock }
{ block content }
Cool content here
{ endblock }
child.html하면 { extends } 블록 알림 엔진은 base.html 템플릿과 child.html 제공된 내용을 통합합니다.{ block title } My Sample{ block content } 여기서 멋있는 콘텐츠가 됐어요.<html>
<head>
<title>My Jinja MySample</title>
</head>
<body>
<div class="container">
<h2>This is from the base template</h2>
<br>
Cool content here
<br>
</div>
</body>
</html>
Jinja - 렌더링 목록
Jinja는 목록과 사전을 조작하기 위해
if/else, for loops 등 제어 구조를 지원합니다.목록 정의
# Define a simple list
users = ['user1','user2', 'user3']
<h1>Members</h1>
<ul>
{% for user in users %}
<li>{{ user }}</li>
{% endfor %}
</ul>
<h1>Members</h1>
<ul>
<li>user1</li>
<li>user2</li>
<li>user3</li>
</ul>
For 간단한 else 을 사용하여 회로가 비어 있는지 확인할 수 있습니다.Jinja 코드 세그먼트
<ul>
{% for user in users %}
<li>{{ user.username|e }}</li>
{% else %}
<li><em>no users found</em></li>
{% endfor %}
</ul>
<h1>Members</h1>
<ul>
<li>no users found</li>
</ul>
Jinja. - HTML 전의.
HTML을 생성하고 주입된 내용이
>, <, & 또는 " 포함될 수 있을 때 전의가 유용하다.Jinja에서 파이프를 통해 | e 필터에 변수를 전달하여 탈출:Jinja 코드 세그먼트
{{ content|e }} <!-- content might contain unsafe chars -->
Jinja 필터
필터 섹션에서는 템플릿 블록에 일반 Jinja 필터 - 구문을 적용할 수 있습니다.
Jinja 코드 세그먼트
{% filter upper %}
uppercase me
{% endfilter %}
UPPERCASE ME
금가수학
Jinja는 값을 계산할 수 있습니다.다음은 몇 가지 예입니다.
{{ 1 + 1 }} will render 1
{{ 1 / 2 }} will render 0.5
{{ 11 % 7 }} will render 4
AppSeed마성이공허가증에 따라 발표된 개원 프로젝트로서 이 프로젝트는 무한한 취미와 상업 프로젝트에 사용할 수 있다.
플라스크 안내5
seed 프로젝트는 기본적으로 경량급 Flask 프로젝트로 데이터베이스나 다른 하드 의존 항목이 없습니다.이 프로젝트는 Docker, HEROKU, Gunicorn/Nginx 스택의 배치 스크립트를 첨부합니다.
How to compile Jinja Volt (information extracted from README file)
$ # Clone the sources
$ git clone https://github.com/app-generator/jinja-volt-dashboard.git
$ cd jinja-volt-dashboard
$
$ # Virtualenv set up (Unix based systems)
$ virtualenv env
$ source env/bin/activate
$
$ # Install requirements
$ pip3 install -r requirements.txt
$
$ # Set the FLASK_APP environment variable
$ export FLASK_APP=run.py
$
$ # Run the Jinja Template
$ flask run
$
$ # Access the UI in browser: http://127.0.0.1:5000/
5000:
플라스크 데이터
Datta-Able은 시장에서 다른 모든 간소화/무료 관리 템플릿 중 가장 스타일리시한 Bootstrap 4 간소화 관리 템플릿입니다.그것은 기능이 풍부한 페이지와 구성 요소, 그리고 완전히 개발자 중심의 코드를 제공한다.오류/bug가 없고 구조가 양호하며 주석이 좋은 코드를 제공하고 최신 업데이트된 코드를 정기적으로 제공합니다.백엔드 응용 프로그램을 개발하는 데 많은 시간을 절약할 수 있고 완전히 사용자 정의할 수 있습니다
Datta Able Flask - 제품 페이지
Datta Able Flask - Demo - 실시간 배포
플라스크 픽셀 UI
Pixel은 무료이고 완전한 응답을 제공하는 현대 Bootstrap 4 사용자 인터페이스 패키지로 창의적인 전문 사이트를 만드는 데 도움을 줄 것입니다.우리의 구성 요소와 부분을 사용하여 Sass 변수를 전환하여 페이지를 구축하고 안배하여 사용자의 요구에 가장 적합하도록 합니다.
Pixel Lite는 6개의 고급 예제 페이지를 포함하고 있으며, 이 페이지를 만든 것은 사용자가 만들 수 있는 멋진 사용자 인터페이스를 보여주기 위해서입니다.일부 페이지는 가격 페이지, 정보 페이지, 연락처 페이지, 로그인 및 등록 페이지입니다.
Jinja Pixel UI - 제품 페이지
Jinja Pixel UI - Demo - 실시간 배포
계단식 플라스크
Flask 프레임워크에서 인코딩된 소스 Jinja 템플릿입니다.Gradient Able Bootstrap 4 Free/Lite 관리 템플릿은 대시보드를 만드는 데 사용되는 전체 솔루션입니다.Gradient Able은 우아한 외관으로 사람들 속에서 뛰어나다. 부드러운 점차적인 색채와 적당한 조판, 정교한 카드와 도형을 결합시킨다.
Gradient Able Flask - 제품 페이지
Gradient Able Flask - 실시간 배포
Thanks for reading! For more resources, please access:
Jinja - 공식 문서
Reference
이 문제에 관하여(Jinja 템플릿 - 메모장과 무료 샘플), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/sm0ke/jinja-template-cheat-sheet-and-free-sample-28kh텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
