目次
私のWordPressの旅:テーマ開発など
JavaScriptの命令とギャツビーの台頭
早期の反応とREST APIベースのテーマの調査
反応を受け入れ、ギャツビーを発見します
GatsbyとWordPressの統合:リソースと課題
ギャツビーのテーマとプラグイン
必須ガイド
私の部分的に移植されたギャツビーサイトと将来の方向
最終的な考え
ホームページ ウェブフロントエンド CSSチュートリアル 分離されたWordPress Gatsbyサイトへの私の長い旅

分離されたWordPress Gatsbyサイトへの私の長い旅

Apr 04, 2025 am 10:08 AM

分離されたWordPress Gatsbyサイトへの私の長い旅

サイエンスラボからウェブデザインまで:生物学者の予期せぬ道。私の科学的背景は、深い好奇心、顕微鏡やペトリ料理からウェブ開発の魅力的な世界まで私を導いた特徴を植え付けました。ホームサイトやドリームウィーバーなどのツールを使用して、遠心分離サンプルと凍結実験の中でHTMLを学びました。 10年前、WordPressは私の人生に入り、趣味をフルタイムの情熱に変えました。

私のWordPressの旅:テーマ開発など

自称WordPress愛好家である私の最初の進出は、テーマのハッキングに関係しており、モーテンランドヘンドリクセンの「アンダースコアを使用したゼロからの構築テーマ」に大きく依存していました。このチュートリアルは、MortenのGitHubリポジトリとともに、貴重なリソースになりました。 Sara Soueidanの「Just Write」哲学の哲学に触発された、個人的な検索エンジンに優しいアーカイブのために、カスタムテーマ(Kuhn、Popperなど)を作成しました。私もプラグインとウィジェットの開発に手を出しましたが、私の焦点は主にテーマに留まりました。

JavaScriptの命令とギャツビーの台頭

Matt Mullenwegの2015年、Gutenbergの編集者の発表と相まって、より深いJavaScriptの習熟度を求めて、ターニングポイントがマークされました。 JavaScriptの重要性を認識して、私はZell Liewの「学習JavaScriptを学ぶ学習の旅に着手しました。

早期の反応とREST APIベースのテーマの調査

Foxhound、Picard、CelestialなどのReactベースのWordPressテーマの出現は、最初は私の興味をそそりました。しかし、これらは実験的であるように思われ、私の限られたJavaScript/React知識はより深い探査を妨げました。

反応を受け入れ、ギャツビーを発見します

Robin Wieruchの「Learning Reactの前のJavaScript Fundamentals」をロードマップとして使用して、私は反応に取り組みました。 @Reach/Routerを使用しているGatsbyのルーティングのシンプルさは、ゲームチェンジャーを証明しました。ギャツビーのスピードと効率は、マーケティング資料で説明されているように、さらにそれに焦点を当てるという私の決定を固めました。私はギャツビーのチュートリアルを熱心に取り組み、ジャスティンフォーメントンの「ギャツビーサイトをゼロから構築するためのガイド」などのリソースを活用し、Reactgoの「Gatsbyを使用して高度なブログを構築し、React」のスキルを築きました。 CSSモジュールのメリットを認めていますが、その親しみやすさと読みやすさのためにSASSスタイリングを選択しました。

GatsbyとWordPressの統合:リソースと課題

多くのギャツビーを搭載したサイトは、そのパフォーマンスとセキュリティの利点を強調しています。ただし、WordPressとの統合は課題を提示しました。 Northstackチュートリアルで詳述されているように、ネイティブのWordPress機能であるコメント処理には、Disqusなどの代替ソリューションが必要です。

ギャツビーのテーマとプラグイン

私の探検には、さまざまなWordPressにインスパイアされたGatsbyテーマ(Tabor、GatsbyのテーマWordPressスターター、WordPressソーステーマ)とGatsby WPテーマプロジェクトが含まれていました。有望なことに、多くのテーマには初心者向けのドキュメントがありませんでした。また、Gatsby SourceのWordPress ExperimentalやGatsby WordPress Gutenbergなどの実験プラグインを調査しました。どちらもまだ開発中です。

必須ガイド

Mohammad MohsinのReactテーマの構築とGatsbyへの21のポーティングに関するSmashing Magazineの記事は、非常に貴重であることが証明されました。 Henrik WirthのWPGRAPHQLを使用してWordPressサイトをギャツビーに移植することに関するHenrik Wirthの包括的な7部構成ガイドも、Jamstackへの移行に関するJason Longstorfのチュートリアルと同様に非常に役立ちました( Jason Podcastの学習に基づいて)。

私の部分的に移植されたギャツビーサイトと将来の方向

この旅の集大成は、私自身の部分的に移植されたWordPress Gatsbyサイトです(詳細なウォークスルーは来週公開されます)。実験的なWordPressプラグインの開発を綿密に監視して、公式のリリースを期待しています。 WordPressブロックエディター、WPGRAPHQL、およびGatsbyのソースプラグインの進行中の進化は、刺激的な可能性と継続的な課題の両方を提示します。

最終的な考え

現在、Gatsby WordPressのテーマは初心者にとっては完全に成熟していません。分離されたアプローチは、より大きなプロジェクトに大きな利点を提供しますが、私の個人的なニーズには、マークダウンコンテンツを備えた標準的なギャツビーサイトで十分です。ギャツビーとワードプレス統合の将来は有望ですが、現在の制限は慎重に検討する必要があります。来週の詳細なチュートリアルにご期待ください!

以上が分離されたWordPress Gatsbyサイトへの私の長い旅の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

粘着性のあるポジショニングとサスのダッシュを備えた積み重ねられたカード 粘着性のあるポジショニングとサスのダッシュを備えた積み重ねられたカード Apr 03, 2025 am 10:30 AM

先日、Corey Ginnivanのウェブサイトから、この特に素敵なビットを見つけました。そこでは、スクロール中にカードのコレクションが互いに積み重ねられていました。

Googleフォント変数フォント Googleフォント変数フォント Apr 09, 2025 am 10:42 AM

Google Fontsが新しいデザイン(ツイート)を展開したようです。最後の大きな再設計と比較して、これははるかに反復的です。違いをほとんど伝えることができません

HTML、CSS、JavaScriptを使用してアニメーションカウントダウンタイマーを作成する方法 HTML、CSS、JavaScriptを使用してアニメーションカウントダウンタイマーを作成する方法 Apr 11, 2025 am 11:29 AM

プロジェクトにカウントダウンタイマーが必要だったことはありますか?そのようなことのために、プラグインに手を伸ばすのは自然なことかもしれませんが、実際にはもっとたくさんあります

HTMLデータ属性ガイド HTMLデータ属性ガイド Apr 11, 2025 am 11:50 AM

HTML、CSS、およびJavaScriptのデータ属性について知りたいと思っていたことはすべて。

フレックスレイアウト内の紫色のスラッシュ領域が誤って「オーバーフロー空間」と見なされるのはなぜですか? フレックスレイアウト内の紫色のスラッシュ領域が誤って「オーバーフロー空間」と見なされるのはなぜですか? Apr 05, 2025 pm 05:51 PM

フレックスレイアウトの紫色のスラッシュ領域に関する質問フレックスレイアウトを使用すると、開発者ツールなどの混乱する現象に遭遇する可能性があります(D ...

CSSを介してファーストクラスの名前アイテムを使用して子要素を選択する方法は? CSSを介してファーストクラスの名前アイテムを使用して子要素を選択する方法は? Apr 05, 2025 pm 11:24 PM

要素の数が固定されていない場合、CSSを介して指定されたクラス名の最初の子要素を選択する方法。 HTML構造を処理するとき、あなたはしばしば異なる要素に遭遇します...

SASSをより速くするための概念の証明 SASSをより速くするための概念の証明 Apr 16, 2025 am 10:38 AM

新しいプロジェクトの開始時に、SASSコンピレーションは瞬く間に起こります。これは、特にbrowsersyncとペアになっている場合は素晴らしい気分です。

See all articles