常連

注目の的

社会貢献

質問力

自己紹介

# エラー文
```
-bash: /Users/HayatoIse/.phpbrew/bashrc: No such file or directory
-bash: /Users/HayatoIse/.phpbrew/bashrc: No such file or directory
-bash: /Users/HayatoIse/.phpbrew/bashrc: No such file or directory
-bash: /sw/bin/init.s: No such file or directory
```

原因がわからなくて困っています...。

ターミナルを起動する度にbashに関するエラーが出る

###laravel開発環境をlaradockで構築したい
docker-compose up -d workspaceでエラーがでてしまいました。
原因がわからず困っています。わかる方いましたらご教示していただけると助かります。
###発生している問題・エラーメッセージ

```
ERROR: The Compose file './docker-compose.yml' is invalid because:
services.proxy.expose is invalid: should be of the format 'PORT[/PROTOCOL]'
services.proxy2.expose is invalid: should be of the format 'PORT[/PROTOCOL]'
services.memcached.ports is invalid: Invalid port ":11211", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.beanstalkd.ports is invalid: Invalid port ":11300", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.mssql.ports is invalid: Invalid port ":1433", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.rabbitmq.ports is invalid: Invalid port ":15671", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.rabbitmq.ports is invalid: Invalid port ":15672", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.workspace.ports is invalid: Invalid port ":22", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.mongo.ports is invalid: Invalid port ":27017", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.aerospike.ports is invalid: Invalid port ":3000", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.aerospike.ports is invalid: Invalid port ":3001", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.aerospike.ports is invalid: Invalid port ":3002", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.aerospike.ports is invalid: Invalid port ":3003", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.mariadb.ports is invalid: Invalid port ":3306", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.mysql.ports is invalid: Invalid port ":3306", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.percona.ports is invalid: Invalid port ":3306", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.apache2.ports is invalid: Invalid port ":443", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.caddy.ports is invalid: Invalid port ":443", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.nginx.ports is invalid: Invalid port ":443", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.selenium.ports is invalid: Invalid port ":4444", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.jenkins.ports is invalid: Invalid port ":50000", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.postgres.ports is invalid: Invalid port ":5432", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.postgres-postgis.ports is invalid: Invalid port ":5432", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.kibana.ports is invalid: Invalid port ":5601", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.rabbitmq.ports is invalid: Invalid port ":5672", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.laravel-echo-server.ports is invalid: Invalid port ":6001", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.apache2.ports is invalid: Invalid port ":80", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.caddy.ports is invalid: Invalid port ":80", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.nginx.ports is invalid: Invalid port ":80", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.phpmyadmin.ports is invalid: Invalid port ":80", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.adminer.ports is invalid: Invalid port ":8080", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.jenkins.ports is invalid: Invalid port ":8080", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.rethinkdb.ports is invalid: Invalid port ":8080", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.balancer.ports is invalid: Invalid port ":8085", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.minio.ports is invalid: Invalid port ":9000", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.elasticsearch.ports is invalid: Invalid port ":9200", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
services.elasticsearch.ports is invalid: Invalid port ":9300", should be [[remote_ip:]remote_port[-remote_port]:]port[/protocol]
```

###補足情報(言語/FW/ツール等のバージョンなど)
macOS Sierra
docker

docker-compose up -d workspaceでエラーがでた !!!!

Vue.jsを学習中（超初心者）でプランナーを作成しています。リスト一覧にfontawsomeの四角アイコンをデフォルトで表示し、クリックされたらチェックマークの四角アイコンに変えたいのですが、うまくいきません。

入力フォームで入力された内容と"checked=false"をpropsで渡しています。
リストでは　"v-if="goal.checked"ならチェックマークの四角アイコン、"v-else"なら四角アイコンを表示するよう<i>タグを書き、その<i>タグを囲んだ<div>タグに@clickを設定しています。

まず、"checked=false"を渡しているので、リスト一覧には全て四角アイコンが表示されます。その中のひとつをクリックすると、そのアイコンがチェックマークの四角アイコンに変わります。ここまでは希望通りです。更に他の四角アイコンやチェックマークに変えた四角アイコンをクリックすると、エラーが発生します。

一度めのクリックイベントは正常に動くのに次のクリックでエラーになってしまいます。2日悩みましたが解決に至らないので、質問させていただきました。


### 発生している問題・エラーメッセージ


```
「vue.esm.js:1896 TypeError: clicked is not a function」
「vue.esm.js:629 [Vue warn]: Error in v-on handler: "TypeError: clicked is not a function"」
```

### 該当のソースコード

```app.js
Vue.component('display-area', {
	props: {
		goals: {
			type: Array,
			required: true
		}
	},
	template: `
        <div class="display-area">
            <div class="main">
                <div class="display-area-left">                
                    <ul>
                        <li class="goal-name" v-for="(goal, index) in goals">
                            <div @click.stop="clicked(index)">
                                <v-fa v-if="goal.checked" class="check-square" :icon="['fas', 'check-square']" />
                                <v-fa v-else class="square" :icon="['far', 'square']" />
                            </div>
                            <span @click="showGoalDetails(index)">{{ goal.name }}</span>
                            <v-fa class="trash" :icon="['fas', 'trash-alt']" />
                        </li>
                    </ul>
                </div>
                
            </div>  
        </div>
    `,
	data() {
		return {	
			selectedGoal: 0
		}
	},
	methods: {
		showGoalDetails: function(index){
			this.selectedGoal = index
		},
		clicked(index) {
			this.clicked = index
			if(this.goals[this.clicked].checked){
				this.goals[this.clicked].checked = false
			}else{
				this.goals[this.clicked].checked = true
			}				
		}
	},
	computed: {
		names() {
			return this.goals[this.selectedGoal].name
		}
	}
})

```

### 試したこと

v-showで試したり、アイコンのクラスをdata()に書いてcomputedでリターンするなど試しましたが、どの方法もうまくいきませんでした。

### 補足情報（FW/ツールのバージョンなど）
バージョン
"vue": "^2.6.11"

Vue.js　クリックでfontawsomeのアイコンを切り替える

Vue.jsのbootstrap利用時にアイコン（b-icon）をクリックしたいです。

b-buttonで囲みアイコンを中に配置して、ボタンをクリックするように記載はできましたが、
ボタンをクリックするようになるので、アイコン自体をクリックしているようにしたいです。

以下のように、直接クリック属性を設定したり、a,spanタグで囲めないかやってみましたが、うまくいきません。

アイコン自体をクリックする方法をご教授ください。

```html
<b-icon icon="three-dots-vertical" @click.prevent="setXXX()"></b-icon>

<a @click.prevent="setXXX()">
   <b-icon icon="three-dots-vertical"></b-icon>
</a>

<span @click.prevent="setXXX()">
   <b-icon icon="three-dots-vertical"></b-icon>
</span>
```

Vue.jsのbootstrap利用時にアイコン（b-icon）をクリックしたい

### 発生している問題・エラーメッセージ
ajaxでrailsのコントローラを呼び出し、ているのですが、redirect_toが動作せず、指定先のアクションに移行しません。
コンソール上でエラー文は出力されず、原因がわかりません。


### 前提・実現したいこと
ブラウザの現在地情報を元にマップ上に近くお店を表示するアプリケーションを作ろうとしています。
**■処理の流れ**
1. top.html.erb上の「近くのご飯を探す」ボタンをクリックして、food_menu.js内の`getFoodInfo()` を呼び出す
2. `successCallback()`関数内でajaxで`/food_menu/search`をPOSTで呼び出す
3. `food_menu_controller.rb`内の`search`メソッドでAPIを叩いたあと、showにリダイレクトする

### 使用技術
■言語/FW
Ruby on Rails 5.2.1
Ruby 2.5.3

■使用API
Geolocation API
Hotpepper API


### 該当のソースコード
food_menu/top.html.erb
```
<div class="container">
  <div class="row">
    <div class="col-md-8 food-search-form">
        <h3>近くのワンコイン飯を探しましょう！</h3>
        <div>
          <input type="button" name="search-food" value="近くのご飯を探す" onClick="getFoodInfo()">
        </div>
    </div>
    <div id="error_message"></div>
  </div>
</div>
```
food_menu.js
```javascript
//***** ユーザーの現在の位置情報を取得 *****
function successCallback(position) {

 var lat = position.coords.latitude;
 var long = position.coords.longitude;

 $.ajax({
   url: '/food_menu/search',  
   type: 'POST',
   dataType: 'js',
   // 非同期ならtrue、同期ならfalse。
   async: true,
   data: {
     latitude: lat,
     longitude: long
   },
 });
}

//***** 位置情報が取得できない場合 ******
function errorCallback(error) {
  var err_msg = "";

  switch(error.code)
  {
    case 1:
      err_msg = "位置情報の利用が許可されていません";
      break;
    case 2:
      err_msg = "デバイスの位置が判定できません";
      break;
    case 3:
      err_msg = "タイムアウトしました";
      break;
  }
  document.getElementById("error_message").innerHTML = err_msg;
}

function getFoodInfo(){
  navigator.geolocation.getCurrentPosition(successCallback, errorCallback);
}
```
food_menu_controller.rb
```Ruby
class FoodMenuController < ApplicationController

  def top
  end

  def search
    response = get_menues_from_api(params[:latitude], params[:longitude])
    result = ""
    message = ""
    
    begin
      # responseの値に応じて処理を分ける
      case response
      # 成功した場合
      when Net::HTTPSuccess
        # responseのbody要素をJSON形式で解釈し、hashに変換
        result = JSON.parse(response.body)
      # 別のURLに飛ばされた場合
      when Net::HTTPRedirection
        message = "Redirection: code=#{response.code} message=#{response.message}"
      # その他エラー
      else
        message = "HTTP ERROR: code=#{response.code} message=#{response.message}"
      end

    rescue IOError => e
      message = "e.message"
    rescue TimeoutError => e
      message = "e.message"
    rescue JSON::ParserError => e
      message = "e.message"
    rescue => e
      message = "e.message"
    ensure
      p "Reached ensure block!"
      redirect_to food_menu_show_path
    end
  end

  def show
    p "show!"
    @food_map = params[:food_map]
    @message = params[:message]
  end
  
  def index
  end

  private

  def get_menues_from_api(lat, lng)
    # 現在地からお店情報を取得するクエリを作成
    query = "http://webservice.recruit.co.jp/hotpepper/gourmet/v1/?key=<apiのkey>&format=json"
    query += "&lat=" + lat
    query += "&lng=" + lng
    
    uri = URI.parse(query)
    #クエリ実行
    response = Net::HTTP.start(uri.host, uri.port) do |http|
      # 接続時に待つ最大秒数を設定
      http.open_timeout = 5
      # 読み込み一回でブロックして良い最大秒数を設定
      http.read_timeout = 10
      
      http.get(uri.request_uri)
    end

    response
  end
    
end
```
food_menu/show.html.erb
```
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset=utf-8>

<title>Geolocation API サンプル</title>
</head>
<body>
<p>あなたの近くの検索結果</p>
<div id="food_map">
<%= @food_map["shop"][0] %>
<%= @message %>
</div>
<div id="error_message"></div>
</body>
</html>
```

routes.rb
```
Rails.application.routes.draw do
  root to: 'food_menu#top'
  get 'food_menu/index'
  post 'food_menu/search', to: 'food_menu#search'
  get 'food_menu/show'
  # For details on the DSL available within this file, see http://guides.rubyonrails.org/routing.html
end
```
rails routes 実行結果
```
$ rails routes
Prefix Verb URI Pattern                                                                              Controller#Action
                     root GET  /                                                                                        food_menu#top
          food_menu_index GET  /food_menu/index(.:format)                                                               food_menu#index
         food_menu_search POST /food_menu/search(.:format)                                                              food_menu#search
           food_menu_show GET  /food_menu/show(.:format)                                                                food_menu#show
```

### 試したこと

・`binding.pry`を使用し、`food_menu_controller.rb`のsearchメソッド内で`begin~ensure` の内容は問題なく動いていることを確認しました。
・redirect_toの直前で `"Reached ensure block!"`という文字列を出力させ、直前までは動いていることを確認しました。
・redirect_toではなく、`render 'show'` に変更しましたが挙動は変わりませんでした。

ajaxで呼び出したRailsのコントローラから他アクションにリダイレクトできない

以下のようなエンティティのリレーションになっているとして
![イメージ説明](6f4a1d5c447e61039926f1a9a86362ba.png)
```
class UserAccount < ApplicationRecord
　　has_many :comments
end

class ClientAccount < ApplicationRecord
　　has_many :comments
end

class Commen< ApplicationRecord
　　belongs_to:client_account
    belongs_to:user_account
end

```
以上の様なリレーションメソッドが作られているとします。
この時Commentモデルからclientとuserをincludesしたい時は
`Comment.includes(:client_account).includes(:user_account)`
と書いていたのですがこのようなリレーションになっている場合includesをメソッドチェーンせず書く方法はあるのでしょうか。
孫テーブルや曾孫テーブルをincludesする方法は見かけるのですが、このようなリレーションになっている場合の書き方を見つけられなかった為
質問致しました。
よろしくお願い致します。

(rails)includesメソッドの効率的な書き方について

### 前提・実現したいこと
どちらもuser_idカラムを持っているtestsテーブルとpostsテーブルがあるのですが、特定のidがuser_idカラムに入っているレコードを2つのテーブルから新しい順に全て取得するにはどうすればいいですか？

そしてそのレコードに入っているデータを新しい順（1つのテーブルの新しい順ではなく、2つのテーブルからみた新しい順）にviewで表示したいのですが、その時にどのテーブルのデータなのかも表示できるようにしたいです。
### 自分で調べたことや試したこと
特定のidを持つレコードを1つのテーブルから取得することはできますが、複数（2つ以上）のテーブルから特定条件で取得する方法を知りたいです。

テーブルの結合？というものが必要になると思うのですが、具体的にどういうコードを書けばいいのかわかりません。