✂︎美容師からエンジニアまでの奮闘記💻

これからエンジニア目指す人達の第一歩になれるように🌟

deviseで追加カラムを設定した話

こんにちは!今日は久々のアウトプットタイムです!

テックキャンプでは残り19日となりました!

個人アプリ開発コツコツ進めています☺️

 

それでは今回はdeviseを使ったユーザー管理の実装中にハマったエラーをお話したいと思います。

 

ログイン機能を実装したく無事deviseのインストールをし、バリデーションの設定をしました。

app/models/user.rb

validates :nickname, presence: true

 

追加でnicknameカラムを追加していたので、そちらのバリデーションも設定。

 

そして投稿フォームを入力して送信すると「nicknameが空なので登録できません」

と言うエラーメッセージが表示。

ここで言うエラー文とはrailsのエラーでは無く、個人で設定したエラーテンプレートの事です。

 

nickname欄を埋めても空という表示なので、上手く表示がされていないことに気がつきました。

そこで思い出しました。 追加カラムのストロングパラメータ設定していなかった、

app/controllers/application_controller

private
def configure_permitted_parameters
devise_parameter_sanitizer.permit(:sign_up, keys: [:nickname])
end

こちらで新規登録の際にnicknameカラムの保存を許可します

 

before_action :configure_permitted_parameters, if: :devise_controller?

そしてこちらでdeviseのコントローラーが動いた際にアクションが動くように

設定してあげるとOK!!

 

これで無事ユーザー登録が完了できました!

 

deviseは本当に優秀なので全てを任せてしまいますが、中での処理を理解することは

やっぱり大切だなと実感しました泣

 

これからも目標に向かい積み上げていきます!

 

 

 

テックキャンプ1ヶ月半が経過したので現状報告

おはようございます!

今日はテックキャンプ受講から1ヶ月半が経過したのでこれまでに

学んだ事やメリット、デメリットに関してざっくり話していきます☺️

 

結論から言うと僕は受講をして良かったと思っています!!

 

ではテックキャンプで学んだことをざっくり

・HTML、CSSで基本的なWebサイトを作る

rubyを使ってミニアプリを複数作成

railsを使い、チャットアプリやSNSの作成

・git-hubを使ってアプリ開発

JavaScriptの基礎構文

・サービスをデプロイ

・学んだ事を生かしフリマアプリの作成(最終課題)

 

細かくするとまだまだありますが、ざっくりこんな感じです!

テックキャンプの受講者のほとんどは未経験の人です。

中には経験者もいますが、少数派です

 

1日の学習時間は平均で10時間程かと思いますが土日は基本的には自由なので一週間もすれば慣れる印象でした。

プログラミンが全くの未経験で始めましたが流石に毎日10時間以上やっていれば簡単なアプリ開発ぐらいは問題無くできるようになると思います!

 

さて、現在私の進行状況としては、最終課題のフリマアプリを終えオリジナルアプリの開発に取り組んでいます!

進捗としては、平均よりやや進んでいる程度です。

ただこのフェーズに入るとメンター質問は一切できなくなるので完全に個人開発になります。

ちょっとしんどい時もありますが、どんな難解なエラーが出てもなんんとか進んで来れているので自走力は身についてきているように感じます!

 

テックキャンプで学習を始めてから学習面だけでなく生活面でも自己管理能力が身についたと思っています。

誰でもできると言ってもやはり未経験の人は毎日使い慣れないPCや言葉に触れるので全力でやらないと進捗がどんどん遅れていきます。

しかし、そのプレッシャーのおかげで大きく変わった事があります。

1日の目標が達成できなかった日は何故できなかったのか?そのために明日から行う

具体的なアクションプランは?と自然に考える思考法が身についたのでこのマインドはテックキャンプを学んで一番良かったと思える事ですね。

 

あとはチームメンバーと情報共有やお互いに教えあったりできることも入って良かったと感じる点でした。

これから切磋琢磨できる仲間は本当に大切です。

 

ざっくり1ヶ月半で学んだ事でした!

残り三週間なんとか自分のアプリを形にしていきたいので、毎日全力で!

 

購入後にSOLD OUTを表示させた話

こんにちは!

テックキャンプ40日目残り33日

少しブログの投稿をサボってしまいましたので今日から復活します☺️

 

もう9月に入りテックキャンプの終了が見えてきました💦

8月からの学習時間も300時間を超えてきましたが、まだまだ自走力は低いので引続き

精進して参ります!

 

さて本題に入りますと、現在最終課題では某フリマアプリのクローンアプリを作成しています!

そこで購入完了後は商品画像にSOLD OUTの文字が追加される実装をしたのでアウトプットをしていきます。

 

結論からお話しすると結構簡単に実装する事ができました☺️

では実装に入っていきます!

まずHTMLにマークアップをしていきます!

div class='sold-out'>
<span>Sold Out!!</span>
</div>

次にcssにスタイルを当てていきます!

.sold-out {
position: absolute;
top: 40%;
width: 100%;
text-align: center;
background-color: crimson;
transform: skewY(-10deg);
}

.sold-out>span {
color: #FFF;
font-size: 45px;
font: bold;
}

この辺の詳しい説明は割愛させていただきます。

 

あとはHTML側に『購入されてる場合は表示する』と分岐を付けます

<% if item.purchase.present?%>
<div class='sold-out'>
<span>Sold Out!!</span>
</div>
<% end %>

<% if item.purchase.present?%>について説明していきます!

item.purchaseで商品に紐ずく購入履歴という意味です。

present?はオブジェクトの中身が存在すればtrue、無ければfalseを返します

これを組み合わせる事で、購入されていればSOLD OUTを表示する事ができました😊

 

present?はこれからよく使いそうなのでしっかり身に付けるようにしていきます!

こんな感じで今日は終わろうと思います!

 

今日は朝投稿なので今から10時間テックキャンプ頑張って参ります

 

 

 

エラーハンドリングが表示されないと思ったら?の話

こんにちはせーです!

テックキャンプ36日目!

 

最終課題も折り返し地点に入りました!

今日は最近実装した商品投稿ページからエラーハンドリングが出なかったお話です☺️

 

モデルにフォームの値が空だったら登録できない!のようなバリデーションを組みました!

そして商品投稿機能を実装するためにルーティング、コントローラーの準備をし、

エラーハンドリングの確認をしたところ、投稿はうまくいくのですが、画面遷移がされなかったので、redirect_toを使いトップに遷移するように実装しました!

 

そこで、僕は実装が完了したかのように思っていましたが、

あれ?エラーハンドリングが出なくね?

と思い、バリデーションの記述やビューのrenderが上手くいってないのかと思いましたが、特に問題がありませんでした😭

 

色々考え、

出た結論が、createアクションの成功時と失敗時の記述がなかったのが原因でした💦

いやーほんとにイージーなミスでした泣

それと付随して、form_withで渡したインスタンスをコントローラーにも使うのも忘れやすいので気をつけたいです!

 

そんな感じで今回は終了!

これからは面接、履歴書の対策などもあり、かなり忙しくなりそうですがエンジニア転職に向けて、より一層積み上げていきたいです!

 

バリデーションのお話

こんばんは!せーです!

テックキャンプ29日目残り42日です☺️

 

今日はバリデーションについて学んだことをアウトプットしていきたいと思います!

 

まずバリデーションとはデータの登録の際に一定の制約をつけられます!

データが空の状態だと保存されなかったり、文字制限をかけたりできます!

そこで僕はテーブル設計の時にNOT NULL制約と似てない?

 

そう思い調べてみると、バリデーションをはフォームから保存する際にかける制約で

NOT NULL制約は実際にデータ保存をする際に使うそうです!

二段階で制約をかければ保守性も高くなりますしね😄

 

よく使われる3つを紹介!

 

validates :nickname, presence: true

→値が空の場合は保存しないようにする設定

 

validates :password, length: { minimum: 6 }

→文字制限をかける制約です。6文字以下だと保存されません

 

validates :fam_name, format: { with: , message: "" }

指定されたフォーマットでない場合保存されません!

messageオプションはエラー文を任意の文にできます!

 

こちらはよく使うものだと思うのでアウトプットしていきたいと思います!

バリデーションには他にも様々な制約をかけられるので使いこなせれば強い!

でも正規表現はかなり奥深いものなので少しずつ理解を深めようと思っています!

 

そんな感じでアウトプット終了です!

最終課題に入り、かなり大変ですが、ここが正念場!

 

皆さんも一緒に成長していきましょう!

 

 

 

 

初めてのDB設計の話

こんにちは!せーです!

テックキャンプ25日目 卒業まで47日!

 

最近ついに最終課題に入りました😄

張り切ってまずはDB設計をちゃちゃっと終わらせよう!

と意気込んでいましたが、速攻で撃沈しました笑

 

今までのアプリはtweets、users、commentsなどしっかり設計をしなくても問題ないレベルでしたが今回から開発をするフリマアプリはそうはいきませんでした💦

 

テーブルの数、保存するデータの種類、テーブル間の関係性などとても複雑で

作り出したは良いけど結局混乱して最初からやり直しなんてことを繰り返ししていました!

 

なので今回は実際にデータベースを作った時の流れをアウトプットしていきます!

 

まず最初に作りたいアプリの機能を洗い出します!

これは、思いつくまでしっから絞り出して下さい!

 

次にエンティティを抽出して下さい!この時に慣れていない人はまず日本語で

書き出します!

次にその日本語を英語に変えて適当なカラム名にしてあげましょう!

この時まだ外部キーは追加してないです。

カラムには命名規則があります!作る際はその規則にしたがって作りましょう!

 

次に抽出した要素のリレーションを定義しましょう!

その際に外部キーを追加していきます!

 

そこまで行ったら手書きの情報をER図作成ツールなどを使い作図してみましょう!

 

作図ができたら、READMEにテーブルとカラム、データ型、アソシエーションを

記述していきます!

今後データベースに変更があったらその都度READMEの中身も書き換えて下さい!

 

ここまでが大まかなDB設計です☺️

大きなアプリになればなるほど必要な情報は増えるので、より分かりやすく、

データの保守性の高いDB設計が必要になるんですね💦

 

僕ももっとDBについて知識をつけていきます😊

 

今回はここまで!

近々スクールの良い点、悪い点なども発信できたらと思います!

Dateクラスを学んだ話

こんばんは!せーです!

テックキャンプ23日目で残り48日です☺️

 

少し時間が空きましたが毎日しっかり積み重ねています!

 

早速ですが、今日はDateクラスについて学んだのでアウトプットしていきますね☺️

 

Dateクラスは時間、日付けを表示したりできる便利機能!

 

puts Date.today →2020-08-25

と今日の日付を出力できます。

下記の例ではそれぞれ単体の情報が取得できます。

 

Date.today.month

Date.today.year

Date.today.day

 

さらにDate.today.wdayで曜日に対応した添字が取得できます!

どう言うことかと言うと

0~6 = 日〜土で添字に対応しています!

0=日曜日

1=月曜日

.

.

6=土曜日

これを前提にしてもう一度さっきの記述を見てみましょう!

Date.today.wdayと記述すると今日が火曜日の場合戻り値は2となります😄

しかしこれだけだと何曜日かパッと見理解できないですし、アプリの機能としては使えません😭

 

date = Date.today.wday

wday =["日曜日", "月曜日",  "火曜日", "水曜日", "木曜日", "金曜日", "土曜日"]

puts date [wday]

 

このようにすると添字と紐ずく曜日が出力することができます😄

 

そんな感じで今回の記事はここまで!

明日から最終課題に入りより一層引き締めて頑張っていきたいと思います!

 

エンジニア目指している駆け出しのみなさん!一緒に前進していきましょう!!