Web Marina

日々の業務や勉強などで得た知識をアウトプットしていきます。

プログラミング

【CSS】liner-gradient 〜CSSで線形グラデーション〜

こんにちは、マリンです。 今回はCSSで線形グラデーションを実装する方法です。 今までなんか難しそうだったから コピペでなんとなく使っていたのですが、 仕組みをちゃんと理解しようと思って勉強しましたので、 ここでまとめます。 liner-gradientとは lin…

【Git】git reset --hard HEADを取り消したい!!

こんにちは、マリンです。 今日Gitでやらかしました。 表題の通りなのですが、それにプラスしてDBのロールバックとかも関わってきて、 「ギャーーーー!!!」 ってなったので残しておきます。 概要 対処法 そもそも何が起こったのか? コミット取り消しの取…

【Bootstrap/Rails】popoverのdata-contentの中身をHelperに切り出してみた。

こんにちは、マリンです。 今回はBootstrapのpopoverです。 popoverはtitleに表示するタイトル。data-contentに表示する内容を書きます。 でも長い内容をタグ内に書きたくないでしょ! ってなわけでRailsのHelperにメソッド切って表示内容を切り出してみまし…

【Rails5】Rails5で自作のWebアイコンを使う

こんにちは、まりんです。 うちの会社ではFontAwsomeがマストなんですが、 結構クライアントからこんなアイコン使って欲しい!といわれ、 そんなのねーよ!!という事が多々あるようです。 そしてこの前唐突に、上司から アイコン作るスキル身につけて欲しい…

【jQuery (CoffeeScript)】属性の値に変数や式を使う 〜式展開の色々〜

こんにちは、マリンです。 今回はjQueryでの式展開についてです。 よくdata属性で要素を絞り込む際の値に 事前に定義した変数を使いたい時があるのですが、 そんな時にいつも職場で使われている記述が理解できず、 色々ググってみたのに見つからない。。。 …

【Ruby】RubyでURLにクエリ情報を追加する

こんにちは、マリンです。 現在上司からjQueryの本を貸していただき、 その中から出された課題を解いています。 PHPを使ってYoutube Data APIにアクセスし動画情報を取得。 それをjQueryからAjaxを使って表示するという内容で、 PHPの部分をRubyに置き換えて…

【jQuery】要素をコピーする

こんにちは、マリンです。 今回は要素をコピーする方法をご紹介しようと思います。 概要 ソースコード 解説 HTML CoffeeScript 補足 まとめ 概要 ユーザー一覧を表示しているテーブルの行にコピーボタンを表示。 そのボタンを押すとその行のコピーを直下に挿…

【jQuery】クリックでテーブルの行をハイライトさせる。

皆さん明けまして(だいぶ経ちますが)おめでとうございます。 本年もまったり更新していこうと思いますので、どうぞよろしくお願い致します。 さて、2019年最初の一発目は、 jQuryです! 最近「勉強してください・・・」と上司にガッカリされましたorz 今回…

【Git】コマンド: いい加減覚えが悪いのでまとめとく。

こんにちは、マリンです。 7月から今の職場でお世話になり始め、はや5ヶ月経ちます。 ・・・が、いつも使ってるGitコマンドを全然覚えなくていい加減上司にブチ切れられそうなので、 理解も兼ねてまとめておきます・・・orz git fetch originとmaster git ch…

【Rails】$rake db:rollbackしたい時の間違えない手順

こんにちは、マリンです。 未だ初心者の域を脱しない私は、よくmigration周りでやらかします。 一人でやっていた頃は失敗すると 「ロールバックしちゃえ〜」「migrationファイル消しちゃえ〜」 とかやっていましたが、 チームでやっているとそんな横暴は許さ…

【Rails】select_tagを使って表示内容を変える

こんにちは、マリンです。 今回はselect_tagを使ってページの表示内容を変える方法を書こうと思います。 概要 View セレクト部分 生徒表示一覧部分 Controllers JavaScripts まとめ 概要 select_tagで項目を選択し、項目に合わせてページの内容を変える この…

【CSS】セレクタの指定方法まとめ

こんにちは、マリンです。 プラグインのCSSのコードを読んでて、 今更ながらセレクタの指定方法の認識が曖昧だったことに気づいたので、 忘れないうちにまとめておくことにしました。 こちらを参考にさせていただきました。 子供セレクタ - CSSの基本書式 - …

【Rails】paramsがなんなのかやっとわかった!

こんにちは、マリンです。 Railsでformとか使っていれば当然paramsって出てきますよね。 恥ずかしながら、このparamsの認識が違っていたために職場でかなり苦労しました。 やっと見えてきたのでまとめようと思います。 *内容に間違いや補足などございました…

【Rails】なんか変なとこのヘルパー読み込んでるんだけど??〜config.action_controller.include_all_helpers〜

こんにちは、マリンです。 昨日こんなことがありました。 「staffのネームスペースでuserのhelper読み込んでるんです・・・」 その時に教えていただいた対処法をご紹介します。 概要 原因 対処方法 概要 app/helpers/user/pages_helper.rbにhogeと言うメソッ…

【rails】ページごとにCSSを当てたい。

こんにちは、マリンです。 知人に頼まれてHTML、CSS、JSのみの完全静的Webサイトを作ったのですが、 このたび機能追加に伴いRails化することにしました。 それまでのコードはペペッと貼り付けてちょこちょこっと修正すればいっかなぁ〜 なんて軽く考えており…

RSpecを学んでいて気付いた自分の弱点。

こんにちは、マリンです。 この度アルバイト先が決まりまして、その会社で「RSpec使ってるから勉強しといて」と言われて今学んでおります。 今回の記事はただのぼやきです。すみません。 今回のテーマ 私の弱点 で、どうすんの? 今回のテーマ タイトルの通…

binって何?railsとrakeって何??(後編)

こんにちは、マリンです。 前回はよく見かけるbinとは何か? そして、bin/railsファイルの中で行われていることが何か?を書きました。(今思えばちょっと趣旨がずれたかも・・・) 今回は、bin/rakeは何か?そしてrailsとrakeの違いなどを書けたらなと思い…

binって何?railsとrakeって何?(前編)

こんにちは、マリンです。 アプリ開発していてわからないことがあると私はまずグーグル先生に聞きます。 多分大体の方がそうだと思いますが・・・ すると頻繁にこんな一文を見かけますよね。 $bin/rails ~ このbinって何だろうな?ってずっと気になっていた…

Rails プラグインを学んでみる。(後編)

こんにちは、マリンです。 前回はRailsガイドの「プラグイン作成入門」の3まで書きました。今回は続きの4から書きます。 前回の記事はこちら。 song-of-life.hatenablog.com 4.“acts_as"メソッドをActive Recordに追加する。 クラスメソッドを追加する イン…

Rails プラグインを学んでみる。(前編)

こんにちは、マリンです。 ポートフォリオサイトのスマホ化がひと段落しましたので、今度はブログ機能をつけようと思います。 せっかくなので、以前ちょこっと触れたプラグインをやってみようと思い、現在RailsガイドさんのRails プラグイン作成入門を勉強し…

S3用のIAMを作る

サイトの画像利用のためにAWSのS3を使っています。 そのままマスターのアカウントを使い続けるのはあまり良くないので、 S3用にIAMを使ってユーザーを追加しようと思います。 前提 手順 追加ユーザーの設定 S3用のポリシーの作成 引き続きユーザーの設定 ま…

Amazon S3の新しいバケットを作る。

こんにちは、マリンです。 サイトでの画像登録用にAWSのS3を使ったので、 その時の手順をメモっときます。 song-of-life.hatenablog.com 前提 手順 まとめ 前提 AWSのアカウントは取得済み 途中の細かい設定はまだよくわからなので飛ばしてます。 手順 (1)サ…

画像が表示されないからfogとかS3とか使う。

こんにちは、マリンです。 早速問題発生しました。 ポートフォリオの画像が、一瞬表示されるのに気づいたら消えてる!? 調べてみたら、Herokuは画像データを保存できないので、 クラウドストレージがマストだとのこと。 Rails Tutorialの13.4.4「本番環境で…

完成しました〜!!

MyWeb いやぁ・・・長かったです。 たったこれだけのサイト作るのに1ヶ月かかってしまいましたorz しかもほとんどtutorialパクっただけなのに・・・ しかし何はともあれ、無事完成し、デプロイも完了しました! まだまだ改良の余地が満載なので、 今後少しず…

管理用サイト完成!

ちょっと空いてしまいましたが、 管理用サイトが完成しました。 構成 今後 構成 Log_in Profiel Work Index Show Edit Create Contact Index Show Log_out 最初はこんな感じ。 ログインをしたらメニューが表示される仕様です。 あ。ログインしたのにアイキャ…

テストはきちんと工程を考えましょう・・・

こんにちは、マリンです。 現在は管理用サイトのポートフォリオ編集機能を実装中です。 ここまででテストがいまいちうまくいかなくてハマりました。 ハマった点 原因 まとめ ハマった点 ポートフォリオの投稿と編集をそれぞれ失敗ver.と成功ver.でテストする…

Bootstrapで画像をレスポンシブ対応にする。

こんにちは、マリンです。 閲覧用サイトもそろそろ完成です。 今微調整を行っているところですが、 今回はBootstrapを使って詳細ページの画像を レスポンシブ対応にしました。 やりたかったこと 画面を小さくしても画像がはみ出ないようにしたい。 方法 Boot…

gem 'rails-controller-testing'

こんにちは、マリンです。 Rails Tutorialの時こんなの入れたっけ? と覚えがないのですが・・・ 今回Contactページのintegration_testでひっかかったのでメモっときます。 ハマった点 対策 補足 ハマった点 問い合わせの内容に不備があった場合、 renderで…

サムネイルのCarrierWaveの画像にリンクを貼る

こんにちは、マリンです。 サムネイルからのリンクにちょっと手間取ったのでメモります。 やりたかったこと 方法 CarrierWaveの設定を変える サムネイルをつくる まとめ やりたかったこと 一覧ページで使っている、CarrierWaveでアップロードしたサムネイル…

スタイル整えるのホント難しい!!【Bootstrap】

こんにちは、マリンです。 無事一覧ページのサムネイルができました! しかしまぁ、スタイル整えるのってホント難しいです!! Bootstrap使っていい感じにできるとはいえ、 containerやらrowやらcolやら・・・ 「だから!なんで左寄りになっちゃうわけ!!!…