iq29 diary

EG.LAB 開発日記

.eslintrc.jsの設定(Airbnb)でインデントのアラートが出まくる。でもインデントはTABにしたい。

日本語はおろか、英語でも結構探した

stackoverflow.com

"rules": {
	"indent": [2, "tab", { "SwitchCase": 1, "VariableDeclarator": 1 }],
	"no-tabs": 0,
	"react/prop-types": 0,
	"react/jsx-indent": [2, "tab"],
	"react/jsx-indent-props": [2, "tab"],
}

VScodeの設定も。全然反映されなかったり、よくわからんね。。。

{
	"editor.detectIndentation": false,
	"editor.renderWhitespace": "all",
        "editor.tabSize": 2,
        "editor.insertSpaces": false,
        "editor.renderWhitespace": "all",
        "window.zoomLevel": -1,
        "extensions.ignoreRecommendations": false,
        "emmet.syntaxProfiles": {
            "javascript": "jsx"
        },
}

ランダムコードをリリースしました

Random Chord

こんなん作った

開発環境

データベース:MongoDB v3.4.10
言語:Node.js v9.2.0
サーバ:AWS EC2上にHTTPサーバ構築
読んでた本:JavaScript Ninjaの極意

作曲の勉強に...

メジャーかマイナーかどっちかのキーで適当にコード進行を3つ表示してくれます。
ついでに曲のテンポも指定してきます。
頑張ってそれで作曲してみてください。

所感

非同期処理のことをよくわかっていなかったのでいい勉強になった

EC2でNode.jsからHTTPサーバ起動したときにEADDRNOTAVAILエラーが出た話

[前回の続き]
ローカル開発環境でサーバ起動して動いていたNode.jsのプログラムをEC2上で動かしたい。
→ EC2のIPv4 パブリック IP、ポート番号を(適当に)8080に指定して、Node.jsからHTTPサーバ起動!

events.js:136
throw er; // Unhandled 'error' event
^
Error: listen EADDRNOTAVAIL (IPアドレス)

めっちゃ調べたが、わからず悶々として一週間経過

セキュリティグループ

ふと、そういえばEC2のセキュリティグループで8080のポートを解放してねーじゃんと気づく

f:id:loney1986:20171216225627p:plain

再度実行

events.js:136
throw er; // Unhandled 'error' event
^
Error: listen EADDRNOTAVAIL (IPアドレス)

心が折れる音がした

パブリックIP と プライベートIP

またぐぐる。そして以下のStackoverflowの質問を見つける
stackoverflow.com

パブリック IP は指定するな、プライベートIPを指定しろって言ってる気がしたのでそうしてみる
→ 無事サーバ起動成功!
→ ブラウザで 「プライベートIP:8080/設定したエンドポイント」 にアクセス
→ 白い画面のままずっと読み込み中になる

/(^o^)\ツンダ

そこからまた小一時間、調べたり、色々なパターンのURLを試す

そして

→「 パブリックIP:8080/設定したエンドポイント」ニュウリョク〜

・・・

うおおおおおお!表示された!!!!!

どうやら
パブリックIP は プライベートIP と紐づいていて、ブウラザからアクセスできるもの
プライベートIP は公開されないのでアクセスこそできないが
DBとかサーバのIPを指定するときはこっちを指定するものっぽい

いやー初歩的なことすぎたのか、調べても全然出てこなくて大変でした...
インフラの勉強ちゃんとしないとなあ...

EC2にMongo DB導入したときにECONNREFUSEDエラーが出た話

{ MongoNetworkError: failed to connect to server [IPアドレス:27017] on first connect [MongoNetworkError: connect ECONNREFUSED IPアドレス:27017]

1年前にNode.jsでローカル開発したシステムをEC2に引っ越しさせようとしたら
Mongo DBの上記のエラーが発生した。

ほとんど海外サイトしか情報がなく、
有力情報もなく (そんなはずもないと思うけど)
時間だけが吸い取られていった...
以下自力で探した答え

# Mongoのポート番号の調査 (ローカルでしか適用されていないポートだと分かった)
$ netstat -ant | grep 27017 
tcp 0 0 127.0.0.1:27017 0.0.0.0:* LISTEN

# confファイルの編集
$ sudo vi /etc/mongod.conf

# 下記場所をコメントアウト → Mongo DB サーバ再起動
# bind_ip=127.0.0.1

# 下記のようになっていればポートがすべてのIPに対して解放されたことがわかる
$ netstat -ant | grep 27017
tcp 0 0 0.0.0.0:27017 0.0.0.0:* LISTEN

なんでローカルでしか使えない設定になっているんだろう

ブログ作ったことをはてなブログに書くという話

http://www.iq29.org/

こういうサイトを作った。 

 

開発環境

データベース:MySQL14.14

言語:PHP 5.3.29

フレームワーク: Bootstrap4 beta.2 

サーバ:AWS EC2

読んでた本:ゼロから学べるブログ運営×集客×マネタイズ 人気ブロガー養成講座

 

経緯

元々は「真面目」なLP風アフィサイトをさくっと作ってみるかと思い

勉強がてらBootstrapを使いつつ、素のPHPでコーディングをしていた。

しかし途中から色々なテーマの記事を書きたくなってきて、

毎回LP作るのもめんどくさいし、雑多で「不真面目」なブログ形式にして

ついでに開発者としてのチャンネルも作ってしまおうという主旨に変更。

 

そして第一回のライティングとアフィリエイトについて調査をしているうちに

あんまり広告広告した嘘っぽいことを書きたくなくなってきて、

良い悪いを正直ベースに断じていく方がよっぽど面白いなと思ったので

一定の記事数とPV数がたまるまで広告も控えることにした。

まずはそれなりに見てもらえるものを作ろうと思ったわけです。

だから第二回以降の記事はそうなっていくはずです。

行き当たりばったりでやってるから保証できないけど。

 

所感

Bootstrap

道中、WordPressのテーマ使えばいいじゃんみたいな声が聞こえてきた。

確かにバックエンドの実装はともかく、

フロントエンドをいじるのは結構辛かった...

しかしまとめサイトみたいな見栄えになってしまったが

Bootstrapならではのレイアウトになったのでそれなりに満足はしている。

 

Bootstrap4 beta.2は10月にリリースされたばかりで

バグがあったり、ググっても公式リファレンス以外の情報があまりなかった。

しかしはじめて勉強するのに今からBootstrap3をやるのもナンセンスかと思い

3の情報を参考にしつつ、試行錯誤の末に4での実装を行った。

まあこの辺はノリで...

グリッドシステムによるレスポンシブデザインの自由度が高かったので、

表示・非表示をかなり制御することができた。

レスポンシブ対応は僕の敵なのでこれはかなり助かった。

ぶっちゃけ中規模以上のWebアプリとかブログを作るんだったら

WordPressとかPHPフレームワークの方がいいと思うけど、

一画面のなにかに対してだったら結構使えるので今後はそうすると思う。

デフォルトのデザインはあんまり良くないし、バッチの色や形の種類も少ないから

バックエンドエンジニア向けって印象。

 

ちなみに完成したタイミングで

ドットインストールにBootstrap4 入門の動画がきていた...

 

AWS

さくらのレンタルサーバしか使ったことがなかったので今回を機にAWSデビュー。

古いアカウントを持っていたけど、1年無料の期限が迫っていたので新規登録。

日本語にローカライズされていたので使いやすくなっていた。

ドメインも Route53 で取得。ここは英語。.com がとれなかったので .org に。

さすがにPHPMySQLを最初にインスタンスに入れるのはわかっていたが

まさかPDOは初期設定しないと使えないものだとは知らなかった。

 

他にも色々つまづいたところはあったと思うのだけど

あんまり覚えていないので今後は備忘録として残していこうと思います。