ごとーめも

小さな企業のWeb担当が日々起こったことを共有したり、思ったこと、勉強したことを書いていくブログ。普段はRailsやAWSを活用したWeb系の開発をやってます。

brew周りをいじった時にError: qt@5.5: unknown version :mountain_lionに遭遇した時の対処

こちらの記事そのままだったんですが、少しわかりにくかったので... brew update cd $( brew --prefix )/Homebrew/Library/Taps/homebrew/homebrew-core # below is the last commit containing qt@5.5 with homebrew git checkout 9ba3d6ef8891e5c15dbdc933…

MongoDB Node.JS driverを使って躓いたメモ

微妙にハマってしまったのでメモ Node.JSのMongoDBのクライアントでは有名どころでMongooseがあると思うのですが、 個人的な理由でMongoDB Node.JS Driverを使ってます (一応本家が出してるしな〜的な軽い理由です) これまで使ってて特に何も感じなかったの…

ページ遷移時、ローディング中のクルクル回るアニメーション

結果はこちら 上記をjqueryで画面ロードが終わったタイミングでfadeOutしていくといい感じにロード済みのページが表示されます ではでは〜

メインビジュアルを画面一杯にしたときに、画面下部に入れる「スクロールしてね」のアニメーション例

結果はこちら(画面幅によっては見づらいかも...) メインビジュアルにでかい写真を一杯使って、コピーをドンっ!! というサイトによく使われる系ですね cssのアニメーションを活用した機能なのですが、パラパラ漫画の容量で作成します ・animationが何秒で終わ…

スクロール方向と逆に動いてるような背景を持つセクション(パララックス効果)を作るメモ

サイト制作の際にたまに使いたくなるので、メモ 結果はこちら jqueryのプラグイン「parallax.js」を使ってます npmやyarnでインストールする際は、jquery-parallax.jsを参照してねとのこと npm/yarnの参照名からわかるように、jquery依存のライブラリです ラ…

ホバーすると暗転/画像が少し拡大されるパーツのマークアップとSCSS

よくある実装なのですが、毎回忘れてしまうのでメモ コードはコチラ ざっくり解説 htmlの略式図です .effectable-img a.effectable-img__link img.img .effectable-img__info 背景画像が拡大される 親の枠を決めます .effectable-img { width: 233px; height…

外出先でMacbookProのお供にしたい周辺機器

どうも〜 あけましておめでとうございます 新年一発目の記事は、僕の使ってる周辺機器に関してです 僕は2018年の1月にタッチバーモデルのMacbookPro13インチを購入しました 大きさも持ち運ぶのにちょうどよく、画面サイズも大きくて気に入ってるのですが 外…

Chromecastでできるオススメの学習環境

Chromecastを見る人 Chromecastって持て余しがちじゃないですか?? 我が家もリビングでYouTubeを見るための道具として実力を発揮してくれています 動画を見るのは好きなので、「それでもいいか」と思うのですが、やはりずっと見てると飽きてきますね そんな時…

naniwa.rb#2 開催!!

こんにちは! 先日、naniwa.rbというコミュニティで、第二回目の読書会&勉強会を開催したので、その様子をお伝えします! 「プログラミング...やりたいけど1人で進めるのはモチベーションが続かない」 「1人で一通りやってみたけど、次は何しよう??」 といった…

naniwa.rb#1 開催しました!

こんにちは! 最近、一度封印したMinecraftを復活させました せこせこ整地を行うのが趣味の@510_fiveです! 先日、naniwa.rbというコミュニティで、第一回目となるもくもく会?(勉強会?)を開催したので、その様子をお伝えしたいなと思います 「プログラミングを…

まずは60秒のプレゼンを決める意識を持つ『僕たちはどう伝えるか~人生を成功させるプレゼンの力』のメモ

シンプルな表紙が目を引く オリエンタルラジオの中田さんが書いたプレゼンに関する本 ジョブズの本を意識させる写真だ プレゼンに関して悩みを抱える人は、一度読んだほうがいいと思う。 理由は ・読みやすい こと。 冒頭数ページ目 空気を読む人間が、衰退…

Go言語で正規表現にマッチした文字列を処理してから、置換する(replaceAllStringFunc)

便利な関数があったのでメモ 「sample text」を全部*で置換したい、ただ文字数を同じにしたい等で使えます。(こんなユースケースあるんだろうか) 検索してよく出てくる関数はReplaceAllStringで、置換するワードが第2引数に渡した値になります。 replaceAllS…

Go言語で先頭1文字を抜き出す

Go言語は好きなのですが、文字列の処理で定期的にハマるのが最近の悩み... 今回は先頭一文字を抜き出す方法。 単純に考えると str := "この木なんの木気になる木" fmt.Println(str[0]) #=> 227 とか言われる... これは、文字の型がruneとかbyteとか色々あるG…

Go言語で特定の文字列の位置を検索する(javascriptのindexOf的な)

stringsというpackageの中にIndexというそれっぽい関数があるが、これはbyteとしての位置を返すためちょっと工夫が必要 package main import ( "fmt" "strings" "unicode/utf8" ) func main() { text := "下手糞の 上級者への 道のりは 己が下手さを 知りて…

お金は細部より流れだ!『お金の流れが一目でわかる! 超★ドンブリ経営のすすめ』の読書感想

先日、はじめて「経営セミナー」なるものに行ってみた時に参考文献として紹介されていた本 これまであまり意識したことはなかったけど、売上、利益がどうとかって、社内で意見を通すためには強力な武器になる。 知ってはいたんだけど、ちゃんと勉強したこと…

jsでよくある「関数読み込まれてない」問題の対処法

実行順序とか考慮して使わないようにすべきなんだけど、どうにもならない時 var repeat = setInterval(function(){ if(typeof(hogeFunc == "function") { hogeFunc() clearInterval(repeat) } }); こいつが助けてくれるときがあります。

Promiseオブジェクトを使ったらAPI周りの処理がスッキリした

かなり前からPromiseオブジェクトの存在は知ってたのですが、ほとんど気にしないでほったらかし状態に... ただ、必要な状態に出会ってしまったのと、そのときに初めてPromiseについて便利さが理解できた気がするので共有します 先に結論 要件: リクエストし…

社内ツールとherokuの相性は最高だ!

gitを使える人だったら、サーバーの設定をせずにしかも無料で使えちゃうheroku 今年に入り、業務改善のためcsvを特定の形式に変換するためのツールを作ってたりするのですが、ほんとに便利だと関心する。 エンジニアとしてはこのようなプログラマに感謝され…

文字コードにはマジ、マジで気をつけよう(ていうか不注意)

csvを変換するツールの作成依頼をうけて、特に難しい処理もなかったので2つ返事でOKしました。 やりたいこと 生csv -> よしなに集計 -> 別サービスにインポート用のcsv 最初にもらったcsvをベースに正解状態になるようにスクリプトを書いていきます。 ほどな…

VueJSメモ[ショートハンド]

Vueを触っていると v-on:click v-bind:id 的な記述をよく使います。 これにはショートハンドがあって、 v-onは@ v-bindは: に置き換えられます。 よく使うものにショートハンドが存在するのはうれしいですね :) jp.vuejs.org

VueJSメモ[算出プロパティ、ウォッチャーの使い所勘所]

computed(算出プロパティ) ・html内にロジックを記述するのを防ぐ ・プロパティが変更されてなかったら、キャッシュを返す このあたりは速度改善などで肝になりそう。 https://jp.vuejs.org/v2/guide/computed.html#%E7%AE%97%E5%87%BA%E3%83%97%E3%83%AD%E3…

VueJSメモ(v-on、イベント修飾子)

今日はイベントの発火の話 Vueはv-on:event_nameで指定した要素で発火したイベントをキャッチすることができる。 (event_nameに入るのはこのあたりのイベントイベントリファレンス - Web 技術のリファレンス | MDN) 例えばクリックした時にalertを出すサンプ…

忘れがち? rails generateでモデル/マイグレーションファイルを作成する時に指定できる型

背景 開発初期はめっちゃ触るんですけど、運用にまわって一段落したらほとんど触らないですよね〜 毎回忘れるのでメモです。 環境 今回テストしてる環境は * Rails4.2.6 です。 rails generate/rails gで指定できる型 ヘルプを実行してみた内容のまとめなの…

フロント開発初心者のためのyarn, webpack導入流れ[2017年冬: React導入版]

背景 SPA(シングルページアプリケーション)というワードに聞き覚えはありますか?? 1画面で色々する類のアプリの総称で例えばGoogleスプレッドやslack, airbnbなどがあげられます。 サービス内すべてがSPAという場合もありますが、特定のページがSPAで実装さ…

Railsをproduction環境で運用する際に初級プログラマが確認しておくべき10個のこと

本番で動作中のRuby on Rails[RoR, Rails]を使ったサービスを引き継ぎました。 ..................・ω・ Railsを使って「開発」する情報はネット上にたくさん転がっていますが、「開発」+「保守・運用」に切り替わる時点/その後の話はわりと軽視されがちだし…

複数行のテキストに蛍光ペンのような下線をつける方法

テキストに下線をつける方法で真っ先に思いつくものは、text-decorationをつける方法 ここに蛍光ペンで引くようと線の太さを求めると話が変わってくる text-decorationは太さを変更できないからだ(色は変更可能)... そこで思いつくのはbox-shadowを使う方法 …

Railsでプロジェクトnewする時に自分がよくつけるオプションを調べてみた

そんなに頻度は高くないけど、毎回調べるのも面倒なので... できれば、何も考えずにコピペでコマンド実行したら同じ環境になるようにしたーい(2017/10/8現在) 結論ファースト $rails new project_name --template=https://raw.githubusercontent.com/Islands…

1階層深いパスへリダイレクトする方法

1階層深くリダイレクトする。 久々にnginxの設定を変更する機会があって、わりとハマってしまった。 要件はこんな感じ /数値(4桁以上)のリクエストを/hoge/数値(4桁以上)へリダイレクトする 例えば/1234 => /hoge/1234みたいな感じ ただし/1234/みたいなケ…

ネットワーク関連の設定を行う時によく使うコマンドリスト(随時更新)

AWS関連でネットワーク周りを確認する時に、よく使うコマンドまとめです 使用端末はMacです。 なので、Linuxのコマンドとほとんど一緒じゃないかなと思います。 現在の自分のグローバルIPを調べる $curl inet-ip.info xxx.xxx.xxx.xxx ドメインに紐づくIPや…

サイズの違う画像を指定したサイズ内で縦横比を一定にしつつ上手く表示する方法

ライターにとって、アップロードする画像のサイズってそんなに気にしないですよね 僕も記事書くときは、スマホで撮った写真を上げたり、写真サービスから引っ張ってきたりするわけです 今回はサイズの違う画像を指定したサイズ内で上手く表示する方法でobjec…