開発者として、私たちの業績は大小を問わず、私たちの専門的な成長に大きく貢献しています。しかし、これらの成果は、他のタスクの中で気付かれず、失われたことがよくあります。ライアン・T・ハーターが彼の講演で「目に見えない仕事の信用を得る」で説明されているように、この「目に見えない作品」は、特にパフォーマンスのレビュー中に簡単に忘れられます。
ジュリア・エヴァンスの「自慢文書」の維持に関する記事は、解決策を提供します。ブラグ文書は、プロジェクトの関与、同僚への支援、プロセスの改善、プレゼンテーション、ワークショップ、学習体験、課外活動(ブログ、個人プロジェクト)、賞、キャリアの進歩など、貴重な貢献の記録にすぎません。
bragdocs.comなどの自慢のドキュメントを作成するためのさまざまなツールが存在しますが、独自のカスタマイズを提供することができます。このチュートリアルでは、静的サイトジェネレーターを使用してbragdocs.comのようなサイトを再現する方法を示しています。最小限のJavaScriptとCSSを使用すると、独自のパーソナライズされた自慢のドキュメントを作成できます。
このチュートリアルの結果は、bragdocs.comを反映しており、独自のブラッグドキュメントの基盤を提供します。ライブデモはこちらから入手できます。
Eleventyは静的サイトジェネレーターです。フルスタック開発とは異なり、さまざまなテンプレート言語(HTML、マークダウン、リキッド、ヌンジャックなど)を使用して柔軟なコンテンツ作成が可能になります。このコンテンツをプロセスして、簡単にホスティングするために静的HTMLページを生成します。
このチュートリアルでは、リポジトリEleventy-Bragdocを使用しています。
プロジェクトの作成: Node用のREADME.md
と.gitignore
ファイルを使用して、githubリポジトリ(例えば、 eleventy-bragdoc
)を作成します。
初期化:端末のeleventy-bragdoc
ディレクトリに移動して実行します: npm init -y
これにより、 package.json
ファイルが作成されます。
インストール110: npm: npm install @11ty/eleventy
configuration( package.json
): package.json
のscripts
セクションを更新します:
{ // ... 「スクリプト」:{ 「start」: "lewent -serve"、 「ビルド」:「Eleventy」 }、 // ... }
.eleventy.js
):入力ディレクトリと出力ディレクトリを指定するために、 .eleventy.js
ファイルを作成します。module.exports = function(eleventyconfig){ 戻る { dir:{ 入力:「SRC」、 出力:「パブリック」 } } }
コンテンツの作成: src
ディレクトリを作成し、 index.md
ファイル(最初のページ)を追加します。 110はさまざまなテンプレート言語をサポートしています。この例では、マークダウンを使用しています。
テンプレートの作成: src/_includes/layouts
ディレクトリを作成し、 base.njk
ファイル(nunjucksを使用したベーステンプレート)を追加します。
CSSと画像の接続: src/css
およびsrc/images
ディレクトリを作成します。更新.eleventy.js
:
module.exports = function(eleventyconfig){ eleventyconfig.addwatchtarget( "./ src/css/") eleventyconfig.addwatchtarget( "./ src/images/") Eleventyconfig.addpassthroughcopy( "./ src/css/") eleventyconfig.addpassthroughcopy( "./ src/images/") // ... }
残りの手順では、コレクション、データ処理、スタイリング、展開など、Bragdoc機能の構築について詳しく説明しています。各ステップの完全なコードと詳細な説明は、元のテキストで入手できます。
以上がEleventyで独自のBragdocを作成しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。