かずきの日記

エンジニア・起業・人生の日記

Ruby on Rails 超初心者向け 初めてのユーザーログイン機能作成 その①サーバー作業

どうもかずきです!

 

今更感ですが何だかんだアプリ作成で作りがちな一番最初に試したい機能ということで今回はRuby on Rails 超初心者向け 初めてのログイン機能作成 参考用という内容で行ってみようと思います

 「フリー写真 ウェブサイト」の画像検索結果

 

 

gem 'devise'の導入 

 

Gemfileの最後尾に以下を記述

Gemfile


gem 'devise'

 

railsアプリケーションをすでに作成している上での段階から説明しますが、rails newをする時にバージョン指定を行わないと不具合が生じることがあります 

bundle installをする

以下の順番で実行します

 

ターミナル


$ bundle install

$ rails s

ショートカットキー control + c を押す

$ rails g devise:install

 

bundle install をするときは、作成しているアプリのディレクトリにいるか確認してから実行して下さい 

 ついでにrails sでローカルサーバーを再起動します

その後control + cで再度終了させてからrails g devise:install

  • config/initializers/devise.rb
  • config/locales/devise.en.yml

のファイルを自動生成できます

 

Userモデルの作成

rails g devise userを実行

 

ターミナル


$ rails g devise user

 これにより、

  • app/models/user.rb
  • db/migrate/20??XXXXXXXXXX_devise_create_users.rb
  • test/fixtures/users.yml
  • test/models/user_test.rb

 

のモデルファイルとマイグレーションファイル、テストファイルが自動生成されます

 

以下のファイルの自動追記がされているか確認

 

config/routes.rb


Rails.application.routes.draw do

# 以下の一行が追記されているか確認 devise_for :users 
# For details on the DSL available within this file, see http://guides.rubyonrails.org/routing.html
root 'hoge#index' # 以下略 end

 devise_for :users自動追記されていれば成功です

rails routes でユーザー系のルートが生成されているか確認

ターミナル


$ rails routes

以下略 n
ew_user_session GET /users/sign_in(.:format) devise/sessions#new user_session POST /users/sign_in(.:format) devise/sessions#create destroy_user_session DELETE /users/sign_out(.:format) devise/sessions#destroy new_user_password GET /users/password/new(.:format) devise/passwords#new edit_user_password GET /users/password/edit(.:format) devise/passwords#edit user_password PATCH /users/password(.:format) devise/passwords#update PUT /users/password(.:format) devise/passwords#update POST /users/password(.:format) devise/passwords#create cancel_user_registration GET /users/cancel(.:format) devise/registrations#cancel new_user_registration GET /users/sign_up(.:format) devise/registrations#new edit_user_registration GET /users/edit(.:format) devise/registrations#edit user_registration PATCH /users(.:format) devise/registrations#update PUT /users(.:format) devise/registrations#update DELETE /users(.:format) devise/registrations#destroy POST /users(.:format) devise/registrations#create
以下略

 すごく便利

 rails db:migrateを実行

ターミナル


$ rails db:migrate

 これでusersテーブルが作成されます

 userモデルのファイルの記述を確認

app/models/user.rb


class User < ApplicationRecord
  # Include default devise modules. Others available are:
  # :confirmable, :lockable, :timeoutable, :trackable and :omniauthable
  devise :database_authenticatable, :registerable,
         :recoverable, :rememberable, :validatable
end

 devise以下の記述の意味も理解しておくために簡潔にまとめました

  • detabase_authenticatable(DB保存時にパスワードの暗号化)
  • regiasterable(新規登録つまりサインアップ)
  • recoverable(パスワードリセット)
  • rememverable(ログイン情報保持)
  • validatable(メールアドレス、パスワードのバリデーションつまり適切検証)

 

ひとまずこれで下準備は完了です!

この後やることは

 

  • サインアップ、サインイン画面の作成
  • サインインしている場合とそうでない場合でのビューの場合分け

 

が主になります!

 

フロント作業が中心ですがまだサーバーもいじります

では続きも参考に!

ボタンで指定位置スクロール 何となくJavaScriptで遊んでみたい人用 JQueryでid指定

どうもかずきです!

 

手動でスクロールをするのが大変なくらい一つのページが非常に長いウェブサイトを見たことがあると思います

 

そのような時って大きな見出しがいくつかあってそこをクリックすると対応する場所まで瞬時にスクロールしてくれる機能を一度は見たことがあると思います

下記の動画を開いてみてください

https://gyazo.com/2d626fabeccbce388b23ced690745b66

 

今回はこの機能をJavaScriptのライブラリのJQueryを使って作ってみましょう

 

 

Js(コピペ用)


$(function(){
  $('a[href^="#"]').click(function(){
    var speed = 500;
    var href= $(this).attr("href");
    var target = $(href == "#" || href == "" ? 'html' : href);
    var position = target.offset().top;
    $("html, body").animate({scrollTop:position}, speed, "swing");
    return false;
  });
});

 まずこの意味を解説

Js(解説用)


$(function(){
  $('a[href^="#"]').click(function(){
// この場合は#で始まるaタグリンククリックした時という意味 var speed = 500;
// この場合は500ミリ秒つまり0.5秒でかけてスクロール var href= $(this).attr("href");
// html要素の定義したa[href^="#"]を取得 var target = $(href == "#" || href == "" ? 'html' : href);
#の時とからの時はhtml,それ以外はhrefとなる つまりidが#空だとそのページ内の遷移でリンクがあるときはリンク先に飛ぶというような意味合い var position = target.offset().top;
// 指定元と指定先の位置を数値で取得 positionに代入 $("html, body").animate({scrollTop:position}, speed, "swing");
// animateメソッドで指定場所のポジション変化とスピードと種類を設定 return false;
// 念の為urlのリンク先に行かないようにしている }); });

 ざっとこんな感じ

次に例として簡単なHTMLを

 

sample.html(コピペ用)


<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="sample.css" type="text/css">
    <script type="text/javascript" src="http://code.jquery.com/jquery-3.1.0.min.js"></script>
    <script>
      $(function(){
        $('a[href^="#"]').click(function() {
          var speed = 500;
          var href= $(this).attr("href");
          var target = $(href == "#" || href == "" ? 'html' : href);
          var position = target.offset().top;
          $('body,html').animate({scrollTop:position}, speed, 'swing');
          return false;
        });
      });
    </script>
    <title>sample</title>
  </head>
  <body>
    <h1 id="top">topです</h1>
    <ul>
      <li><a href="#1">要素A</a></li>
      <li><a href="#2">要素B</a></li>
      <li><a href="#3">要素C</a></li>
      <li><a href="#4">要素D</a></li>
    </ul>
    <div>
      ---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>
    </div>
    <div id="1">
      <h2>要素A</h2>
      <a class="button" href="#top">Top</a>
    </div>
    <div>
      ---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>
    </div>
    <div id="2">
      <h2>要素B</h2>
      <a class="button" href="#top">Top</a>
    </div>
    <div>
      ---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>
    </div>
    <div id="3">
      <h2>要素C</h2>
      <a class="button" href="top">Top</a>
    </div>
    <div>
      ---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>
    </div>
    <div id="4">
      <h2>要素D</h2>
      <a class="button" href="top">Top</a>
    </div>
        <div>
      ---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>
    </div>
  </body>
</html>

画像やその他文字列も可能

sample.html(解説用)


<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="sample.css" type="text/css">
    <script type="text/javascript" src="http://code.jquery.com/jquery-3.1.0.min.js"></script>
    <script>
<!-- JQueryを読み込んでJsを記述します --> $(function(){ $('a[href^="#"]').click(function() { var speed = 500; var href= $(this).attr("href"); var target = $(href == "#" || href == "" ? 'html' : href); var position = target.offset().top; $('body,html').animate({scrollTop:position}, speed, 'swing'); return false; }); }); </script> <title>sample</title> </head>
<!-- ここからHTMLの記述です -->
<body>
<!-- トップにidを対応 -->
<h1 id="top">topです</h1> <ul>
<!-- 見出し要素に#idを付与 -->
<li><a href="#1">要素A</a></li> <li><a href="#2">要素B</a></li> <li><a href="#3">要素C</a></li> <li><a href="#4">要素D</a></li> </ul> <div>
<!-- スクロールの機能を実感してもらうためのカサ増しのための記述です お気になさらず-->
---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br> </div>
<!-- 対応見出し 他も同様 -->
<div id="1"> <h2>要素A</h2>
<!-- トップへ移動するための#id指定-->
<a class="button" href="#top">Top</a> </div> <div> ---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br> </div> <div id="2"> <h2>要素B</h2> <a class="button" href="#top">Top</a> </div> <div> ---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br> </div> <div id="3"> <h2>要素C</h2> <a class="button" href="top">Top</a> </div> <div> ---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br> </div> <div id="4"> <h2>要素D</h2> <a class="button" href="top">Top</a> </div> <div> ---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br>---<br> </div> </body> </html>

 

少々形が崩れていますが内容は問題ないと思うので試してみてください

それでは!

GitHub Pagesでポートフォリオを作るの巻 トラブルシューティング付き

どうもかずきです!

 

エンジニアになりたい人で転職やら案件獲得やら自分のスキルアピールのために作成するポートフォリオGitHubで作る流れを紹介してみようと思います

 

スクールでもがっつり教えてくれない場合もありますし、自分でいろんな記事を参考にしてやったのに上手くいかない人のためにもっとわかりやすく説明できればと思います!

また上手くいかない場合の対処法も紹介します

 

早速行きましょうか

 

 

リポジトリを作成

GitHubのマイページの右上のプラスマークに注目

『New repository』を選択

任意のリポジトリネームを入力

ここにも同じように書く

公開するのでPublicにする

Create Repositoryを押してひとまずリポジトリ作成は完了

ここまでは書いたコードとかアプリをGitHubで管理したことある人ならわかっているとは思いますが一応書きました

ページを作成

以下の通りに実行

何をしているかを下のターミナルの番号に対応させて説明します

 

①まず任意のディレクトリに移動します 説明ではprojectディレクトリにしていますがこちらは好きな場所で構いません

 

②先ほど作ったリポジトリのデータをこのディレクトリにクローンします

ちなみにクローンする際は下の画像の順番のようにSSHをクリックしてコピーボタンを押すとコピーできるのでそれをgit cloneの後ろにペーストします

f:id:chansanblog:20191220210701p:plain

③そしてそのレポジトリのディレクトリに移動します

 

ターミナル



$
cd ~/Projects

$ git clone ここにコピーしたものをペースト

$ cd リポジトリ名

 HTMLファイルを作成

テキストエディタを開いて、command + O を押して、先ほど作成したリポジトリのディレクトリを開きます

 

まだ中身は空なのでここでcommand + N で index.htmlファイルを生成して試しに何か書いてみましょう

 

レイアウトを作っている時間がない方は無料テンプレートサイトからダウンロードしてこのディレクトリに入れてあげると瞬時にレイアウトは作れます

 

自分で一から作る場合は、、、

ターミナル


$ echo "何か試しにテキトーに書く" > index.html

このように生成することも可能です

こうすることでwebページを有効にした時にしっかり反映されているかが確認できます

GitHubへプッシュ

ターミナル


$ git add .
$ touch initial
$ git add initial
$ git commit -m 'コメント'
$ git push origin master

add とcommit をしてからプッシュします

 

ページを有効にする

Settingを選択

f:id:chansanblog:20191220220310j:plain

Noneからmaster branchをクリック

f:id:chansanblog:20191220204221p:plain



黒く塗りつぶしている部分をクリック

f:id:chansanblog:20191220202234p:plain


これで上手くhtmlの記述が反映されていれば完了です!

あとは先ほど開いたテキストエディタで編集するだけです

 

上手く開けず、こんなエラーが出る

f:id:chansanblog:20191220220652j:plain

ざっくりした意味はルートのファイル名をindex.htmlにしなさいとのことです

とは言ってもそんなに簡単に治らない場合もあるので以下の方法を全て試してみてください!

  1. HTMLのファイル名がindex.htmlになっているか確認する
  2. リポジトリのファイルがある場所に一つディレクトリを挟んでみる(例えば、保存してある場所がホームディレクトリであるならホームディレクトリ/間のディレクトリ/リポジトリファイルにしてみる 要するに保存場所を変えるということ)
  3. リポジトリを作り直す
  4. 数分間待ってみる
  5. 重複したファイルやリポジトリのファイル下にディレクトリが挟まっていないか確認する(2番とは逆に、リポジトリファイル/何らかのディレクトリ/index.htmlのようになっていないかという意味です)

GitHub Desktopを開く

f:id:chansanblog:20191221171708p:plain

汚くてすみません笑

Addを押してからClone Repositoryをクリックします

次に下のように

  1. はじめにコピーした時と同じように貼り付ける
  2. リポジトリのディレクトリがあるところをChooseで選択
  3. クローンを押す

f:id:chansanblog:20191221172055p:plain

変更がGitHub Desktopに反映されない

テキストエディタで編集した内容がGitHub Desktop上で反応しない場合は、GitHub Desktopのサイドバーのリポジトリ名を右クリックしてOpen in テキストエディタ(使っているテキストエディタによる)をクリックすると上手くいくかと思います

 

ひとまずここで編集を始められるわけですが最終的にはデプロイしなければいけません

デプロイに関しては別の記事でご紹介しようと思います

 

 

 

 

それでは!

Ruby on Rails トップページでenumを使ったカラムの値をボタンひと押しで変える仕組み

 

どうもかずきです!

 

今回は

Ruby on Rails トップページでenumを使ったカラムの値をひと押しで変える

という方法を紹介していきます!

 以下のURLの動画ような物をサーバー内で作るイメージです

https://i.gyazo.com/8ce083c08b78da97383ba182141bb926.mp4

「フリー写真 パソコン カフェ」の画像検索結果

 

 

enumとは?

enum

プログラム上での状態や種類などの変数を定数定義してくれて、その定義内であれば勝手にデータを割り当ててくれるのでその値を意識しなくても良くなり、重複防止や可読性の向上が期待される機能です

 

うん、これだと理解しにくいです

例え話で考えていきましょう(カフェのメニュー)

 「カフェメニューフリー写真」の画像検索結果

 

とあるカフェでは

  1. コーヒー
  2. エスプレッソ
  3. ミルクティー

の名前のついた3つのメニューしか取り扱っていないとします(かなり極端ですみません)

そこでお客さんにハイボールください』と言われるとします

しかし先ほどの前置き通り、このカフェでは

1番の”コーヒー”

2番の”エスプレッソ”

3番の”ミルクティー

しか取り扱っていないので当然店員さんは

『申し訳ございません 当店では”ハイボール”というものはお取り扱いしておりません』

という”例外に対する対応”をします

 

このようにサーバー(店内)で定義したもの以外ではこのようなエラー(例外に対する対応)を吐きます

 

逆に、お店で新メニューに"ハイボール"を追加した場合は

  1. コーヒー
  2. エスプレッソ
  3. ミルクティー
  4. ハイボール

と定義順にメニュー内に割り振ってくれるので、

次にお客さんが”ハイボール”を注文し他時は

店員さんは『畏まりました ”ハイボール”ですね ○○円になります』

と行った具合に対応(正常なレスポンス)をしてくれるようになります(居酒屋じゃないんだから、この店のコンセプトブレブレじゃん)

 

Ruby on Railsenum

Railsで使う場合は、データベースのレコードのカラムの情報をモデルに定義するものです

先ほどのカフェのメニューを例にすると

app/model/cafe.rb


enum menu: {
  コーヒー: 1
  エスプレッソ: 2
  ミルクティー: 3 
} 

みたいな感じですね

 

二種類の書き方を紹介するとこんな感じ

app/model/hoge.rb


# 何か特定の値で割り振る場合
enum カラム名: { カラムの中身
a: 固定値1 カラムの中身b: 固定値2 カラムの中身c: 固定値3 }

# 自動的に割り振る場合
enum カラム名: { カラムの中身a,カラムの中身b, カラムの中身c }

 

先ほどのカフェの例だと前者になります

 

本題

冒頭の動画URLで同じものを貼っていますが、今回はトップページにずらっと並んでいるタスク一覧のSTARTボタンを押すとDOING表示になって、これをもう一度押すとSTARTボタンに戻ってくれる動きを作ります

今回はAJAXなどは使わずにボタンを押すとデータ内のカラムの値と表示が変わってくれる仕組みという認識で大丈夫です

 

 

まずはこのボタンをリンクにして、そのリンクを押すと見た目とデータの中身が変わるようにしたいので、パスを作ります

 

ルーティング

config/routes.rb


Rails.application.routes.draw do
  # For details on the DSL available within this file, see http://guides.rubyonrails.org/routing.html
  root 'tasks#index'

  resources :tasks do
    patch :change_status  # こいつを追加
  end
end

 

 一応基本的なルートはすでに作っているのでネストして追加してみます

ちなみにこの場合は部分的更新なのでHTTPメソッドはPATCHにします

 

データベースのカラムの状態確認もしくは修正

db/schema.rb


# 省略    
t.integer "status", default: 0, null: false
# 省略

 

 データはtasksテーブルを作っていてその中のカラムの一つにstatusカラムを作っています ここをいじくります

この意味は型をintegerつまり整数列で管理していて、通常状態を0、このカラムの中身が何もない状態はダメですよと行った感じです

テーブル生成時にこのような制約などを設定するのですが、後から変えることも簡単にできます この記事が参考になるかも?

 モデル

続いてここでenumを使います

app/model/task.rb


class Task < ApplicationRecord
# 省略
enum status: { START: 0, DOING: 1, COMPLETED: 2 } def change_status! if START? DOING! else START! end end end

アソシエーションとかバリデーションについての記述も開発においては大事ですが今回の内容的に関連性があまりなさそうなので省略しました

 

タスクの進捗状況ということで、何も手をつけていないデフォルトの状態がSTART(0)ということになり、DOING(1),COMPLETED(2)と定義できました

 

今回タスク状態を切り替えたいのはSTARTとDOINGなのでchange_status!メソッドを定義して切り替え可能にします

ちなみに『!(感嘆符)』をメソッドにつけることで例外処理を行えるようになります

 コントローラ

app/controller/tasks_controller.rb


class TasksController < ApplicationController

  before_action :task_set, only: [:show, :edit, :update, :destroy, :change_status]
# 省略
def change_status @task.change_status! redirect_to root_path, notice: 'successfully updated.' end # 省略
private def task_set @task = Task.find(params[:task_id]) end def task_params params.require(:task).permit(:name, :text, :limit_date, :status, :level, :priority, :genre_id) end end

 トップページなのでroot_pathにリダイレクトさせるように書いています

細かいところは省いていますがこんな感じです

 

privateメソッドで定義したtask_setですが、特定のidのtaskを持って来る際にparams[:id]だとnilになってしまうのでtask_idにしています

 

ビュー

app/view/tasks/index.html.haml

 マークダウンだとズレが生じるので写真で失礼します

 表示する状態を変数としたいのでtask.status

はじめに作ったパスをリンクにしています

メソッドはpatch

 

if文で分けている理由はSTARTの時とDOINGの時でclass名を変えて、cssで見た目を変えるためです

これに関してはお好みの問題になって来るので割愛します

 

ひとまずこのような流れで作成することができました!

 

それでは

 

GitHubのコミットエラー で『お前誰やねん』と怒られた時の対処法 Commit failed – exit code 128 received, with output: ‘*** Please tell me who you are.

どうもかずきです!

 「フリー写真 GitHub」の画像検索結果

GitHubのコミットエラー で『お前誰やねん』と怒られた時の対処法

 

 

個人開発などしているとGitHubで管理することが多いと思うのですが、普段通りGitHubDesktop上でコミットしようとした時

 

 

GitHubDesktopさん


Commit failed – exit code 128 received, with output: ‘*** Please tell me who you are.

Run

git config –global user.email “you@example.com”
git config –global user.name “Your Name”

to set your account’s default identity.
Omit –global to set the identity only in this repository.


 
fatal: unable to auto-detect email address (got ‘xxx@xxxxxxx.(none)’)’

 と怒られたって経験あるかも知れません

 

 

要するにこれは『お前誰やねん』と言われています

 

つまりそれを解決してあげれば良いわけですが、、、

gitで自分の情報を登録できていないときに起こるエラーということ

 

 

"git config –global user.email “you@example.com” git config –global user.name “Your Name”"

 

に書いてある通り、メールアドレスとユーザーネームを設定してあげましょう!

 

以下のように記述して下さい

 

ターミナル


$  git config user.email メールアドレスをここに記述
$  git config user.name ユーザーネームをここに記述

 

この後再度コミットを実行すると上手く行くかと思います

 

 

それでは!

Ruby on Rails 初心者向け 簡単 カラムのデフォルト値後から設定 エラーが出たら型を見てみる

どうもかずきです!

 

 今回はRuby on Rails カラムのデフォルト値設定について、軽く書いていこうと思います

 

 

簡単なタスクアプリがあるとして、ローカル環境でSequel Proを使ってデータベースの管理をしている場合で説明いたします(tasksテーブル)

タスクの状態を分けるときにカラム名を"status"にして、作業前をSTART(あとでSTARTボタンを作るため),作業中をDOING,完了済みをCOMPLETED(こちらはボタンを押すとCOMPLETED TASKというリストに移動するようにあとでします ついでに削除ボタンも作る予定)になるような仕様です

 

※この時点では、Sequel Proに手書きして、タスクの情報がビューに反映されるところまでしかできていません

 

ターミナル


$ rails g migration change_status_of_tasks
Running via Spring preloader in process 0000
      invoke  active_record
      create    db/migrate/20XXXXXXXXXX_change_status_of_task.rb

 上記のように$ rails g migration change_カラム名_of_テーブル名といった書き方でデフォルト変更のためのマイグレーションファイルを生成

 

 

生成されたマイグレーションファイルに以下のように記述 

 

db/migrate/_change_status_of_task.rb


class ChangeSrtatusOfToTask < ActiveRecord::Migration[5.0]
# ↓はtasksテーブルのtext型statusカラムのデフォルトを'START'に変更したいという記述 def up change_column :tasks, :status, :text, default: 'START' end
# ↓は元々の状態
def down change_column :tasks, :status, :text end end

 

 じゃあこれで

ターミナル


$ rails db:migrate

 

完了か?

 

実はこれだとエラーになります

 

こういったデフォルト設定や変更でエラーが出たら、カラムの型を確認してみて下さい

 

今回の場合はtasksテーブルのstatusカラムを作ったときに型をtextにしていたのですが、text型だとデフォルト設定ができないので、型をintegerやstringに変更しましょう

 

 

 

rails db migrate した後にエラーを出したマイグレーションファイルは以下のようにdownになっているのでつまりは実行できなかったファイルということ

ターミナル


$ bundle exec rails db:migrate:status

database: 作成中のアプリ名_development

 Status   Migration ID    Migration Name
--------------------------------------------------
   up     XXXXXXXXXXXX  Create tasks
   up     XXXXXXXXXXXX  Rename limit column to tasks
   up     XXXXXXXXXXXX  Add column to tasks
   up     XXXXXXXXXXXX  Create genres
   up     XXXXXXXXXXXX  Add userid to tasks
   up     XXXXXXXXXXXX  Remove userid to tasks
   up     XXXXXXXXXXXX  Add genreid to tasks
  down    XXXXXXXXXXXX  Change data status to task


 downのファイルは未実行なので普通に削除をするだけで大丈夫です

間違って実行できてしまったファイルの場合は $ rails db: rollback すれば実行前に戻ってくれます

 

カラムの型を変更したいときは

 

ターミナル


$ rails g migration change_data_status_to_tasks
Running via Spring preloader in process 00000
      invoke  active_record
      create  db/migrate/20XXXXXXXXXX_change_data_status_to_tasks.rb

 

 マイグレーションファイルを生成した後

db/migrate/_change_data_status_to_tasks.rb


class ChangeDataStatusToTask < ActiveRecord::Migration[5.0]
  def change
    change_column :tasks, :status, :string
  end
end

 このように型をstringに変更

 

これでカラムのデフォルト値を後から設定して マイグレートすれば作業は完了です

 

 

それでは! 

先生や親や上司に見て欲しい 『それ、相手からの信頼なくなるだけですよ?』 という言動と行動10選!!

 

 

どうもかずきです!

 

今回は

先生や親や上司に見て欲しい 『それ、相手からの信頼なくなるだけですよ?』 という言動と行動10選!!

 というテーマでご紹介します

「フリー写真 男性 怒る」の画像検索結果

 

前置き

学生なら部活、バイト、親

社会人なら仕事場 などで、先輩や上司に言われて(やられて)やる気をなくすような言動や行動ってありますよね?

 

同じ目線同士の関係でも当てはまりそうですから人間関係全般に言えることではありますが兎に角

それ言ったら(やったら)アカンやつ

という言動や行動を自論やヒアリングなんかして集めてみました

 

そりゃそうだろ!というようなものだとつまらないので、当たり前なものから無意識にやってしまってることまで集めてみました

 

信頼なんていらないと思ってる方は見ないでください

あとは当記事を書いている私は22歳のクソガキですが、それに対して『甘えるな』とか『世間知らずだからそういうことが言えるんだ』とか『上の立場に立ってから言え』とか抜かしてくる元気な老害さん!

あなたですよ!そういう所!

 

だってそもそも『そういうことを言われる側になりやすい若者目線』だから信憑性があるって言うね

そんな人達に信頼されなければ立場もプライドもクソもないわけですから

 

それではいってみましょう!

 

 

 

①相手が知らなそうなことを知っていて当然のような言動や振る舞い

 「フリー写真 偉そう 男性」の画像検索結果

 

『知ってると思うけど』『え、知らないの?笑』

のようなやつですね

 

たしかに同じコミュニティにいたり仕事をする上で知っておかなければヤバいものはあるとは思いますが、これを頻繁にやると相手からは『何を知っていれば大丈夫で何を知らなかったらやばいのか』が分からなくなります

 

人それぞれ知ってることと知らないことのギャップはあります

これを考慮できない人はそもそも意味のわからない価値観に縛られて時代に取り残されるでしょう

 

この先に何が起こるかというと、相手は質問することや知らないことを恐れてしまい、悪循環になってしまいます

 

つまりはそういうことを言ってしまった人とのコミュニケーションが怖くなるということなので信頼も失うし本音も拾えなくなります

仕事でも教育でも対人関係でも最悪ですね

 

 

 

②細かい説明を省いたり難しい言葉を使う

 「フリー写真 男性 命令」の画像検索結果

 

説明を事細かに長くしろということではありません

ただ、自分の頭の良さと知識をひけらかしたいのか、横文字を大量に使ったり大事な部分の説明をあえて省いたりする人は相手に伝わりにくくなり

嫌な奴だと思われます

 

先程の相手が知らなそうなことを知っていて当然のような言動や振る舞いと似ている部分がありますね

特に人に教える立場の人がこれをやったら最悪です

教えられる人も頑張ろうとするかも知れませんが、メンタルが折れやすくなるでしょう

 

 

③人の可能性を否定する

 「フリー写真 男性 否定」の画像検索結果

『そんなこと出来るわけない』『夢見るな』『世の中甘くないぞ』

こういう事言う人達です

 

そもそも先人たちは常識を破って世の中を豊かにして そして成り上がってきたわけです

こういうおバカな人達には

 

『じゃあ聞きますけどあなたは何かを頑張ったんですか?何か成し遂げましたか?』

て言ってやりましょう

多少無謀そうな目標や夢もあるかも知れません

でもそれを全否定する人の中で幸せな人、豊かな人は一人もいないでしょうね

少なくとも私が今まで会ってきた、見てきたすごい人(抽象的ですみません 表現を簡単にしてます)は誰もそんなこと言いませんでした

 

こうやって決めつけてる人が世の中の厳しさを語ったり何かを判断する器なんて絶対にありません

 

どうか、その人の本気度を試して応援してあげてください

 

 

④若い人を見下す

 「フリー写真 男性 見下す」の画像検索結果

ここでピックアップするまでもないだろと思われがちですが 意外とわかってない人多いと思います

 

典型例が『ゆとり』を乱用する人ですね

ゆとり世代という言葉でネガティブ発言する人は化石なんでしょうか?

 

特にヤンキー上がりのアラサーや中年、高齢者に多い印象です(あ、これも偏見か)

 

もう歳でマウント取るのやめませんか?

私の好きな言葉で

『馬鹿も死ななければ歳をとる』

というのがあります

 

要するに歳とったから偉いなんてありません

期待値として人生経験が多いんだろなって思うくらいです

特にこれからの時代こんなことを言ってる人がいたら 『時代遅れの頭の悪い人間ですって自己紹介してるんだな 可哀想』と思えば良いです

 

 

⑤キレる

 「フリー写真 男性 切れる」の画像検索結果

まあこれは誰から見ても不快な訳ですが、人にキレるってことは嫉妬心の塊  つまり自分の現状に不満があってストレスのはけ口を探してる理性の無くなった人間の皮を被ったお猿さんってとこでしょうか?

 

相手を踏みつぶして優越感に浸りたい可哀想な人達なのです

 

明らかに自分が悪いことをしたのであれば例外となるかと思いますが、ちょっとしたミスとか手違いとか理由がわからないレベルとか そういう時にキレてくる人は総じてヤバいです

 

あ、モンスターが怒り状態になったって思っておけば良いです

何も解決しません

こういう人からは離れないと自分も不幸になります

あとで急に優しくなる人もいますが、それはサイコパスです

 

 

⑥根拠なしに 国 時代  文化  人種  コミュニティ 学歴 に対する偏見持ちがちな言動

 「フリー写真 男性 偏見」の画像検索結果

 

良いイメージなら良いですが、これ言っちゃってる人多すぎる気がします

 

『こういう所にいる人はこういう人だ』みたいな決めつけを根拠なしにしてしまうと本質なんて見えてこないし 何かを知ろうとすることを遮断してしまうことになりかねないです

 

なぜ信頼がなくなるかというと、その偏見を持ったものに該当する相手がいた場合ヤバいからです

これはもう上下関係とかの話ではないですが、誰かの上に立つ人間がこれをやってしまうと大変なことになるでしょうね

信頼を築いていた相手だとしても一気に崩れるでしょう

 

 

⑦他人を下げて自分を上げる

 「フリー写真 男性 悪口」の画像検索結果

これマジで最悪です

 

こちらも当たり前だと思われそうですが、やってる人めちゃくちゃ多いです

 

些細なことでもダメです

他人を下げて良いことなんてひとつもありません

自分が上がることはありません

他人を下げる人って例えるならば 決闘で相手が素手なのに戦車に乗ってくるくらいダサい行為です

 

 

⑧優しすぎる

 「フリー写真 男性 優しすぎる」の画像検索結果

 

giveの誠心は信頼を作る上で大事ではありますが、度が過ぎる優しさを見せてしまうと

自分自身を安売りすることに繋がります

 

自分のスキルを仕事にしている人がいるとして、その人は能力があるのにも関わらず安請け合いをしすぎるとします

すると、仕事は沢山貰えるかもしれませんが自分自身が疲れてしまいますし、同じような業種の市場価値が下がって他人にも迷惑をかける可能性もあるからです

利用されるだけされて捨てられるオチはあまりにもキツイので、キチンとした対価を貰うべきです

 

商売だけでなく 友情や恋愛でも同じことが言えると思います

優しすぎるは危険なのです

 

⑨ノリの悪い人を悪く言う

「フリー写真 男性 悪口」の画像検索結果 

 

例えば コミュニティや仕事場の飲み会や打ち上げにいつも参加しない人や  あまり人と関わっていない人に対して人間性を悪く言うなどです

 

本当にこれは気をつけてください

何故かというと、人に言えないような目に見えない病気や障がい、複雑な家族関係や境遇がある可能性があるからです

また人には得意不得意があるので、ひとりが好きだったりとか大勢と居るのが苦手な場合もあります

 

よくチャリティーなんちゃらとか障がい者頑張ってる特集みたいなので涙を流したり同情をしているそこのあなた

そんなことで涙を流すならこれらの事を無意識にでもやっていない自信ありますか?

 

⑩法則性のないことに対してすぐ結びつけようとする

 「フリー写真 男性 すぐ信じる」の画像検索結果

 

特にこれは上に立つ立場の人がやったら最悪だと思うのですが、あまりにも当てはまる人が多すぎて鬱になるレベルです

 

どういうことかというと、2度や3度の偶然とも言える小さすぎる共通点で直ぐにこじつけてしまう人のことです

 

例えば、本当かどうかわからない占いとか心霊写真を『わー!ほんとだ!』とかすぐ言っちゃう人です

他には、ニュースとかの情報を全く疑わない人などもこの類です

信頼を失うというよりかは、本質とか常識を疑わないということなので詐欺にあったり、良いように利用されたりする可能性が高まります

 

 

いかがだったでしょうか?

今回は強めな表現になりましたが、切実にこういう言動や行動はなくなって欲しいです

 

もちろん他にも沢山ありますが今回はこの辺で!

 もちろん私自身も気をつけようという戒めのために書いているところもあります

 

それでは!