[Laravel Nova] v2.0.0がリリースされました
リリース内容としてはLaravelv5.8への対応ですが、先日にもNovaのv1.3.2のリリースもあり、コミュニティでは多くのユーザーを獲得しているようです。
v2.0.0までのリリース履歴
Novaのv1.0がリリースされたのが2018年08月ですが、頻繁にバージョンアップのリリースが行われています。
v2.0.0 Released February 26, 2019
v1.3.2 Released February 11, 2019
v1.3.1 Released January 21, 2019
v1.3.0 Released January 7, 2019
v1.2.1 Released December 12, 2018
v1.2.0 Released November 28, 2018
v1.1.9 Released November 27, 2018
v1.1.8 Released November 21, 2018
v1.1.7 Released October 25, 2018
v1.1.6 Released October 24, 20186
v1.1.5 Released October 23, 2018
v1.1.4 Released October 1, 2018
v1.1.3 Released September 21, 2018
v1.1.2 Released September 21, 2018
v1.1.1 Released September 20, 2018
v1.1.0 Released September 20, 2018
v1.0.19 Released September 19, 2018
v1.0.18 Released September 19, 2018
v1.0.17 Released September 18, 2018
v1.0.16 Released September 12, 2018
v1.0.15 Released September 11, 2018
v1.0.14 Released September 9, 2018
v1.0.13 Released September 7, 2018
v1.0.12 Released September 4, 2018
v1.0.11 Released September 4, 2018
v1.0.10 Released September 4, 2018
v1.0.9 Released September 4, 2018
v1.0.8 Released August 29, 2018
v1.0.7 Released August 28, 2018
v1.0.6 Released August 24, 2018
v1.0.5 Released August 23, 2018
v1.0.4 Released August 23, 2018
v1.0.3 Released August 22, 2018
v1.0.2 Released August 22, 2018
v1.0.1 Released August 22, 2018
v1.0.0 Released August 22, 2018
Novaを使ったアプリケーション
特に日本では利用者が少ないイメージです。
私は1つのプロジェクトをLaravel Novaへの移行が完了し、操作性や開発速度の速さを体感しています。
デフォルトでAlgoliaの検索エンジンの利用も実装されており、必要な情報へどこからでもアクセスできます。
Laravelを使ってアプリケーションを作成する場合に、サーバーサイドだけでなく、フロント部分にもフォーカスしたい場合には特におすすめします。
また、ダウンロードしたNovaのソースコードはLaravel + Vue.jsを利用したアプリケーションのデファクトスタンダードと言ってもよいでしょう。とても参考になり、これだけでも価値があると思えます。
今後はコミュニティを広げる為にも、Laravel Novaの使用感等をレポートしていく予定です。
[Laravel Nova] オリジナルのテーマを設定する方法
Laravel Novaにはデフォルトでとても美しいデザインが採用されていますが、このデザインをカスタマイズする方法をご紹介します。
Laravel Novaのインストールについてはこちらをご覧ください。
NovaServiceProviderへのスタイルシート登録
Laravel NovaのベースはTailwind CSSで作られています。
CSSの定義やオーバーライドをしてスタイルの上書きを行います。
Laravel\Nova\Novaクラスのstyleメソッドは、オリジナルのスタイルシートをテンプレート内に出力できる関数です。
App\NovaServiceProviderのbootメソッドを以下のように編集します。
/**
* Bootstrap any application services.
*
* @return void
*/
public function boot()
{
parent::boot();
Nova::style('miami-ice-theme', asset('css/miami-ice.css'));
}
css/miami-ice.cssへ以下の内容でファイルを追加します。
:root {
--transparent: transparent;
--black: #22292f;
--white: white;
--white-50: rgba(255, 255, 255, 0.5);
--danger: #e74444;
--success: #21b978;
--warning: #ffeb3b;
--info: #03a9f4;
--primary: #FE0181;
--primary-dark: #D10069;
--primary-70: rgba(254, 1, 129, 0.7);
--primary-50: rgba(254, 1, 129, 0.5);
--primary-30: rgba(254, 1, 129, 0.3);
--primary-10: rgba(254, 1, 129, 0.1);
--logo: ;
--sidebar-icon: #DB34DE;
--20: #f6fbff;
--30: #f4f7fa;
--40: #eef1f4;
--50: #e3e7eb;
--60: #bacad6;
--70: #b3b9bf;
--80: #7c858e;
--90: #252d37;
--90-half: rgba(40, 54, 61, 0.5);
}
.bg-grad-sidebar {
background-image: -webkit-gradient(
linear,
left bottom,
left top,
from(rgb(254, 1, 129, 1)),
to(#3c4655)
);
background-image: linear-gradient(0deg, rgb(254, 1, 129, 1), rgb(100, 5, 113));
}
テンプレート内に<link rel="stylesheet" href="/nova-api/styles/miami-ice-theme">が追記されてデザインが変更されます。
Nova Theme Generatorを利用したデザインの作成
Nova Theme Generatorというジェネレーターツールが公開されています。
Laravel Novaで作られたサイト上でデザインのカスタマイズやテーマの作成が行えます。
今回は、作成済みのテーマを使ってデザインの変更を行ってみます。
こちらからテーマのダウンロードを行います。
zipファイルを解凍後、カレントディレクトリにnova-themeディレクトリとして配置します。
composer.jsonのrepositoriesとrequireにテーマの内容を追記します。
{
"name": "laravel/laravel",
"description": "The Laravel Framework.",
"keywords": ["framework", "laravel"],
"license": "MIT",
"type": "project",
"repositories": [
{
"type": "path",
"url": "./nova"
},
{
"type": "path",
"url": "./nova-theme"
}
],
"require": {
"php": "^7.1.3",
"fideloper/proxy": "^4.0",
"laravel/framework": "5.7.*",
"laravel/nova": "*",
"laravel/tinker": "^1.0",
"olixr/clean-green": "*"
},
// ...
}
追加後にcomposer updateで読み込みます。
Package Auto Discoveryによってサービスプロバイダが読み込まれ、デザインが反映されます。
パッケージを利用したデザインの変更
サードパーティーのパッケージですが、composerでインストールできるデザインもリリースされています。
Nova Stripe Themeを使用してStripe風のデザインを適用させます。
composer require jameslkingsley/nova-stripe-theme
Package Auto Discoveryによってサービスプロバイダが読み込まれ、デザインが反映されます。
[Laravel Nova] Laravel Novaが発表されました
Laracon 2018にて、Laravel Teamによる新しいサービスである Laravel Nova が発表されました。
Laravel NovaはLaravel Teamによる Laravelのためのデザインの高い管理システム と発表されました。
beautifully designed administration panel for Laravel
Laravel NovaはComposerのパッケージとして配布され、すでに作成済みのLaravelプロジェクトにもインストールが可能です。
また、容易に拡張が行えるように準備されており、簡単な設定を行うだけでこれらのリソースを即座に利用できます。
フロントエンドには、Vue.jsやVue Router、およびTailwindを使用したSPAとして構築されています。優れたデザイン性に加え、高度なカスタマイズも可能です。
{{< post-img src="/img/post/2018/07/laravel-nova-introduction_01.png" >}}
発表の様子は Laracon 2018 - Taylor Otwell - Keynote にてご覧になれます。
気になる価格ですが、SOLO版が $99、PRO版が$199と発表されています。
2018年8月にリリース予定とのことですが、Laravel Novaで事前登録することでアーリーアクセスが可能とのこと。
[Laravel Nova] Laravel Novaがリリースされました
Laracon 2018にて、Laravel Teamによる新しいサービスである Laravel Nova が発表されました。
Laravel NovaはLaravel Teamによる Laravelのためのデザインの高い管理システム と発表されました。
beautifully designed administration panel for Laravel
Laravel NovaはComposerのパッケージとして配布され、すでに作成済みのLaravelプロジェクトにもインストールが可能です。
また、容易に拡張が行えるように準備されており、簡単な設定を行うだけでこれらのリソースを即座に利用できます。
フロントエンドには、Vue.jsやVue Router、およびTailwindを使用したSPAとして構築されています。優れたデザイン性に加え、高度なカスタマイズも可能です。
発表の様子は Laracon 2018 - Taylor Otwell - Keynote にてご覧になれます。
気になる価格ですが、SOLO版が $99、PRO版が$199と発表されています。
2018年8月にリリース予定とのことですが、Laravel Novaで事前登録することでアーリーアクセスが可能とのこと。
