web-dev-qa-db-ja.com

フラグメントから静的HTMLプロトタイプを作成していますか？

クリック可能なUIプロトタイプとして機能する静的HTMLのディレクトリで、共有フッターのようなインクルードされたHTMLフラグメントを管理するための推奨ツール（Linuxで動作）は何でしょうか？

ナビゲーション、ヘッダー、フッターの共有要素を簡単に管理しながら、静的コンテンツ（サーバー側のダイナミズムなし）のWebディレクトリからプロトタイプを提供できるようにしたいと考えています。多分ボイラープレートページレイアウトも処理できます。

インスピレーション：この質問は、 Handcraft プロトタイピングWebアプリケーションを試した私の経験に触発されました。それは [〜＃〜] hcml [〜＃〜] 「パーツ」（インクルード）と「レイアウト」（マスター）を持つHTMLの再利用を許可するテンプレート言語です。

基本的に、Dreamweaverの「ライブラリセグメント」のようなものです。スニペットを挿入するもの（Komodoなど）は、そのスニペットが以前に挿入されたすべてのファイルを同時に更新する能力がない限り、十分ではありません。

静的HTMLで次のようなものを想像しています。

<html><body><div id="include_footer">The Footer</div></body></html>

そして、「The Footer」を編集して「The Better Footer」を読み取り、このツールを実行すると、id = "include_footer"のdivを含む他のファイルが最新のフッターに更新されます。

htmlprototypingtemplates
7
Graham

現在 Jekyll を使用しています。それは私が質問で求めたことを正確に行います。基本的に、それは私のプロトタイプを再利用可能なパーツから提供可能な静的HTMLフォームにコンパイルします。

Jekyllは、インクルード（「スニペット」）とレイアウト（「マスター」）の両方をサポートしています。

また、テンプレートファイルをコンパイルして、Apacheで静的プロトタイプとして、またはファイルシステムからのみ提供するための完全なHTMLファイルを作成します。テンプレート化されていないものは変更されずにコピーされます。

プロトタイプに変更を加えると、プロトタイプの一部も再コンパイルされ、手動で再コンパイルしてプレビューする必要がなくなります。

4
Graham

あなたが何をしようとしているのか私が理解していれば、Moustacheのようなテンプレートシステムを見るかもしれません。それの素晴らしいところは、startでクライアント側のテンプレート、次に、実際にプロトコルを実装する場合は、同じテンプレートをサーバー側に移行します。

1
peteorpeter

スニペットをサポートするKomodoのようなHTMLエディターを使用します。 Foundation Frameworkに基づいてスニペットを挿入できるようにKomodoをセットアップしました。したがって、Div /コンテナ、div /行、div/4カラムなどを入力する代わりに、スニペットをダブルクリックするだけで、スニペットをそのように設定している場合は変数を入力してブームできます。

また、あなたが参照しているので、PHPページを作成していることを含むので、MAMP（またはLAMPやWAMP、使用しているOSを問わず）をインストールし、保存していることを確認します。ページを* AMP htdocsスペースに配置します。これでローカルサーバーが実装されたので、これを使用して、コードに基づいて生成された最後のPHPページを「ロード」できます。

1
Mike Earley

今日、レイアウトテンプレートとパーシャル/インクルードを提供する静的サイトジェネレーターが大量にあります。

見てください： https://www.staticgen.com/

私はハープを自分で使用しています。 HTML/CSSとJavascriptを少しでも知っていれば非常に簡単です。ただし、組み込みヘルパー関数は、ジキルまたはヘキソ。

0
agib