<rails-tutorial> Cloud9上のブラウザ表示がおかしい

Question

#つまずいている事
rails初心者です。
現在、rails tutorialの２章を進めています。
micropostsモデルを「rails db:migrate」した後に
Bitbucket,herokuにプッシュし、ブラウザ上で確認しようとしたところ
以下の様な表示内容になって抜け出せない状況です。

※コード自体はrailsのscaffold機能を使い
ルーティングやコントローラーはそのままになっています。

#実行したコマンド

XXXXX:~/environment/toy_app (master) $ rails db:migrate
== 20181209092805 CreateMicroposts: migrating =================================
-- create_table(:microposts)
   -> 0.0025s
== 20181209092805 CreateMicroposts: migrated (0.0033s) ========================

XXXXX:~/environment/toy_app (master) $ git commit -am "Add hello"
[master 5b94eec] Add hello
 1 file changed, 2 insertions(+), 1 deletion(-)
XXXXX:~/environment/toy_app (master) $ git push heroku
Counting objects: 4, done.
Compressing objects: 100% (4/4), done.
Writing objects: 100% (4/4), 397 bytes | 397.00 KiB/s, done.
Total 4 (delta 2), reused 0 (delta 0)
remote: Compressing source files... done.
remote: Building source:
remote: 
remote: -----> Ruby app detected
remote: -----> Compiling Ruby/Rails
remote: -----> Using Ruby version: ruby-2.4.5
remote: -----> Installing dependencies using bundler 1.15.2
remote:        Running: bundle install --without development:test --path vendor/bundle --binstubs vendor/bundle/bin -j4 --deployment
remote:        Warning: the running version of Bundler (1.15.2) is older than the version that created the lockfile (1.17.1). We suggest you upgrade to the latest version of Bundler by running `gem install bundler`.
remote:        Fetching gem metadata from https://rubygems.org/.........
remote:        Fetching version metadata from https://rubygems.org/..
remote:        Fetching dependency metadata from https://rubygems.org/
remote:        Using rake 12.3.2
remote:        Using concurrent-ruby 1.1.3
remote:        Using minitest 5.11.3
remote:        Using thread_safe 0.3.6
remote:        Using builder 3.2.3
remote:        Using erubi 1.7.1
remote:        Using mini_portile2 2.3.0
remote:        Using crass 1.0.4
remote:        Using rack 2.0.6
remote:        Using nio4r 2.3.1
remote:        Using websocket-extensions 0.1.3
remote:        Using mini_mime 1.0.1
remote:        Using arel 8.0.0
remote:        Using bundler 1.15.2
remote:        Using coffee-script-source 1.12.2
remote:        Using execjs 2.7.0
remote:        Using method_source 0.9.2
remote:        Using thor 0.20.3
remote:        Using ffi 1.9.25
remote:        Using multi_json 1.13.1
remote:        Using pg 0.20.0
remote:        Using puma 3.9.1
remote:        Using rb-fsevent 0.10.3
remote:        Using tilt 2.0.9
remote:        Using turbolinks-source 5.2.0
remote:        Using i18n 1.1.1
remote:        Using tzinfo 1.2.5
remote:        Using nokogiri 1.8.5
remote:        Using websocket-driver 0.6.5
remote:        Using mail 2.7.1
remote:        Using rack-test 1.1.0
remote:        Using sprockets 3.7.2
remote:        Using rb-inotify 0.9.10
remote:        Using turbolinks 5.0.1
remote:        Using activesupport 5.1.6
remote:        Using coffee-script 2.4.1
remote:        Using uglifier 3.2.0
remote:        Using loofah 2.2.3
remote:        Using sass-listen 4.0.0
remote:        Using rails-dom-testing 2.0.3
remote:        Using globalid 0.4.1
remote:        Using activemodel 5.1.6
remote:        Using jbuilder 2.7.0
remote:        Using sass 3.7.2
remote:        Using rails-html-sanitizer 1.0.4
remote:        Using activerecord 5.1.6
remote:        Using activejob 5.1.6
remote:        Using actionview 5.1.6
remote:        Using actionpack 5.1.6
remote:        Using actioncable 5.1.6
remote:        Using actionmailer 5.1.6
remote:        Using railties 5.1.6
remote:        Using sprockets-rails 3.2.1
remote:        Using coffee-rails 4.2.2
remote:        Using jquery-rails 4.3.1
remote:        Using rails 5.1.6
remote:        Using sass-rails 5.0.6
remote:        Bundle complete! 16 Gemfile dependencies, 57 gems now installed.
remote:        Gems in the groups development and test were not installed.
remote:        Bundled gems are installed into ./vendor/bundle.
remote:        Bundle completed (2.90s)
remote:        Cleaning up the bundler cache.
remote:        Warning: the running version of Bundler (1.15.2) is older than the version that created the lockfile (1.17.1). We suggest you upgrade to the latest version of Bundler by running `gem install bundler`.
remote:        The latest bundler is 2.0.0.pre.2, but you are currently running 1.15.2.
remote:        To update, run `gem install bundler --pre`
remote: -----> Installing node-v8.10.0-linux-x64
remote: -----> Detecting rake tasks
remote: -----> Preparing app for Rails asset pipeline
remote:        Running: rake assets:precompile
remote:        Yarn executable was not detected in the system.
remote:        Download Yarn at https://yarnpkg.com/en/docs/install
remote:        Asset precompilation completed (1.53s)
remote:        Cleaning assets
remote:        Running: rake assets:clean
remote: -----> Detecting rails configuration
remote: 
remote: WARNING:
remote: 
remote:        You have not declared a Ruby version in your Gemfile.
remote:        To set your Ruby version add this line to your Gemfile:
remote:        ruby '2.4.5'
remote:         See https://devcenter.heroku.com/articles/ruby-versions for more information.
remote: 
remote:  WARNING:
remote: 
remote:        No Procfile detected, using the default web server.
remote:        We recommend explicitly declaring how to boot your server process via a Procfile.
remote:        https://devcenter.heroku.com/articles/ruby-default-web-server
remote: 
remote: 
remote: -----> Discovering process types
remote:        Procfile declares types     -> (none)
remote:        Default types for buildpack -> console, rake, web
remote: 
remote: -----> Compressing...
remote:        Done: 41.1M
remote: -----> Launching...
remote:        Released v7
remote:        https://infinite-basin-51374.herokuapp.com/ deployed to Heroku
remote: 
remote: Verifying deploy... done.
To https://git.heroku.com/infinite-basin-51374.git
   cb779a4..5b94eec  master -> master
XXXXX:~/environment/toy_app (master) $ git push
Counting objects: 15, done.
Compressing objects: 100% (15/15), done.
Writing objects: 100% (15/15), 2.19 KiB | 374.00 KiB/s, done.
Total 15 (delta 7), reused 0 (delta 0)
To bitbucket.org:piyota08/toy_app.git
   cf2a173..5b94eec  master -> master
XXXXXX:~/environment/toy_app (master) $ git push heroku
Everything up-to-date

#ブラウザの表示

[
  {"name":".bundle","size":4096,"mtime":1544316057255,"ctime":1544316057255,"mime":"inode/directory"},
  {"name":".c9","size":4096,"mtime":1544235169151,"ctime":1544235169151,"mime":"inode/directory"},
  {"name":"README.md","size":570,"mtime":1543829888425,"ctime":1543829888425,"mime":"text/x-markdown"},
  {"name":"hello_app","size":4096,"mtime":1544316621483,"ctime":1544316621483,"mime":"inode/directory"},
  {"name":"toy_app","size":4096,"mtime":1544323530994,"ctime":1544323530994,"mime":"inode/directory"}
]

#routesの追記

Rails.application.routes.draw do
  
  resources :microposts
  resources :users
  root 'users#index'
  
end

#エラー後の対処
再度Bitbucket,herokuにプッシュし直すなどしてみましたが
ブラウザは同じ表示のままでした。

#追記 microposts controller

class MicropostsController < ApplicationController
  before_action :set_micropost, only: [:show, :edit, :update, :destroy]

  # GET /microposts
  # GET /microposts.json
  def index
    @microposts = Micropost.all
  end

  # GET /microposts/1
  # GET /microposts/1.json
  def show
  end

  # GET /microposts/new
  def new
    @micropost = Micropost.new
  end

  # GET /microposts/1/edit
  def edit
  end

  # POST /microposts
  # POST /microposts.json
  def create
    @micropost = Micropost.new(micropost_params)

    respond_to do |format|
      if @micropost.save
        format.html { redirect_to @micropost, notice: 'Micropost was successfully created.' }
        format.json { render :show, status: :created, location: @micropost }
      else
        format.html { render :new }
        format.json { render json: @micropost.errors, status: :unprocessable_entity }
      end
    end
  end

  # PATCH/PUT /microposts/1
  # PATCH/PUT /microposts/1.json
  def update
    respond_to do |format|
      if @micropost.update(micropost_params)
        format.html { redirect_to @micropost, notice: 'Micropost was successfully updated.' }
        format.json { render :show, status: :ok, location: @micropost }
      else
        format.html { render :edit }
        format.json { render json: @micropost.errors, status: :unprocessable_entity }
      end
    end
  end

  # DELETE /microposts/1
  # DELETE /microposts/1.json
  def destroy
    @micropost.destroy
    respond_to do |format|
      format.html { redirect_to microposts_url, notice: 'Micropost was successfully destroyed.' }
      format.json { head :no_content }
    end
  end

  private
    # Use callbacks to share common setup or constraints between actions.
    def set_micropost
      @micropost = Micropost.find(params[:id])
    end

    # Never trust parameters from the scary internet, only allow the white list through.
    def micropost_params
      params.require(:micropost).permit(:content, :user_id)
    end
end

#お願い
一人では解決が難しいため
どなたかアドバイスをよろしくお願いします。

以上です。

Answer 1

問題の切り分け方としてはrailsのlogフォルダにdevelopment.logファイルがあるので、エラーがあれば、そこにlogが残っているはずです。
そこにエラーがなければこの場合はcloud9の設定に問題がある可能性があるかもしれないですね。

あとRailsのチュートリアルを進めているということですが、そもそもcloud9の上でrails sは実行出来ているのでしょうか？　エラーが出てませんか？

エラー後対処が少し気になります。cloud9（ローカル環境）でエラーが出ているものをいくらBitbucketやherokuにpushしてもエラーになります。Bitbucketとherokuはcloud9（ローカル環境）とは関係ありません。

RailsのチュートリアルはBitbucketにコードが全部公開されているので、履歴を追いながら自分のコードと見比べることができます。ここで、コードが一緒なのにエラーだった場合はおそらくcloud9（ローカル環境）に問題があると推測できます。

Railsのチュートリアルはrailsやrubyをそこそこ扱っている人でも完全に理解するにはわりと難しいですよ。

Comments

[iyore888]

アドバイス有難う御座います。
結論から申しますと先ほど昨日ぶりにcloud9を再起動したところ
同じ手順で問題なくローカル環境で表示することができました。
お騒がせ致しました。。原因は分からないままです。。

またその他アドバイス有難う御座います。
以後はdevelopment.logのログとBitbucketのrails tutorialも確認してみる様にします!

ひとまずチュートリアルを進めて行こうと思います。
お手数お掛け致しました。

Answer 2

ローカル側のエラーなのかheroku側のエラーなのか問題を切り分ける必要があると思います。

ローカル環境で問題なく動いているのであれば、問題はheroku側にあるということです。ターミネーターでheroku logsを実行し、herokuのログを確認してみるといいと思います。
何かエラーが出ているはずです。

おそらく、herokuにgit pushしたあとのheroku run rake db:migrateを忘れているだけだと思いますが。

Comments

[iyore888]

アドバイス頂き有難う御座います。
上記のブラウザのエラーですがローカル側(cloud9)のエラーになります。
もちろんweb上でも表示されません。（表題の記述が紛らわしく申し訳ないです。。）
その場合どこに着目してエラーを解決すべきでしょうか。

※microposts contorollerの記述も記載致しました。