ここ最近ストックしたQiitaの記事をまとめてみる【前編】

投稿日:

プログラミング初心者の勉強ブログ #125

ここ最近は、参考になったQiitaはとりあえずストックするようにしていたので、それらの復習を兼ねて僕がQiitaでストックした記事をまとめてみる。振り返るとJavaScript関連が多め。ジーズではてっきりPHPを色々やるんだろうな思っていたが、気づいたらJSばかりやっている。

 

目次

目次

 

JavaScript関連

Node.js を5分で大雑把に理解する

https://qiita.com/hshimo/items/1ecb7ed1b567aacbe559

Node.js?Next.js?Nuxt.js?みたいな状態のときに読んだ気がする。名前似過ぎだし。とりあえずフレームワークの類だと思っていたNode.jsは、フレームワークではなく開発環境なんだと学んだ。

 

async/await 入門(JavaScript)

https://qiita.com/soarflat/items/1a9613e023200bbebcb3

JSの非同期処理関連の処理順がわけわからんcallbackわけわからん(今も)状態のとき読んだ。ただでさえよくわかってないPromiseには違う書き方もあるんだなと。Promise調べているとちょいちょいasync/awaitで書かれているコードを見かけて勘弁してーなった記憶。

 

アロー関数と関数の違いとthisの評価のされ方

https://qiita.com/shoichiimamura/items/aec874fc5cf55cde7fa1

thisはとりあえずややこしいかった思い出。今となってはthisで悩むことは無くなってきたが、アロー関数と普通のfunctionで定義する関数でthisの挙動が違ったときに参考にした記事。

 

【JavaScript】アロー関数式を学ぶついでにthisも復習する話

https://qiita.com/mejileben/items/69e5facdb60781927929

上に同じ。多分ドットインストールでJSやりまくっていたときらへん。

 

やっとわかったjsの「巻き上げ」

https://qiita.com/39_isao/items/d9d80e98b5bd1938bc1d

JSのvarとletとconstの違いとかの話につながる。変数の宣言と代入をちゃんと区別することと、スコープというものを理解すると巻き上げの意味がわかってきた印象。

 

ES2015新機能: JavaScriptのclassとmethod

https://qiita.com/niisan-tokyo/items/83582bc0646239cf6cb8

ES6の書き方を学ぶために読んだ記事。JSのclassの書き方を学ぶのに一番勉強になったのはドットインストールだと思う。まじでドットインストールのJSのプレミアムをオススメする。

 

イマドキのJavaScriptの書き方2018

https://qiita.com/shibukawa/items/19ab5c381bbb2e09d0d9

上に同じ。こっちの記事は包括的にイマドキJSの書き方について載せている。

 

manifest.json でWebアプリを「ホーム画面に追加」自動バナー表示に対応させる

https://qiita.com/tmtysk/items/2c5da83feec45b4ee36f

PWAのとき読んだやつ。初PWA実装のときテンション上がった気がする。

 

Node.jsにおけるルーティングの話(MVC実装まで)

https://qiita.com/Ken-Fujimoto/items/e852cb7a4a656c711e98

NodeとかExpressはMVCで開発できると聞いたが、調べていると「MVCっぽい」という表現を見かけたのでちゃんと調べようと思って読んだ記事。

 

WebRTCでビデオチャットアプリを作ってみた!

https://qiita.com/lighthouse/items/34bb8ccb6149bbfae427

僕が参考にしていたビデオチャットアプリの記事と同じものを参考にしていた人の記事だったので読んだ。

 

Promiseについて0から勉強してみた

https://qiita.com/toshihirock/items/e49b66f8685a8510bd76

Promiseを学ぶきっかけはビデオチャットアプリでWebRTCをいじったとき。Promiseはオブジェクトであり、非同期通信を操作できる。Promiseは字面じゃわかりづらい。

 

JavaScriptの同期、非同期、コールバック、プロミス辺りを整理してみる

https://qiita.com/YoshikiNakamura/items/732ded26c85a7f771a27

これも上に同じ。JavaScriptマスターになるためにはここら辺が山場な気がする。僕の場合vueとかreactはまだ手をつけてないのでそこらへんもまだ足りてない。

 

Promise と async/await の理解度をもう1段階上げる

https://qiita.com/SotaSuzuki/items/f23199e864cba47455ce

これもまた上2つと同じ。おそらくNodeのExpressで色々複雑に非同期組むとなると使うんじゃないかなと思って、細かく理解できなくても概念くらいは把握しておきたかったので読んだが、実際使うタイミングが訪れるまでは理解できないんだろうなと思った。

 

 

Firebase関連

[Firebase] [Firestore] ログインしているユーザーのみに読み書きの権限を与える

https://qiita.com/hoge_5555/items/456f4720ce7295cad874

Firebaseのアクセス権限の制限をするために読んだ記事。

 

こんなFirebaseの使い方は間違っている (2019年4月版)

https://qiita.com/hecateball/items/f19d680f4df6391906c6

Firebaseすげーなって今後使おうと思い色々調べていたときに参考になった。

 

 

DB関連

MariaDBのテーブル定義を確認してみる

https://qiita.com/Sa_Ru/items/a8e51f20becfb008f2e5

Cent OS7はMysqlでなくMariaDBが標準だったかなんかで、しゃーなしにMariaDBを調べた思い出。MariaDBはMysqlの枝分かれDBみたいなイメージで覚えている。

 

 

Ruby関連

Rackとは何か

https://qiita.com/k0kubun/items/248395f68164b52aec4a

RailsデプロイのときにUnicornを使ったていたが、そのときUnicornはラックサーバーと呼ばれていたなと。そもそもRackってなんぞ、となったときに調べてなんとなくしっくりきたからストックしたんだと思う。

 

 

環境構築関連

WebSocketについて調べてみた。

https://qiita.com/south37/items/6f92d4268fe676347160

このときは双方向通信が何なのか全くわかってなかった。言われてみればhttp通信はリクエストとレスポンスが1セットで成り立っているなと。FirebaseやってるあたりでWebsocketについて多く目にする機会が増え、わからんすぎてしゃーなしに調べた思い出。

 

nginx起動、再起動

https://qiita.com/Kaisyou/items/dadf6fe9ee93fb69e76c

毎回Nginxの再起動コマンドを忘れてしまうのでストックしたが、ストックしたあたりから覚えてしまい読まなくなった。「nginx -s reload」という、そこにハイフンsかよって部分と、restartじゃなくてreloadかよって部分で覚えられなかった。

 

Nginx での 413 Request Entity Too Large エラーの対処法

https://qiita.com/takecian/items/639deeae094466de6546

sakuraサーバーにwordpress入れてみようと思ったときに出たエラーだったと思う。それだけ。

 

Pathを通すとは、環境変数とは

https://qiita.com/fuwamaki/items/3d8af42cf7abee760a81

グローバルインストールとローカルインストールの違いがよくわかっていなかったときに読んだ記事。自分のMacにhomebrewとかで何かをインストールするとき「-g」つけるときとつけないときの違いは何なんだ、ってなってた。何がどこにインストールされているかを意識するきっかけとなった。

 

MacにNode.jsをインストール

https://qiita.com/kyosuke5_20/items/c5f68fc9d89b84c0df09

Nodebrew使ってちゃんとバージョン管理できる状態でNode.jsをインストールしたかったときに読んだ。

 

 

デザイン関連

iOS ヒューマンインターフェースの原則

https://qiita.com/usagimaru/items/9b55daa4d88b0bb98f38

授業でSketchを使ってiOSのデザインを真似して作るみたいなのをやったときになんとなく調べていたら出てきたやつ。

 

San Francisco フォントを探る

https://qiita.com/usagimaru/items/da88c0a8793f23633c28

MacのOS系のシステムフォント。色々フォント調べていたときに読んだやつ。とりあえずメジャーどころのフォントを自分のMacに入れたくて、San Fransiscoと源ノ角ゴシックをインストールした気がする。

 

 

通信関連

【初心者向け】STUN/TURNサーバをざっくり解説してみた

https://qiita.com/okyk/items/a405f827e23cb9ef3bde

ビデオチャットアプリのシグナリングサーバーを作るためには最低限必要な知識だった。通信は意外と面白い。

 

 

その他

2019年に注目すべきWebテクノロジー6選

https://qiita.com/rana_kualu/items/9652879067cf658499c7

名前に釣られて読んだ。

 

色々あるHTMLのmetaタグなど一覧

https://qiita.com/RinoTsuka/items/3b4fb69d980cecddf512

OGP勉強したあたりで一回metaタグ大体覚えたが、知らないmetaタグをその後もちょいちょい見かけたので一旦整理するために読んだ記事。

 

SDKとAPIについて

https://qiita.com/Terry3/items/13ef03cf6d2c069caaea

Railsの勉強のときは見かけたことがほとんどなかったが、JSを勉強しているとSDKをよく見かけるのでこれなんだとなって調べた。APIと比較してくれているのでわかりやすい。

 

 

まとめ

一回でまとめて書こうと思っていたが、書いてみると結構長くなったので前後編で分けることにした。自分の最近の勉強の軌跡としてQiitaのストックを省みるのは意外と面白い。こうみるとJSばっか最近やっていて、フロントのデザインとかは結構雑になってきている。

Webデザインも最低限綺麗な見た目を自分で書くことはできるようになったと思っているが、まだまだ細部は甘いし、どちらかというと僕のはフラットデザイン止まりでマテリアルデザインの実装はあまりできていない。「UX向上のためのアニメーション」という視点より、グラフィカルなデザインに目が行き過ぎていたんだなと最近感じるようになった。デザインをグラフィカルなアートとして捉えると先が長く感じられ、自分には到達できなさそうだと思ってしまう。自分にできないものだと感じるからこそ、クリエイティブでアーティスティックなWebデザインばかりに目がいくわけだが。

マテリアルデザインに関しては「ユーザーが使いやすいと思うアニメーション」な訳で、人間が使いやすいと思うデザインはある程度限られてくるだろうし、必ず法則ができてくる分野な気がするから、可能性が無限大なグラフィックデザインよりは習得できそうだなと勝手に思っている。とりあえずデザインの勉強で時間を割くというよりは、日頃からWebサイトの細部をみる意識を持つのが良いと思うので、そういう感じで長いスパンで気楽にインプットを増やせればと思う。今日は真面目なまとめ。

以上ありがとうございました。

-プログラミング学習
-,

Copyright© s u p ? , 2019 All Rights Reserved.