blog template

AI Summer に基づく科学ブログ テンプレート

現在のテンプレートは、次のようなさまざまな必要なコンポーネントをサポートしているため、科学ブログに使用できます。

• ラテックスレンダリング
• 強調表示されたコード ブロック
• 参考文献と引用
• gif やビデオを埋め込む
• インタラクティブなコンポーネント
• 目次
• 類似記事

その他の重要な機能:

• トピックごとに投稿をフィルタリングして表示する機能
• カスタマイズ可能な著者ページ
• 100% 反応します
• ページは標準の React コードまたは Markdown を使用して作成できます
• flexsearchを使用してローカルインデックスで検索する
• SEO対応
• レスポンシブ画像と画像前処理パイプライン
• Googleアナリティクスとタグマネージャー
• robots.txt の生成
• XMLフィードの生成
• サイトマップの生成

私たちのウェブサイトで実際の例をご覧ください

このテンプレートは theaiSummer.com に基づいており、科学ブログ用の最小限ですぐに使用できる機能豊富なフレームワークを提供するために、不必要なものをすべて取り除いています。

重要な情報

• テンプレートは Gatsby v2 で構築されているため、React についてある程度の知識が必要です。カスタマイズしたい方は、Gatsby の公式ドキュメントをチェックすることを強くお勧めします。
• Javascript の代わりに Typescript と TSX が使用されます
• Sass プリプロセッサはスタイル設定に使用されます
• Markdown の代わりに MDX が使用されるため、Markdown 内にカスタム React コンポーネントを追加できます。これにより、高度なカスタマイズ性、インタラクティブなウィジェットなどが可能になります。
• LatexはKatexとremark-mathでレンダリングされます
• コードブロックは prism-react-renderer でレンダリングされます
• Gatsby パラダイムに従い、GraphQL を使用して Web サイトのコンテンツをクエリします
• YAML ファイルを使用してコンテンツを取得することもできます
• フォームはreact-hook-formを使用して作成できます
• スクロール時のアニメーションのサポート

テンプレートの実行方法

1. 必要な依存関係をインストールする

 $ yarn install

2. ギャツビーを走れ

 $ yarn start

導入する前に何をする必要がありますか?

• gatsby-configサイト情報で更新します
• ロゴとアイコンをassets/images/にアップロードします。
• Seo.tsxコンポーネントを更新する
• styles/
• site-contentの yaml ファイルを更新する

導入方法

1. 最終的な静的ファイルをビルドする

 $ yarn build

2. Web サイトをプレビューする

 $ yarn serve

3. publicフォルダーを選択したホスティング オプションに転送します。たとえば、AI Summer は Firebase ホスティング上にデプロイされていますが、どのオブジェクト ストレージでも問題なく動作します。

 $ firebase deploy

サポート

このリポジトリが本当に気に入って役立つと思われる場合は、(★)スターを付けることを検討してください。これにより、同じ考えを持つ人々のより幅広い視聴者に届くようになります。大変感謝いたします:)!

バグの提供と報告

機能を追加したり、バグを修正したりして、テンプレートに貢献していただければ幸いです。このテンプレートは Web 開発者ではなく、機械学習エンジニアによって作成されたものであることを覚えておいてください。そのため、あらかじめお詫びを申し上げます。

バグを見つけた場合は、GitHub の問題を作成するか、プル リクエストを送信してください。同様に、質問がある場合は、GitHub の問題として投稿してください。詳細については、こちらをご覧ください。

現在のチーム

セルヒオス・カラギアナコス、ニコラス・アダログロウ、イリアス・パパスタティス

ライセンス

著作権 2022、AI サマー。

Apache License、バージョン 2.0 に基づいてライセンス供与されています

完全なライセンスを参照してください。