はてなブックマーク

本記事はエイチームフィナジーアドベントカレンダー4日目の投稿です。 ちいさいgemを作ってはじめて公開したお話になります。 ツイートするだけのシンプルなツールが欲しかった 普段プライベートで開発や調べ物をしてるときに、作業内容をメモがてらTwitterにつぶやいたりしています。そういうときはだいたいターミナルを開いて作業してるので、いちいちTwitterクライアントに切り替えるのがめんどくさいです。なのでターミナルから使えるCLIのクライアントをいくつか使ってるのですが、たいてい高機能で個人的にほぼ使わない機能がいっぱいあって、もっとシンプルなのが欲しいなと常々思っていました。 gemを作って公開してみたかった 業務でRailsアプリをメンテしてたりプライベートでRails製の個人サイトを運用してたり、普段からRubyによく触れています。当然gemの導入やコードを読むこともありますが、ge

create-react-app にて、GitHubにコミットできるようAPIキーを非表示にする方法を簡単にまとめておきます。 ①プロジェクトのディレクトリのルートに .env ファイルを作成 ② .envファイル内で、選択したAPIキー名にREACT_APP_を追加して割り当てる。 .env 内に、下記を記入。 ※React_APP_ こちらを書き忘れないこと。 ③ .envファイルを.gitignoreファイルに追加。 gitignoreはGitで使われる特殊なファイル名で、このファイルに書かれたファイルは上から順に処理されて、Gitのトラッキングの対象外になる。 Gitのトラッキングの対象外になるということは、Gitで管理していたディレクトリの中にあっても無視されるということ。

Docker(WSL2)でRailsコンテナを作り、webpackerを導入しましたが、 更新されたjavascriptやcssを監視してwebpackのコンパイルをするwebpack-dev-serverが どうもうまく動かず数時間悩んだので、自分が解決できた方法を記載します。 事前にしたこと docker-compose.yml version: '3' services: web: &web build: context: . environment: WEBPACKER_DEV_SERVER_HOST: webpacker webpacker: <<: *web environment: WEBPACKER_DEV_SERVER_HOST: "0.0.0.0" ports: - '3035:3035' ※端折って書いています、別途RailsコンテナのDockerfileが必要になり

paizaラーニングのスキルチェック見本問題セットについて、、、 この問題はなんとか正解することはできたが、絶対にもっと効率の良い書き方がある、、、と思い、解説を見てみた。 すると、簡潔なわかりやすいコードが、、、↓↓↓ ポイント ・空席状況を管理する変数 (配列がいい) を用意し、すべて空席としてマークしておく。 ・グループが来店する度に、そのグループが座れるかどうかを判定。 座れるなら、座った座席を使用済みとしてマークする。座れないなら、何もしない。 ・座席 n と座席 1 が隣り合っていることに注意。 これをプログラム上で表現するには、n で割った剰余を用いる！ ⏩ここがわからなかった。。。 実装例 process.stdin.resume(); process.stdin.setEncoding('utf8'); // 自分の得意な言語で // Let's チャレンジ！！ var

投票アプリ作成中、よくわからない警告に遭遇(Part2) 投票アプリ以外でも、時々、今回の警告は見たことがあった。。。 React Hook useEffect has a missing dependency: 'email'. Either include it or remove the dependency array react-hooks/exhaustive-deps （日本語）React Hook useEffectに依存関係がありません： 'email'。それを含めるか、依存関係配列react-hooks / exhaustive-depsを削除します 大前提として、useEffectについて 第一引数には、副作用として実行する関数を与える。 useEffectに指定することで、副作用は、コンポーネントの描写が終わった後に実行される。 第二引数によって、副作用を実行する頻

Warning: Can't perform a React state update on an unmounted component.JavaScriptFirebaseReact 投票アプリ作成中、よくわからない警告に遭遇 投票作成ページにて、投票を作成すると、投票を表示させるメインページに戻るが、その際に毎回、以下のような警告が出ていた。 Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup funct

日付、時刻表示について チャットアプリ作成時、苦戦したのでまとめておく。 メッセージを送信した際に、Cloud Firestore（firebase）にtimestampを保存し、そのtimestampを取り出してフォーマットした後、表示させる。 大前提として、、、 ○firestoreにtimestampを作る firebase.firestore().collection("messages").add({ content: value, timestamp: firebase.firestore.FieldValue.serverTimestamp(), //<-new Date()だとそのパソコンの時刻が使われるのでズレる場合を考慮してサーバーサイドの時刻を追加する // timestamp: new Date(), }); new Date() だとクライアント側 (ブラウザ)

//省略しない場合 const add1= (a) =>{ return a + 1 } //省略した場合1 const add2= (a) =>( a + 2 ) //省略した場合2 const add3 = a => a + 3 以上の様にreturnを書き、その中に返り値を書くのが基本的な書き方ですが、returnを省略することができます。 ただ省略した書き方の場合は()で書いた中身全てがreturnの中という状態になりますので、定義等がかけません。 つまり、 messages.map((message, index) => ( //<-ここが普通のかっこになっている const formatTime = `${message.timestamp.getFullYear()}/${message.timestamp.getMonth()+1}/${message.timestamp.

「Ateam Finergy Inc. Advent Calendar 2020」7日目は @okonomi が担当します。 はじめに 「Renovate」は依存ライブラリの自動更新ツールです。 私が担当しているサービスでもRenovateを導入していて、半年ほど運用してみてそれなりに軌道に乗ってきたので、一度振り返ってみようと思います。 前提として、下記のような環境・アプリで運用しています。 self-hosted Gitlab フロントエンドのコードを含んだRailsアプリ Renovateはローカルでも試せる Renovateに対する私の理解不足だったんですが、RenovateはWebサービスとしての提供のほかにOSSとしても公開されており、ローカル環境で動かすことができます。 https://docs.renovatebot.com/self-hosting/#installing

株式会社エイチームライフスタイルでWebエンジニアをしています、@okonomiと申します。 Ateam Lifestyle x cyma Advent Calendar 2018 11日目は、「Phive」について書いてみたいと思います。 この記事で書くこと Phiveって何？なんで必要なの？ Phiveの基本的な使い方 こんな人におすすめ ComposerでphpstanなどのPHP製ツールをインストールしたら依存関係の衝突で苦労した .pharファイルをダウンロードしたけど管理するのが面倒 Phiveって何？ Phiveとは、Pharを管理するパッケージマネージャです。 Pharとは何かというと、複数のファイルからなるPHPプログラムを.pharとしてひとつのファイルにまとめる仕組みです。 公式ドキュメントがわかりやすいので詳しくはそちらをご覧ください。 .pharファイルとして提供

エイチームライフスタイルWebエンジニアの@okonomiと申します。 Ateam Lifestyle Advent Calendar 2017、15日目をお送りします。 はじめに 弊社ではRails製のWebサイトを複数運用しており、最近それらのサイトに徐々にWebpackerでReactを導入し始めています。 導入自体は他のエンジニアが進めているのですが、自分でも手順などを知っておきたくて試してみました。 webpacker gemを追加してHello Reactするところまでは楽勝でしたが、そこから実際にアプリを書き始めるとつまづくポイントがいくつかありました。 もしこれからWebpackerを導入しようというときに、何か参考になれば幸いです。 また、試行錯誤の結果をgithubに公開していますのでよろしければ合わせてご覧ください。 https://github.com/okonom

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

できるようになること 英語の文字列を選択して C-x C-t したら日本語訳が表示される。 環境など Ubuntu 13.04 と Mac OS X Lion 上の Emacs 24.3 で確認しました。 設定 google-translate.el と popwin.el をインストールします。 どちらも package.el でインストールできるのでそれで。 ;; google-translate.el (require 'google-translate) ;; キーバインドの設定（お好みで） (global-set-key [(C x) (C t)] 'google-translate-at-point) ;; 翻訳のデフォルト値を設定（en -> ja） (custom-set-variables '(google-translate-default-source-languag