20151205フルスクラッチcms作成のノウハウ with laravel

フルスクラッチCMS作成ノウハウWith Laravel

株式会社オールアバウト

吉田拓実

(@y_takky2014)

1

自己紹介

吉田拓実(Yoshida Takumi)

@y_takky2014

https://twitter.com/y_takky2014

http://qiita.com/takky

趣味

Copyright 2015 All About,inc. 2

https://twitter.com/y_takky2014

http://qiita.com/takky

最近のお仕事

All About Japanの新規開発


今回伝えたいこと

フルスクラッチでCMSを開発する際のメリット・デメリット

LaravelでCMSを開発する良さ

開発のノウハウ


CMS何使ってます?


汎用CMSを案件で使うメリット

権限管理・画像アップロード・プレビュー機能など基本的なものは揃っている

実装の必要がほぼない


UPLOAD

PREVIEW

汎用CMSのデメリット

拡張しづらい

データの持ち方がCMS依存

要件が複雑だとコアに手を入れないと実現不可なことも・・・

CMS自体のアップデートやプラグインのアップデートができない


汎用CMSの限界と今回の要件

CMSも多言語化する

外部ライターも執筆する。IDとして自社のログインサービスを使用する


管理する要素記事

執筆者

テーマ(トップページのデザイン設定)

タグ

記事タイプが3種類まとめっぽいもの

1ページもの

旅行の日程みたいに日毎にページングするもの


汎用CMSの限界と今回の要件

フルスクラッチを決断した理由

要件を満たせる汎用CMSがなかった

要件満たすように改修しても同じくらいの工数がかかりそうだった

幸いにもリソースに余裕があった

今後の拡張やメンテのことを考えて

汎用CMSでメディアの長期運営は難しい

一時期WordPressで実装していたことも・・


CMSをフルスクラッチで作るメリット社内の細かい要望を叶えられる


この機能では画像アップロードの時にトリミングをこっちではトリミング機能いらない

CMSをフルスクラッチで作るメリット社内の細かい要望を叶えられる


この機能では画像アップロードの時にトリミングをこっちではトリミング機能いらない

編集中にミスってブラウザバックして編集内容なくなるからアラート出すようにして

記事データの活用が容易


CMSをフルスクラッチで作るメリット

CMS

DB

Front

RSS

API

リリース後のメンテナンス機能拡張が容易


CMSをフルスクラッチで作るメリット

新しく記事をまとめ直したページを作りたい

フルスクラッチのデメリット

各機能の実装が必要

コード量・開発工数は多い


UPLOAD TRIMMING

PREVIEWROLE

ここまでのまとめ


フルスクラッチ汎用CMS

自分で機能の実装が必要機能が用意されている

工数がかかる少ない工数で実装可能

拡張の実装がしやすい拡張の実装がしにくい

データの有効活用可能 CMSのデータ構造に影響される

要件を最大限に満たすことができる

CMSの機能内だとスムーズに実現できる

フルスクラッチ・汎用CMSのメリット・デメリットを考えて適切な選択を！

All About Japanのシステム構成(サーバサイド)


Front

CMS

5.5

5.6

5Laravel

Laravelとは

シンプルで可読性の高いコードが書ける

モダンフレームワーク

最新バージョンは5.1.11

LTS(12/5現在)

Laravelリファレンス2016/1/8発売!出版社インプレス


Laravel

多言語対応


Laravelを用いるメリット

viewでの実装

言語ファイル

ファイルシステム



ローカルローカルストレージ

本番S3

リソースフルコントローラコマンドラインでひな形を自動生成

メソッド + パスで処理を切り分けることができる



メソッドパスアクション

GET /article index

GET /article/create create

POST /article store

GET /article/{id} show

GET /article/{id}/edit edit

PUT/PATCH /article/{id} update

DELETE /article/{id} destriy

Validator



integer 整数であること

email メールアドレスであること

image 画像ファイル(jpg,png,bmp・・・)であること

required 入力が存在するかバリデート

alpha_dash アルファベットと-,_であること

Eloquent ORM

LaravelのORM

便利メソッド・機能が複数用意されている

クエリスコープ

よく使う検索条件をメソッド化



Composerでライブラリ管理

PHPの依存管理システム

ライブラリの導入が用意に

Packagist



Ace Responsive Admin Template

Bootstrapをwrapしたテンプレート

デザインを知らなくてもかっこいいUIが作れる


汎用CMSにあるこんな機能がバインドされている

画像ギャラリー

カラーピッカー

DateTimepicker

ドラック&ドロップでファイルアップロード


Ace Responsive Admin Template

Ace Admin + Laravelでの開発ノウハウ

Select2

Select boxを使いやすくするjQueryライブラリ

検索機能がつくselect boxを作成可能

1行で実装可能


画像処理

intervention/imageというライブラリを使う

Laravelに対応している画像処理のライブラリ

LaravelのRequestを元に画像ファイルの生成ができる


Ace Admin + Laravelでの開発ノウハウ

crop($width,$height,$x,$y) 幅・高さ・座標でトリミング

resize($width,$height) 幅・高さにリサイズ

encode($format) 指定した形式に変更

filesize() 画像のファイルサイズを取得

text($text, $x, $y) 座標の位置にテキストを付与する

エンジニア視点から見たCMS

作成のメリット

いろいろな技術に触れられる

サーバーサイド、フロントエンド

フレームワークの使い方

HTML

Javascript/jQuery

ライブラリ

DBの読み書き・トランザクション

新卒・若手エンジニアの育成とかにもおすすめ


まとめ

フルスクラッチで作るメリット

長期間のメディア運営のためにメンテナンス性・拡張性

細かい仕様に応えることが可能

データの有効活用

案件に応じた使い分けが必要

短期間で実装したい

CMSの機能で十分

というときは、汎用CMSを使うことも視野に


オールアバウトでのCMS開発ノウハウまとめ

Laravel + Ace Responsive Admin Templateを使用

Laravelでデフォルトである機能がCMS構築の際に便利に使える

リソースフルコントローラ

Validation

ファイルシステム

Ace Responsive Admin Templateを使うことで

エンジニアでもかっこいいUIのCMS


募集しています!!!

企画・編集の人と一緒に各種サービスや社内システム開発をしたいWEBエンジニア

オールアバウトのインフラを支えるインフラエンジニア


アドベントカレンダーやってます


ご清聴ありがとうございました


20151205フルスクラッチcms作成のノウハウ with laravel

Engineering