靜的なWebサイトのワークフローを簡単に作成するには、わずか10分かかります。

次の利點が得られます。

• 無料のhttps
• 無料または低コストのホスティング
• すぐにウェブサイトを構築します
• リアルタイムのリロード編集
• 6か月後にすべてを忘れても、簡単に編集できます

開始：登録します

Netlify（非常にシンプルな靜的ホスティング）とANYMOD（數(shù)百のWebサイトモジュール）を使用して、これらすべてを行うことができます。

• Netlify登録
• AnyMod登録

展開パイプラインをセットアップします

基本的なHTMLファイルを作成し、GitHubを使用して追跡し、NetLifyを使用して自動的に展開します。

（手動設定が必要な場合は、この手順をスキップして、代わりにドラッグとドロップしてNetlifyフォルダーにファイルを展開できます。）

1. GitHubに空のリポジトリを作成します。

https://github.com/newにアクセスして、netlify-anymodに名前を付けます。

2.ネットリフィーをリポジトリに接続します。

Netlify起動畫面でこれを行うことができます。

3.コンピューターにフォルダーを作成し、index.htmlという名前のファイルを追加します。

これを行うことができます。端末で次のコマンドを?qū)g行できます。

 <code>mkdir netlify-anymod cd netlify-anymod touch index.html</code>

index.htmlファイルを編集して、基本的なHTML構造を追加します。

 


  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>netlify＆Anymod | CSSトリック</title>


  こんにちは世界！

4。Gitで追跡し、Githubに展開します

git init
Git Remote Add Origin https://github.com/tyrw/netlify-anymod.git
git add -a
gitcump -m "初期コミット"
Git Push  - セットアップストリームオリジンマスター

注： git remote add originのURLを獨自のリポジトリURLに置き換えます。

Netlify URLを約1分で確認すると、Webサイトがオンラインである必要があります！

モジュール「mods」を追加する

展開を設定したので、ページ自體を構築できます。 AnyModですぐに使用できるモジュール（「mods」）を使用します。

選択できるモジュールはたくさんありますが、編集テーマのモジュールを使用します。

ナビゲーション

（このモジュールを表示）

はじめに/ヒーローユニット

（このモジュールを表示）

形狀

（このモジュールを表示）

畫像ギャラリー

（このモジュールを表示）

モジュールをクローンして追加します

各モジュールの「クローン」をクリックしてこれらのモジュールを追加し、下にスクロールしてインストールコードをindex.htmlファイルにコピー/貼り付けます。また、プロジェクトスクリプトをコピーして上部に貼り付けます。

index.htmlは次のようになります。

 


  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  
  <script>
    (function (m,o,d,u,l,a,r,i,z,e) {
      u[m]={Project:o,rq:[],Opts:r,ready:function(j){u[m].rq.push(j)}};function j(s){return encodeURIComponent(btoa(s))};z=l.getElementById(m '-' a);r=u.location;
      e=[d '/page/' o '/' j(r.pathname) '/' j(r.host) '?t=' Date.now(),d];e.map(function(w){i=l.createElement(a);i.defer=1;i.src=w;z.parentNode.insertBefore(i,z);});
    })('AnyMod','82PEPN','https://cdn.anymod.com/v2',window,document,'script',{ toolkit: true, tips: true, priority: 3 });
  </script>
  <div data-anymod-mod="navigation"></div>
  <div data-anymod-mod="hero"></div>
  <div data-anymod-mod="form"></div>
  <div data-anymod-mod="image-gallery"></div>

ページの準備ができました。

次に、GitHubに保存してプッシュしてWebサイトを展開します。

 git add -a
gitcump -m "Modsを追加しました"
Git Push Origin

ちょっと待ってください、そしてあなたのウェブサイトは使用する準備ができているはずです。これはデモページです。

デモを表示します

コンテンツを編集します

これで、各モジュールのコンテンツとコードをリアルタイムで編集できます。自分のページを表示すると（AnyModに記録されています）、右側(cè)に鉛筆アイコンが表示されます。

鉛筆をクリックして、モジュールを選択します。次に、コンテンツ（またはコード）に編集を行い、ページ上でリアルタイムで自動的に更新されることに注意してください。

この方法を使用してすぐに編集したり、プロジェクトの設定を忘れたりする6か月後に編集できます。

形狀

フォームも自動的に動作します。自分のページにメッセージを送信してみてください。返信はすぐにメールで送信されます。

結論は

これで、高速で信頼性の高い、安全な靜的Webサイトを構築する素晴らしい方法があります。

覚えておいてください：能力が大きければ大きいほど、責任が大きくなります。

以上がNetlifyおよびAnyModを備えた高速靜的サイトの詳細內(nèi)容です。詳細については、PHP 中國語 Web サイトの他の関連記事を參照してください。