Vue.js + vuexによるToDoアプリケーションの実装
前々回の記事でLaravel 5.4 + Vue.jsの開発環境を構築し、前回の記事でLaravel 5.4によるWeb APIを作成しました。 今回は、作成したWeb APIを使用したToDoリストアプリケーションを、Vue.jsを使って作成します。 PHP側の積み残し はじめに、昨日のコントローラーを修正します。 もともと、ItemControllerのindex()メソッドは「Item::all()」メソッドで全てのアイテムを返していました。しかし、画面上に表示するのは未完了のアイテムだけです。そこで、index()メソッドを以下のように変更します。 <?php public function index() { return response(Item::query()->where('checked', false)->get()); } <?php public functio
Laravel 5.4でWeb APIを作る
前回の記事では、Laravelでフロントエンド開発を行うための開発環境の作り方を解説しました。今回は、LaravelでWeb APIを作る方法を解説します。 データベースの準備 アプリケーションのデータはデータベースに保存するようにしたいので、セットアップを行います。 Laravelアプリケーションを作成すると、以下の値でデフォルトの接続情報が作成されます。 データベース: MySQL データベース名: homestead ユーザ名: homestead パスワード: secret ローカル開発環境にMySQLがインストール済みなら、上と同じ条件で新しいデータベースを作成するのが手軽です。 手元の環境にMySQLをインストールしたくない、といった場合には、開発用VMのLaravel Homesteadを利用するのが良いでしょう。 DBへの接続情報は、アプリケーションのルートディレクトリの「
Laravel 5.4で Vue.js開発環境を手軽に作る
こんにちは。宇都宮です。 最近はアシアル社内でもLaravelを使うことが増えてきました。また、フロントエンドも、ReactやVue.jsを使ったプロジェクトをちらほら見かけるようになってきました。 今回は、Laravelのインストール方法と、フロントエンド開発環境のセットアップ、簡単なVueコンポーネントの作り方を解説します。 Laravelとフロントエンド Laravelでは、5.3から、Vue.jsが標準のJavaScriptフレームワークになりました。 さらに、5.4では、フロントエンドのビルドツールが、gulpベースのElixirから、WebpackベースのMixに変わりました。 Laravelをインストールすれば、Web APIはLaravelで作って、SPA(Single Page Application)をVue.jsで組む、といったことが簡単にできるようになっています。
jQuery 3.0βリリース。2系と3系の違いについて
2016年に入り、jQuery 3.0βがリリースされました。はっきりとしたロードマップは出ていないものの、今年中には正式リリースするのではないでしょうか。 そこで今回はjQuery 2.xと3.xで何が変わるのか、紹介したいと思います。 jQuery Compatはなくなります 元々レガシーなブラウザをサポートするjQuery Compatも開発されていましたが、MicrosoftがIE8をサポートしなくなったのを受けて、jQueryもIEを非サポートすることになりました。その結果、jQuery Compatの開発は中止となり、jQuery 3.x一本になります。 Alphaで実装したshow()、hide()のインライン操作の排除 元々実験的なものでしたが、スタイルシートなどで設定された場合に必ずしも正しく動かないことが分かったためとしています。メソッド自体は残りますのでこれまで通りと
Burp Suiteで脆弱性診断
こんにちは。坂本です。 今回は脆弱性診断ツールができるBurp Suiteというツールを紹介します。 このセキュリティ界隈では知らない人はいない有名なツールです。 Burp Suiteは脆弱性診断に必要な機能を揃えています。 ・Webサイトへリクエストする情報を改ざんして脆弱性がないか確認する機能 ・WebサイトをクローリングしてURLのリストを取得する機能 ・取得したURLに対して脆弱性がないか診断をする機能 などなど この機能を実現するためBurp Suiteはプロキシサーバとなります。 プロキシとなったBurp SuiteはWebサイトとブラウザの間に入りリクエストを傍受し脆弱性診断を行うことができます。 Burp Suiteの購入から起動 Burp Suiteで脆弱性診断をするにはライセンスを購入する必要があります。 まずは公式サイトでBurp Suiteのダウンロードを行います。
Laravel5でシンプルなCRUDアプリを開発する
こんにちは〜たきゃはしです〜最近もホントにとにかくビール最高！って感じです！ 今回はついにリリースされたLaravel5（以降はL5と略記する）を早速使ってみました！ ◯ この記事の概要 L5の基本機能を扱いつつシンプルなブログアプリを作ってみようと思います。 こんな感じになります この記事の目的はブログアプリの開発を通してL5でCRUDを作れるようになることです。構成をなるべくシンプルにしたかったこともあり沢山の機能は取り扱ったわけではありませんが「PHPやMySQLは分かるけどFWはよくわからないな〜」とか「Laravel5 気になってるんだよな〜」という人には特におすすめですよ！ さっそくインストールからはじめたいと思います。 ◯ インストール
JavaScriptで日付を扱うならこれ！「moment.js」
■ つかいかた（基礎編） ダウンロードしたmoment.jsをscriptタグで読み込ませたら準備完了です。 あとは下記のような実装で使用できます。 // momentオブジェクトを初期化して・・・ var m = moment(); // formatで出力! var output = m.format("YYYY年MM月DD日 HH:mm:ss dddd"); console.log(output); // => 2013年05月15日 12:34:56 Wednesday // 現在時刻 moment(); // ミリ秒で指定 moment(1368543600000); // タイムスタンプ（秒）で指定 moment.unix(1368543600); // Date.parseで解析可能な文字列を指定 moment("May 15, 2013"); // Dateオブジェクトか
CSSだけで簡単に吹き出しを作成する方法4つ！
こんにちは、橋本です。 今日はCSSだけでお手軽に吹き出しを作る方法をご紹介したいと思います。 今回ご紹介するサンプルは4つ 一般的な三角の吹き出し 一般的な三角の吹き出し（ボーダー付き） ぽわわーんとした吹き出し 丸い（曲線の）吹き出し 4つのサンプルの実行結果は、ここで確認できます。 IE9以上とIE以外のブラウザであればちゃんと表示されるかと思います。 IE8以下はborder-radiusが使用出来ないため、サンプル3とサンプル4がちゃんと表示されません。 それでは1つ1つ見て行きましょう。 1.一般的な三角の吹き出し まずはソースから。 <!DOCTYPE HTML> <html lang="ja"> <head> <meta charset="UTF-8"> <style type="text/css"> * { box-sizing: border-box; } .wrapp
HTML5+CSS3の導入時に役立つ7つの設定
こんにちは、鴨田です。 個人的に仕事の大半はスマートフォン関連なので、 最近のマークアップはほとんど全てHTML5+CSS3で行っています。 とはいえ、PC向けのサイトではまだまだHTML4.01、XHTML1.0、CSS2.1を使用している場合が多いと思います。 ですので、今回はHTML5+CSS3を導入するにあたって、役立つと思う7つの設定について、書きたいと思います。 １．HTML5の初期テンプレート案 <!DOCTYPE html> <html> <head> <meta charset=utf-8 /> <title>HTML5 初期テンプレート</title> <!-- reset.cssの設定 --> <link rel="stylesheet" media="screen" href="reset.css" /> <!-- Viewportの設定 --> <meta nam
jQueryで作るヘルプページ
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/basetop2.dwt" codeOutsideHTMLIsLocked="false" --> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Jquery-Help</title> <link href="./jquery.ehelp.css" type="tex
DRBD+heartbeat+LVM(on Fedora Core10)によるクラスタリング
こんにちは、亀本です。 今回は、PHPとかから少し離れて、サーバのクラスタリングのお話です。 ちょっと仕事で冗長化システムを組む必要があったので、せっかくなので記事にまとめました。 さて、ここで目指すのは、DRBDを使ったデータレプリケーションサーバ( Master / Slave 構成 )の自動フェイルオーバークラスタ( 非フェイルバック構成 )です。 ネットワーク構成としては、ルータから結ばれるLAN(eth0に接続)とは別に、eth1で１対１のLAN接続を行います。 また、heartbeatでのクラスタ構成後は、eth0に仮想IPとして192.168.1.100を割り振るようにします。 eth1の設定は、 # vi /etc/sysconfig/network-scripts/ifcfg-eth1 DEVICE=eth1 HWADDR=00:00:00:00:00:00 ONBOOT
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Gitを使い始めたらやっておきたい便利な設定いろいろ
mysqlのレプリケーション
使えるとちょっと便利なLinuxコマンド