Vue(Webpack)+Rails+Mysql+Cloud9

#1 現状のMySQLバージョンを確認

$ mysql --version

#2 旧バージョン(5.5)パッケージ関連を削除

$ sudo yum -y remove mysql-config mysql55-server mysql55-libs mysql55

#3 新バージョン(5.7)パッケージ関連をインストール

sudo yum -y install mysql57-server mysql57

#4 日本語文字化け対策を実施

$ sed -e "/utf8/d" -e "/client/d" -e "/^\[mysqld_safe\]$/i character-set-server=utf8\n\n[client]\ndefault-character-set=utf8" /etc/my.cnf |sudo tee /etc/my.cnf

#5 MySQL確認&起動

$ mysql --version
$ sudo service mysqld start

#6 MySQL Account を作る

$ sudo mysql -u root   #rootユーザーでログイン
$ mysql> create user 'ユーザー名' identified by 'パスワード';  #ユーザー作成
$ mysql> grant all on *.* to 'ユーザー名';  #ALL権限付与

#作成したユーザーの確認は下記コマンド
$ mysql> select User,Host from mysql.user;

#7 順番にライブラリをインストール&mysql2(gem)のインストール

$　sudo yum install mysql57-devel
$　sudo yum -y install ruby-devel
$　sudo yum groupinstall "Development Tools"

$　gem install mysql2

#8 Railsをインストール

$ gem install rails -v 5.2.1

#9 yarnインストール

$ npm install -g yarn

#10 プロジェクトを作成

$ rails new vueapp --webpack=vue --database=mysql

#11 config/database.ymlの編集

default: &default
  adapter: mysql2
  encoding: unicode
  pool: 5
  # 以下、3行追加
  username: <username> # 設定したMySQL Accountと同一のもの
  password: <password> # 設定したMySQL Accountと同一のもの
  host: localhost

development:
  <<: *default
  database: appname_development # appnameのところは、rails new時のappnameになっているはずです。
test:
  <<: *default
  database: appname_test # appnameのところは、rails new時のappnameになっているはずです。

#12 rails db:createでデータベースを作成

$ cd appname
$ rails db:create

#13 foreman+Procrile

Gemfile

group :development do
  ...
+ gem 'foreman'
end

追記が終わったらbundle installを実行してください。

設定用のProcfileをアプリケーションルートに作成し、実行内容を記載します。

Procfile

rails: bundle exec rails server
webpack: ./bin/webpack-dev-server

$ foreman start