Hirooooo’s Labo

開発メモ、ガジェット、日記、趣味など、思った事を思ったまんま書くブログ

Development

React × Redux 初心者入門(5日目:webpackでCSSを読み込ませて反映する)

前回はMaterial-uiの実装を行い、デザインの変更を行いました。 今回もデザイン関連の設定になりますが、cssファイルを作成して、webpackで読み込んで反映させる方法を書きたいと思います。 複数のcssファイルが作成されたときのことを考慮して、bundle時に1…

React × Redux 初心者入門(3日目:ESLintにAirbnbのJavaScriptスタイルガイドを導入する)

今回も前回に引き続き開発環境のための設定説明です。 ESLintを使用してJavascriptのコードスタイルガイドを導入している人は多いと思います。 その中でも、Airbnbのスタイルガイドが人気なので、できるだけ準拠するよう実装してみたいと思います。

React × Redux 初心者入門(4日目:Material-UI(v1)を実装する) ver.2018

前回までで簡単なカウンターアプリがReact Reduxで出来上がっている状態なので、次はデザイン周りの実装をしていきたいと思います。 今回実装するのはMaterial-UIを追加してみたいと思います。 こちらは昔書いた記事のリライト版になりますので、記事の文言…

React × Redux 初心者入門(2日目:webpackでHotModuleReplacementとソースマップ出力)

前回は環境構築から簡単なカウンターアプリをReact Reduxで作成してみました。 今回は更に開発効率が上がるように開発時はHotReloadの機能と、ソースマップの出力機能を実装していきたいと思います。

React × Redux 初心者入門(1日目:webpackで環境構築編) ver.2018

1年半前に同じ記事を書いたのですが、バージョンアップによる変更が多く、古い記事ではまともに動かすこともできない記事となってしまったため、React × Reduxの連載記事を1日目から再投稿していこうと思います。 記事の文言等々は過去の記事をリライトして…

【2018年1月現在版】macにインストールしたお勧めソフト・アプリ一覧

以前macのお勧めソフト・アプリを紹介しましたが、あれから2年近く経ちましたので、現状の私のオススメmacソフト・アプリをまとめてみたいと思います。 基本的には今インストールされているソフト・アプリの紹介になります。 個人的にはあまりアプリを増や…

Macのユーザーアイコンを好きな画像に変更する方法

Macのユーザーアイコンは特に必要性もないんですけど、やっぱりデフォルトのままじゃなくて、自分の好きなアイコンにしたいですよね? おしゃれな標準アイコンから選択するのではなく、自分の好きな画像に変更する方法です。

MacにHomebrewからGitをインストールする方法

Macには標準でGitが存在していますが、せっかくなので、Homebrewを使って管理したいと思います。 なので、今回はMacにHomebrewからGitをインストールして、使用するGitを切り替える方法を説明します。

MacにGoogle日本語入力をインストールして、余計な入力ソースを削除する設定方法

Macでキーボードの入力ソースは何を使ってますか? 私はずっとGoogle日本語入力を使っています。 個人的には標準の日本語入力ソースよりも使い勝手がよく、無料で使えるのでおすすめです。 今日はGoogle日本語入力のインストール方法と設定方法を紹介します。

サーバーへのSSHアクセスをIPアドレスで制限する方法

サーバーへのSSHリモートアクセス制限ですが、公開鍵認証と一緒に自分の固定IP以外は接続できないようにしました。 インフラにはめっぽう弱いので、とりあえず調べてやってみたのでメモしておきます。

HTML5のINPUTタグで type numberの時に表示される増減ボタン(スピンボタン)を非表示にする方法

HTML5で追加された便利な機能がたくさんあると思います。 Web画面開発時によく使用するINPUTタグ そのINPUTタグのtype属性もたくさん追加されました。 今日はそのINPUTタグのtype=numberの時に表示される右側の増減ボタン(スピンボタン)を非表示にする方法で…

【メモ】gitでよく使うコマンドのまとめ・備忘録

Gitを使ってるときに アレ?この操作のコマンドなんだっけな? って覚えられない私がいるわけで。 そんな私の私による私の為のgitコマンド備忘録です。 このページは随時更新していこうと思います。

KarabinerがMacOS Sierraで動かないので、⌘英かなで代用することに落ち着いた

以前Karabinerの設定方法をオススメ設定の記事を描きましたが、MacのOSがSierraにアップデートされたことにより、Karabinerが正常に動作しなくなってしましました。 以前の記事はこちら www.hirooooo-lab.com MacでUSキーボード配列を使用しているユーザーに…

ReactでjQuery使うと「ESLint:'$' is not defined. (no-undef)」とエラー出たので直し方を調べてみた

Reactで構築していたシステムに、ふとjQueryを入れないと実現できないような要件が発生しました。 そもそもReactとjQueryを共用してもいいのか・・? ざっっっくり調べた個人的解釈では、 「使い方ちゃんとすれば別に大丈夫じゃない?」 という感じ。 とりあ…

npmの取得パッケージのバージョンをまとめて更新する方法(npm-check-updates)

今回も前回に引き続きnpmに関しての記事です。 今回はpackage.jsonに記載されているパッケージのバージョンを簡単に更新する方法を紹介したいと思います。 前回のnpmコマンドの記事はこちら www.hirooooo-lab.com npmにはnpm updateというコマンドがあるので…

【メモ】npmでよく使うコマンドまとめ

環境構築をする上で便利なパッケージ管理にnpmがあります。 npmでは使用するパッケージを簡単にインストールしたり、package.jsonに記載しているパッケージを一括でインストールしたり、開発環境を構築する上でとっても便利です。 最近ではnpmスクリプトを使…

Javascriptでスリープ(Sleep)的な処理を簡単に実装する方法

Javascriptで開発していると、処理の途中でスリープして待機をさせたい時があると思います。 他の言語(RubyとかPHPとか)だと、Sleep関数なるものがよく用意されていて sleep(秒数) みたいな書き方で、指定した秒数だけ遅延させることが出来るんですけど、Jav…

React × Redux 初心者入門(3日目:react-router-reduxでルーティングを実装する)

今回はページングの処理を実装していきたいと思います。 前回の状態からサンプルページをいくつか追加し、routerによるページングができるところまでが今回のゴールです。 前回の記事 www.hirooooo-lab.com

【メモ】Atomでよく使うコマンド、ショートカットまとめ

Atomでよく使うコマンドやショートカットをメモしておきます。 脳内メモとして。

【メモ】gitのブランチを削除するコマンド

gitのbranch操作のコマンドメモです。 ローカルブランチ、リモートブランチの削除するコマンドのメモです。 すぐ忘れちゃうので。

React × Redux 初心者入門(2日目:Material-UIを実装する)

---2018/01/19追記--- こちらの記事の情報は古くなっております。 現時点(2018年1月)で書き直しましたので、下記記事をご参照ください。 www.hirooooo-lab.com ---追記ここまで--- 前回は環境構築から簡単なカウンターアプリをReact Reduxで作成してみました…

React × Redux 初心者入門(1日目:環境構築編)

---2018/01/19追記--- こちらの記事の情報は古くなっております。 現時点(2018年1月)で書き直しましたので、下記記事をご参照ください。 www.hirooooo-lab.com ---追記ここまで--- 今度仕事でReact使う事になったので、勉強のためReact-Reduxを使ってWebアプ…

Node.jsをMacにインストールしてnpmを使えるようにする

開発環境の構築するときのメモです。 今回はNode.jsのインストールについてメモしておきます。 AngularJSやReactなどフロント界隈の開発をすることが多くなってきたので、npm使ったりするためにも必要です。 Node.jsをインストールするに辺り、バージョンを…

MacにHomeBrewをインストールする方法

開発環境の構築するときのメモ。 いろんなpackageをインストールするのに便利なHomebrewですが、そもそものHomebrewのインストール方法をメモしてみました。

MacでUSキーボードの必須アプリ「Karabiner 」のオススメ設定

前にMacのオススメソフト記事を書きましたが、その中で紹介したキーボードカスタマイズアプリ「Karabiner」のオススメ設定について書きたいと思います。 www.hirooooo-lab.com 英字キーボードのMacを使ってる人は、入力モードの切り替えをコマンドボタンで行…

【メモ】 PostgreSQLのコマンド・TIPS覚え書き

コンソールからPostgreSQLを操作するときのコマンドとか、覚えておくと便利なTIPSをメモしてみた

PostgreSQLで実行中のプロセスの確認方法とKILLの方法

PostgreSQLでプロセスのKILL方法がわからなくて、実行中プロセスの確認方法と、停止(KILL)の方法を調べたのでメモしておきます。

【2016年6月現在版】macにインストールしたお勧めソフト・アプリ一覧

去年ぐらいから仕事もプライベートもWindowsからmacに乗り換えました。 約1年macで色んなソフトを探しては入れて試してみて、ある程度主要なソフト・アプリが固まってたのでまとめてみました。 ほぼ無料版ですが、便利なアプリは有料版使ったりしてます。

【2016年6月現在版】Atomにインストールしたお薦めプラグインまとめ

AngularJSの開発とかでお世話になっているAtomについて、インストールしたプラグインをまとめてみました。 まだまだAtom自体がもっさりしてたりすると思うので、できるだけプラグインも必要最低限のものだけにしています。

画面の色のカラーコードを調べる時に、Mac標準の『Digital Color Meter』というカラースポイトがすごく便利

デザイン作成時に画面の色を抽出したいことがありますよね? RGBや16進が知りたい時に、画像編集ソフトのカラースポイト使ったり、フリーのソフトを使ってたりするかもしれませんが、Macに最初から標準で入ってる『Digital Color Meter』ってアプリで充分で…