繰り返し使うマークアップをマクロにする
コピー&ペーストを避けるためテンプレート関数を書きます
「繰り返し使うマークアップをマクロにする」はCoddyKit上の無料Flask Academyレッスンです。 これはレッスン4/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはFlask Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Flask Academyコースには全4レッスンが含まれています。
Repeated Markup Begs for a Function
同じ入力フィールドやカードのマークアップが少しずつ変わりながら現れる場合、コピーしていくと管理が難しくなります。macroを使えば、そのパターンを再利用可能な関数にできます。🛠️
What a Macro Is
macroはテンプレート関数です。パラメーター付きでマークアップを一度定義し、異なる引数で何度も呼び出します。
Define a Macro
macroは名前とパラメーターを指定して宣言し、マークアップを記述してendmacroで閉じます。これ以降、再利用できるようになります。
{% macro field(name) %}
<input name="{{ name }}">
{% endmacro %}Call a Macro
macroは関数と同じように、引数を渡して呼び出します。Jinja2は、呼び出した場所でその値を使ってmacroの本体をレンダリングします。
{{ field("email") }}Parameters Customize Output
macroのparametersを使うと、1つのマークアップ定義から、入力タイプやラベルが異なる複数のバリエーションを生成できます。
{% macro field(name, type="text") %}
<input name="{{ name }}" type="{{ type }}">
{% endmacro %}Default Argument Values
パラメーターにdefaultsを設定すると、よく使う呼び出しを短くできます。呼び出し側では、異なる値が必要な場合だけデフォルトを上書きします。
{{ field("age", type="number") }}Keep Macros in Their Own File
共通macroをforms.htmlのようなファイルに保存すると、多くのテンプレートから同じヘルパーをimportして再利用できます。
{% import "forms.html" as forms %}Import Then Call
importした後は、名前空間を通してmacroを呼び出します。これにより、macroライブラリをそれを使うページから分離できます。
{{ forms.field("email") }}Import Specific Macros
from importを使うと、必要なmacroだけを名前で取り込めます。テンプレートがすっきりし、意図も明確になります。
{% from "forms.html" import field %}Macros vs Includes
includeは固定のマークアップを挿入しますが、macroは引数を受け取り、出力を変えられます。呼び出しごとに断片を変える必要がある場合はmacroを使います。
DRY Templates at Last
macroを使うと、テンプレートからコピーと貼り付けをなくせます。フィールドのマークアップを一度修正すれば、すべての呼び出し箇所が更新されます。これがrightなテンプレート設計です。✨
Quick Check
macroはincludeと何が違いますか?
Recap: Macros
macroは、再利用可能でパラメーター化されたテンプレート関数です。一度定義してimportし、どこからでも呼び出すことで、テンプレートをDRYに保てます。🎯
AI チューターと学ぶ Python — 無料
ブラウザでリアルコードを書いて実行し、24/7 の AI チューターから瞬時にサポートを受け、ウェブまたはアプリで続きから学習できます。
- コース
- 30
- レッスン
- 120
よくある質問
「繰り返し使うマークアップをマクロにする」レッスンは無料ですか?
はい。「繰り返し使うマークアップをマクロにする」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、Flask Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Flask Academyコースには全4レッスンが含まれています。
「繰り返し使うマークアップをマクロにする」で何を学びますか?
コピー&ペーストを避けるためテンプレート関数を書きます ブラウザで直接実行するハンズオンコードでFlask Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
Flask Academyを始めるのに経験は必要ですか?
事前経験は必要ありません。CoddyKitのFlask Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン4/4です。
「繰り返し使うマークアップをマクロにする」レッスンにはどのくらい時間がかかりますか?
ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このFlask Academyレッスンでコードを書いて実行できますか?
はい。すべてのFlask Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。
このコースのすべてのレッスン
- ブロックを持つベーステンプレートを定義する
- 子ページでベースを拡張する
- 再利用可能なパーシャルをインクルードする
- 繰り返し使うマークアップをマクロにする