狠狠撸

狠狠撸Share a Scribd company logo

20180723 okubo mtc_loud_handson

?Download as PPTX, PDF?
?
Six Apart
Six Apart

2018年7月23日 MTクラウドハンズオン用の資料です

1 of 149
Download to read offline
Movable Type クラウド版 ハンズオンセミナー 2018年7月23日 シックス?アパート株式会社 長内毅志
自己紹介 ?長内毅志 ? Movable Type ディベロッパーリレーションマネージャー ? エバンジェリスト –趣味 ダンス (ストリート、ジャズ) ジョギング (サブフォー) 英語の勉強 (TOEIC 875, 英検準1級) 家族と過ごすこと
まず最初に –アカウント情報を元に、アクセスできるか確認しましょう
アジェンダ ? Movable Type の特徴 ? 管理画面と基本操作 ? Movable Type 7 の特徴を理解する ? クラウド版独自の機能を理解する
Movable Type の特徴
Movable Typeとは ? 10年以上利用されているブログ?CMS(通称MT) ? MTタグ組み合わせでロジック生成 ? テンプレートとDBが完全に分離している (MVCライク) ? プラグインで拡張可能 ? どんなコードも生成可能
最新10件のブログ記事をリンク付きで生成 <ul> <MT:Entries limit="10"> <li> <a href="<MT:EntryPermalink>"> <MT:EntryTitle> </a> </li> </MT:Entries> </ul>
特徴1 ?静的生成でhtmlを出力 (スタティックパブリッシング) ?動的生成も対応可能 (ダイナミックパブリッシング)
?動的、静的生成どちらも対応することで、様々なサー バー構成に対して柔軟に対応できる
基本的な構成 公開サーバー兼 CMSサーバー 管理者 閲覧者 (サイト訪問者)
ステージング環境 ステージング サーバー兼 CMSサーバー 公開 サーバー 管理者 閲覧者 (サイト訪問者)
冗長構成 CMS サーバー 公開 サーバー （冗長構成） ロード バランサ
クラウド環境 –CMSサーバーをVMイメージで構築(Amazon EC2など) –公開ページはコンテンツサーバーで構築 –AmazonS3 など VMサーバー AmazonEC2など Amazon 厂3など
特徴2 ?柔軟なテンプレートタグ –四則計算なども可能 ?Data API でデータを利用することが可能 –データはJSON形式で出力、RESTで取得可能 –独自アプリも開発可能
Data APIを利用したアプリ例: Movable Type Writer
Data API を利用したアプリ例:Movable Type for iOS
Data API を利用したサイト実装例:東京書籍様
特徴3 ?中小企業から中-大規模企業、官公庁まで幅広い導 入実績
事例集 ?http://www.sixapart.jp/business
Movable Typeの管理画面と基本操作
Movable Type 7 の管理画面と 基本操作
? ダッシュボードが表示されます 。本日のハンズオンのために、 最初のサイトを作成します。左 メニューから「システム」をクリッ クします。
? システム設定の画面に移動し ます。左メニューから 「サイト」=>「新規」 をクリックします。
? サイトの作成画面に移動します 。以下の設定をします。 ? サイトテーマ =>Rainier ? サイト名 =>適宜名前をつける
? 続けて設定します。 ? タイムゾーン =>UTC+9 ? 使用言語 =>日本語 ? すべて設定したら「サイトの作成」 をクリックします。
? 作成が終わると、サイトの操作 画面に移動します。 ? 左メニューもしくは全般設定ペ ージ内の「再構築」をクリックし ます。
? ポップアップウィンドウが開き、再構築の 操作画面が表示されます。 ? 再構築とは、Movable Type からhtmlを生 成するための操作となります。 ? 再構築ボタンをクリックします。
? 再構築が終了したら、「サイトを見る」 をクリックします。
? 本日のハンズオンで操作する サイトが公開されているのが分 かります。
ブログではなく「サイト」
Movable Type 7 のサイトとは ? サイト –登録したコンテンツを管理す るための仕組み、入れもの ? 従来のウェブサイト、ブログに 当たる –記事?ページの管理も可能 –コンテンツタイプの管理も可能
1つの奥别产サイトを构成する例
复数の奥别产サイトを构成する例
コンテンツタイプを主とした构造化
记事の作成と公开
ハンズオン ?最初の記事を投稿してみましょう
? 左のメニューから 「記事」=>「新規」 をクリックします。 ? 最初の記事作成画面が表示さ れます。
20180723 okubo mtc_loud_handson
? タイトルと本文を入力して、右メニュ ーの「公開」ボタンをクリックします。
20180723 okubo mtc_loud_handson
? 公開が終わったら、サイトをもう 一度見てみましょう。 ? 今公開した記事が、新たに反 映されています。
?再構築とは –htmlを出力するための操作 –100ページ存在する場合、100ページのhtmlを実際に出力する
?「再構築」ボタンをクリックしてみましょう。 ?ポップアップウィンドウが出たら、再構築を実行して みましょう。
Movable Type 7 の特徴
20180723 okubo mtc_loud_handson
タイトル 見出し 段落
title Heading Paragraph
<h1> <h2> <p>
htmlの構造 ?論文の構造に非常に近い ?ロジカルに情報を伝える ?まとまった情報を「ページ」という単位で表示すること に長けている ?「ページ」をまとめることで「ウェブサイト」ができた
ウェブサイトの构造
?[ページ]という概念では捉えづらいコンテンツが増え 始めている
20180723 okubo mtc_loud_handson
20180723 okubo mtc_loud_handson
?「ページ」の概念とは异なるコンテンツ设计
http://www.nadeshikoleague.jp/
https://www.sixapart.jp/business/nadeshikoleague.html
現在のコンテンツ ネット上のコンテンツ≠ページ
?ネット上のコンテンツ ≠ ウェブページ ?細かい粒度でデータを管理する必要性 ?「ページ」ではなく、「コンテンツ」を適切な形で設計? 配信できるシステム ＝CMS
? コンテンツを管理しやすいシステムへ ? Content Type (コンテンツタイプ) 機能を新規搭載
?自由にコンテンツをデザインして管理する ?MTタグで利用可能 ?アーカイブマッピングの柔軟性、多様性はそのままに ?サイト管理の柔軟さの実現
ネット上のあらゆるコンテンツの配信システムとして
コンテンツタイプとは ?0 からすべての要素を設計可能 ?「ウェブページ」も、複雑な「コンテンツ」も
これまでのコンテンツ設計 ?記事フィールド ＋カスタムフィールド ?「ページ」をベースにした 画面設計
コンテンツタイプのコンテンツ設計 ?ドラッグ＆ドロップで自由にフィールドを定義
?数値、文字列、画像、ファイル、日時、Content-Type など… ?プラグインで拡張可能 ?複雑なコンテンツでも、一定のルールに誘導
ページの編集で良く聞く質問 写真=>文字?写真のよう にレイアウトしたい…
ブロックエディタ
コンテンツタイプに対応した「Data API Ver.4」 ?コンテンツタイプのデータをAPIで操作
?コンテンツごとの可用性、可搬性を高め ?コンテンツをより大きな価値に変えられる ?「Reusable」なコンテンツ管理を目指して
コンテンツタイプを触ってみる
素材ファイルをダウンロード https://goo.gl/VtbhmW
? 解凍すると[01_MTGram] [02_recipe] の2フォルダが展開されます
フォルダ内のファイルを確認しましょう ?01_MTGram –mtgram.html –サンプル写真
写真ギャラリーを开発する
開発するもの ?写真ギャラリー「MTGram」 ?写真「だけ」を登録していくウェブサービス
? 左メニュー [コンテンツタイプ] =>[新規]を選び、名前を「 MTGram」とします。
? 画面右部から[画像アセット] を選 び、中央にドラッグアンドドロップ します。名前を「画像」と指定しま す。[このフィールドは必須ですか ？]をオンにします 。
? ユーザーに新規イメージのアッ プロードを許可します。 終わったら[保存］ボタンをクリッ クします。
? コンテンツタイプがセーブされたこと を確認して、次に進みます。
? 右部メニューから[デザイン]=>[ テンプレート]を選びます。画面 上部の選択肢から[インデック ス]を選び、新規作成をクリック します。
? テンプレート名を[MTGram]としま す。 ? [mtgram.html]の中身をコピー&ペ ーストします。
? 出力ファイル名を [mtgram.html]とします ? [変更を保存]ボタンを押してセーブ し、[保存と再構築]ボタンをクリック します。
? 再構築が完了したら、右メニューから「公開された テンプレートを確認」リンクをクリックします。
? MTGramのサービスページが 公開されています。写真が未 登録の状態なので、登録してい きましょう。
? 右メニューから[コンテンツデータ ] => [MTGram]を選びます。 ? [MTGramを作成]を選びます。
? データ入力画面に変わります。 [データ識別ラベル]を入力しま す。[画像]から［アセットを選択 ］を選びます。
? 写真挿入画面が表示されるので、 任意の画像をアップロードします。
? 画像が選択されたことを確認し て、［挿入］ボタンをクリックしま す。
? 画像の挿入が終わったら「公開 」ボタンを押します。
? 公開ができたら、同じ要領で何枚か 写真を登録していきましょう
? 先程公開したインデックステンプレート「MTGram」のページ を確認します。 ? 写真ギャラリーが公開されているのがわかります。
?ウェブサイトのような「ページ」がない ?一覧ページ+写真のみ ?「コンテンツ」という粒度でデータを管理 =>コンテンツタイプ
クラウド版独自の機能を 理解する
Movable Type クラウド版とは ?シックス?アパートがサーバー管理 ?管理画面の動作が速く快適 ?常に最新版を使用可能 ?テクニカルサポート付き ?独自機能
?2種類のウェブサーバー –nginx版 ?低価格、高速。 ?5000円/月から –Apache版 ?一般的なウェブサーバー、マルチドメイン対応。 ?19000円/月から
nginxとは ? Apache、IISに続くシェア (netcraft社、2016/09) ? 軽量、高速。メモリ使用量が少ない ? デメリットもある(.htaccessが使えないなど)
MTクラウド版の構成 ?クラウド版独自の構成で高速化を実現 –管理画面、再構築ともに最適化されている ?クラウド版独自機能 –後述します
MTクラウドのドキュメント ?http://www.movabletype.jp/documentation/cloud
サーバー配信机能
サーバー配信机能とは ?MTクラウドで生成したコンテンツを外部のサーバー へ配信して公開する機能 ?MTクラウドをステージング環境として利用可能 ?FTP(S)で配信
サーバー配信机能 ?設定=>サーバー配信
叠补蝉颈肠认証
叠补蝉颈肠认証でできること ?公開しているウェブサイト?ブログに対して叠补蝉颈肠认証 の設定ができます ?ファイルに対しても設定できます ?複数設定が可能です
叠补蝉颈肠认証 ? 左メニューから クラウドサービス=>叠补蝉颈肠认証
ハンズオン ?ウェブサイト?ブログに叠补蝉颈肠认証をかけてみましょう ?サイトパスはMTクラウドで利用しているドメインを基 点として 「/」から相対パスで指定します
設定例 設定例 認証設定したいURL 設定内容 サイト全体に Basic 認証を設定したい http://www.example.com/ / 一部のディレクトリに Basic 認証を設定した い http://www.example.com/secret/ /secret/ 一部のファイルに Basic 認証を設定した い http://www.example.com/secret/file.ht ml /secret/file.html 利用しているMTクラウドのドメインが 「www.example.com」の場合
贬罢罢笔リダイレクト
贬罢罢笔リダイレクトとは ?あるディレクトリやファイルへのアクセスを、自動的に 他のURLに転送する仕組み
贬罢罢笔リダイレクト ? 左メニューから クラウドサービス => Redirect
ハンズオン ?ウェブサイトのindex.htmlをYahoo!へリダイレクトして みましょう。 ? / => https://www.yahoo.co.jp
管理画面のセキュリティ设定
ブルートフォースアタック(総当り攻撃) イラスト：「2014年版 情報セキュリティ10大脅威」より http://www.ipa.go.jp/security/vuln/10threats2014.html
ブルートフォースの例 [30/Aug/2014:22:09:48 +0900] "POST /wp-login.php HTTP/1.0" 200 5529 "-" "-" [30/Aug/2014:22:09:49 +0900] "POST /wp-login.php HTTP/1.0" 200 5529 "-" "-" [30/Aug/2014:22:09:50 +0900] "POST /wp-login.php HTTP/1.0" 200 5529 "-" "-" [30/Aug/2014:22:09:53 +0900] "POST /mt.cgi HTTP/1.0" 200 5529 "-" "-" [30/Aug/2014:22:09:54 +0900] "POST /mt.cgi HTTP/1.0" 200 5529 "-" "-" [30/Aug/2014:22:09:55 +0900] "POST /mt.cgi HTTP/1.0" 200 5529 "-" "-" [30/Aug/2014:22:09:56 +0900] "POST /mt.cgi HTTP/1.0" 200 5529 "-" "-" [30/Aug/2014:22:09:58 +0900] "POST /mt.cgi HTTP/1.0" 200 5529 "-" "-"
コード内の识别情报
管理画面のセキュリティ设定とは ?管理画面のURLを任意に変更することができます
?システム => クラウドサービス => セキュリティ
ハンズオン ?管理画面のURLを任意に変更してみましょう ?変更後、一度ログアウトして再ログインしましょう
その他 ?管理画面に叠补蝉颈肠认証の設定が可能 ?IP制限も可能
惭罢环境変数
惭罢环境変数とは ?MTの環境変数を管理画面から設定することができま す。 –http://www.movabletype.jp/documentation/appendices/config- directives/ ?設定不可能な環境変数もあります –http://www.movabletype.jp/documentation/cloud/specifications/config- directives.html
?システム => クラウドサービス => 惭罢环境変数
环境のリストア
环境のリストアでできること ?MTクラウドおよび公開済みのWebサイトのデータをす べて任意の時点の状態に戻す機能
环境のリストア ?システム => クラウドサービス => 环境のリストア
ハンズオン ?リストアを行ってみましょう ?最初の状態に戻っていることが確認できますか？
?その他の机能
ディスクの使用量 ?現在利用しているディスク容量が一目でわかるサー ビス ?システム => クラウドサービス => ディスクの使用量
自動アップデート ?MTを自動的に最新版にアップデートする機能。無効 にすることも可能。
サンドボックスサービス
サンドボックスサービスとは ?MTクラウドで構築した仮想マシンデータを複製して使 えるサービス
サービス利用料金 ご契約中のプランの月額料金1カ月分（＋消 費税） サンドボックス利用可 能期間 お申し込み月の翌月末日まで 申し込み期限 毎月25日まで（25日が休業の場合は直前の 前の営業日） ※ 26日以降のお申し込みは翌月1日のお申 し込み扱いとなります。 作成可能なサンドボッ クスの数 Movable Type クラウド版 １契約につき１つ まで
?http://www.sixapart.jp/movabletype/cloud/sandbox. html
Movable Type ソフトウェア版との違い
クラウド版でできて、ソフトウェア版でできないこと ?サーバー配信机能 ?叠补蝉颈肠认証 ?贬罢罢笔リダイレクト ?環境リストア(定期バックアップ) ?自動バージョンアップ、他
ソフトウェア版でできて、クラウド版でできないこと ?ブログの公開パスに制限があります –クラウド版は「/data/file/static」以下のみ –FTPからアクセスすると「/static」ディレクトリの み確認できます
?Movable Type のプログラムファイルの改変はできま せん。 –alt-search、alt-tmpl などの设定は可能
?サーバーへのSSH接続は不許可 –クラウド版は許可していません ?一部環境変数は使用できない –StaticWebPathなどのファイルシステム関連 –SQLSetNamesなど、DB関連
その他の制限事項 ?http://www.sixapart.jp/movabletype/cloud/specifica tion.html
ソフトウェア版からの 移行時のポイント
留意点 ?DBデータレベルの移行はできない –MTの標準機能「バックアップと復元」を基本とした移行を –移行後は「blogId」の変更に注意
例 ?MT6のサイトデータ移行 1. MT6のバックアップデータをMT6でバージョンを合わせて復元 1. バージョンに注意(6.2.4=>6.2.4など) 2. MT6からMT7へバージョンアップ 3. MTクラウドへ投入
コメントやトラックバックがない場合 ?MTのテーマ機能+データのエクスポートによる移行も 選択肢
移行用のテンプレート ?「バックアップと復元」や「エクスポート」が使えない場 合、テンプレートを利用したデータ作成という手があ る –https://github.com/movabletype/mt- recipes/blob/master/Export%20entry%20data%20in%20MT%20for mat.md
無料引越サービス ?MTクラウド版を契約した方に対して、一回のみ提供 –https://www.sixapart.jp/movabletype/cloud/migration-service.html
?価格
20180723 okubo mtc_loud_handson
20180723 okubo mtc_loud_handson
プライベートプラン ?より大規模なサイトを運用の場合、個別相談をお受 けします。
ご参加ありがとうございました。

More Related Content

20180723 okubo mtc_loud_handson

Editor's Notes

  1. https://commons.wikimedia.org/wiki/File:%E6%9D%91%E4%B8%8A%E5%85%81%E8%8B%B1%E5%8D%9A%E5%A3%AB%E8%AB%96%E6%96%871966%E5%B9%B4%E5%B1%B1%E5%8F%A3%E5%A4%A7%E5%AD%A6.jpeg
  2. https://commons.wikimedia.org/wiki/File:%E6%9D%91%E4%B8%8A%E5%85%81%E8%8B%B1%E5%8D%9A%E5%A3%AB%E8%AB%96%E6%96%871966%E5%B9%B4%E5%B1%B1%E5%8F%A3%E5%A4%A7%E5%AD%A6.jpeg
  3. https://commons.wikimedia.org/wiki/File:%E6%9D%91%E4%B8%8A%E5%85%81%E8%8B%B1%E5%8D%9A%E5%A3%AB%E8%AB%96%E6%96%871966%E5%B9%B4%E5%B1%B1%E5%8F%A3%E5%A4%A7%E5%AD%A6.jpeg
  4. https://commons.wikimedia.org/wiki/File:%E6%9D%91%E4%B8%8A%E5%85%81%E8%8B%B1%E5%8D%9A%E5%A3%AB%E8%AB%96%E6%96%871966%E5%B9%B4%E5%B1%B1%E5%8F%A3%E5%A4%A7%E5%AD%A6.jpeg
  5. 1989年3月、欧州原子核研究機構?(CERN) のティム?バーナーズ＝リーは「Information Management: A Proposal」（情報管理: 提案）を執筆し、ENQUIRE?を参照しつつさらに進んだ情報管理システムを描いた[6]。彼は1990年11月12日、World Wide Web?をより具体化した提案書「WorldWideWeb: Proposal for a HyperText Project」[7]を発表した。実装は1990年11月13日から開始され、バーナーズ＝リーは最初のウェブページ[8]を?NeXTワークステーション上に置いた。 その年のクリスマス休暇の間に、バーナーズ＝リーは WWW に必要な全ツールを構築した[9]。世界初のウェブブラウザ（ウェブエディタでもある）と世界初のWWWサーバである。