laravel react 初期設定

Package Management | React 

フロントエンド片手間ンによる Laravel Elixir 入門 - Qiita

yum install nodejs npm
npm -v
npm install -g gulp
gulp -v

npm install -g bower
bower -v
yum  --enablerepo=epel install php-devel yum  --enablerepo=epel install php-devel 

package.jsona

{
  "private": true,
  "devDependencies": {
    "gulp": "^3.8.8"
  },
  "dependencies": {
    "laravel-elixir": "^3.0.0"
  }
}
npm install

npm install --save react react-dom babelify babel-preset-react

Package Management | React

gulpfile.js

var elixir = require('laravel-elixir');

elixir(function(mix) {
    mix.sass('app.scss')
        .browserify('app.js')
        .copy(
        'node_modules/font-awesome/fonts',
        'public/build/fonts'
        ).version(['css/app.css', 'js/app.js']);
        .browserSync({proxy: 'works.dev'});
});

Laravel5 ベースのプロジェクトに React が爆速で導入できた話 - 無駄と文化

 

hello world

resources/assets/js/app.js

var React = require('react');
var ReactDOM = require('react-dom');

ReactDOM.render(
  <h1>Hello, world!</h1>,
  document.getElementById('example')
);

public/react-example/index.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8" />
  <title>Hello React!</title>
</head>
<body>
  <div id="example"></div>
  <script src="/js/app.js"></script>
</body>
</html>

gulp watch

http://localhost:8000/react-example/

 

 Error in plugin 'gulp-notify'  

npm install --save-dev gulp-notify

yum install libnotify

で解決

 

react-laravel  composer 

composerが存在するパッケージを見つけられない - Qiita

{
    "minimum-stability": "dev",
    "require": {
        "example/package1": "dev-master",
    }
}
yum install v8

yum --enablerepo=remi,remi-php70 install php-devel

 

 

 

 

 

 

 

 

 

 

 

nginx php-fpm はまったとこ

selinux

firewall

 

CentOS7+PHP7+Nginx+MariaDB+Redisの環境を作る方法 - Qiita

CentOS7+nginx+php7+MariaDBの環境構築 - Qiita

 

listen = /var/run/php-fpm/php-fpm.sock

再起動すると生成される

nginx + php-fpm socketで接続する - Qiita

これがなぜかなかった

最悪これで動く

/etc/php5/fpm/pool.d/www.conf
- ;listen = 127.0.0.1:9000
+ listen = 127.0.0.1:9000
  ;listen = /var/run/php5-fpm.sock
/etc/nginx/nginx.conf
- #fastcgi_pass 127.0.0.1:9000;
+ fastcgi_pass 127.0.0.1:9000;
  #fastcgi_pass unix:/var/run/php5-fpm.sock;

 

api-mock はnode.js V6にはまだ対応してないらしい

V5に下げたら動いた

 

 

打ち合わせにて

主導権をこっちが握る

   お客さんをリードする

 

実装に当たって決めなければいけないことは何か

  

ただ聞くのではなく、こちらからどのような状態がベストか提案する

 それによって何を実現させたいか

 言われたものをつくるだけでなく、ユーザー視点と工数のバランスを考える

あらゆるパターン、質問がくることを想定する

    一回一回が勝負

 お客さんに試されている

 

 

node.js gulp install

579 gulp -v
580 npm -v
581 pwd
582 ls -la
583 npm install
584 gulp update
585 gulp install
586 ls -la
587 vim gulpfile.js
588 gulp update
589 npm install -g api-mock   <-- これだとだめだった
590 gulp
591 npm install api-mock   <--  これで解決
592 gulp