update

content/docs/angular.md

@@ -1,5 +1,6 @@
-# [Angular](https://github.com/angular/angular)とは
-Typescript/JavaScriptやその他の言語を使用してモバイルおよびデスクトップWebアプリケーションを構築するための開発プラットフォーム.
+# Angularとは
+- Typescript/JavaScriptやその他の言語を使用してモバイルおよびデスクトップWebアプリケーションを構築するための開発プラットフォーム.
+- **GitHubリポジトリ:** https://github.com/angular/angular
 
 ## 用語
 |用語|意味|
@@ -59,7 +60,8 @@ cd first-app
 # コンテナに入って作業する
 docker run -it --rm -w /app -v $(pwd):/app solareenlo/angular-cli sh
 # コンポーネントを作成
-docker run -it --rm -w /app -v $(pwd):/app solareenlo/angular-cli ng g component sample-component
+docker run -it --rm -w /app -v $(pwd):/app solareenlo/angular-cli ng generate component sample-component
+docker run -it --rm -w /app -v $(pwd):/app solareenlo/angular-cli ng g c sample-component
 # コンテナを立ち上げる
 docker run -d -w /app -v $(pwd):/app -p 4200:4200 solareenlo/angular-cli ng serve --host 0.0.0.0
 ```
@@ -77,6 +79,13 @@ docker run -it --rm -w /app -v $(pwd):/app solareenlo/angular-cli sh
 docker-compose up -d
 # コンテナの中に入って作業する
 docker-compose exec angular sh
+# コンポーネント作成
+docker-compose exec ng generate component sample-component
+docker-compose exec ng g c sample-component
+# テストは作らずにコンポーネント作成
+docker-compose exec ng g c sample-component --spec false
+# コンポーネントの中にコンポーネントを作成
+docker-compose exec ng g c sample-component/test --spec false
 # 関連するコンテンを全て止める
 docker-compose stop
 # 関連するコンテナを全削除

content/docs/command.md

@@ -1,8 +1,8 @@
 # コマンドとは
-コンピュータに特定の機能の実行を指示する命令のこと.
-たくさんのコマンドがあり, 黒い画面に直接入力する.
+- コンピュータに特定の機能の実行を指示する命令のこと.
+- たくさんのコマンドがあり, 黒い画面に直接入力する.
 
-## psコマンド
+## プロセスの動作状況 (ps)
 psコマンドはプロセスの動作状況を確認するためのコマンド.
 
 **auxオプション**  
@@ -31,10 +31,12 @@ shasum -a 256 <ファイル名>
 sha256sum <ファイル名>
 ```
 
-## ファイルのユーザー所有権とグループ所有権を変更
+## 所有権を変更 (chown)
 ファイルのユーザー所有権とグループ所有権をrootからsolareenloへ変更する
 ```bash
 sudo chown solareenlo:solareenlo ファイル名
+# 再帰的に変更
+sudo chown -R solareenlo:solareenlo ファイル名
 ```
 
 # 基本的なUnixコマンドの使い方

content/docs/css.md

@@ -0,0 +1,24 @@
+# CSSとは
+- ウェブページのスタイルを指定するための言語.
+- Cascading Style Sheetsの略.
+
+## フレームワーク
+### Bootstrap
+#### グリッドシステム
+<img src="/images/bootstrap/grid_system.jpg" width="80%" height="80%">
+
+**Reference:** [Bootstrapのグリッドシステムの使い方を初心者に向けておさらいする](http://websae.net/twitter-bootstrap-grid-system-21060224/)
+
+```css
+<div class="contaiiner"> /* 固定枠 */
+  <div class="row"> /* row枠 */
+    <div class="col-xs-12"></div> /* スマホ枠 */
+    <div class="col-sm-12"></div> /* タブレット枠 */
+    <div class="col-md-12"></div> /* PC枠 */
+    <div class="col-lg-12"></div> /* PC大枠 */
+  </div>
+</div>
+```
+<img src="/images/bootstrap/col_size.png" width="80%" height="80%">
+
+**Reference:** [Bootstrapのグリッドシステムについてまとめてみた](https://qiita.com/akatsuki174/items/53b7367b04ed0b066bbf)

content/docs/kubernetes.md

@@ -1,12 +1,12 @@
-# [Kubernetes](https://github.com/kubernetes)とは
-Dockerコンテナのクラスタ管理を始めとしたオーケストレーションを行うサービスのこと.
-ホスト間の連携やデプロイについても総括的に管理できる(ここがDocker Composeと違うところ).  
-**Reference:** [Docker Compose利用者から見た Kubernetes 開発環境構築入門](https://speakerdeck.com/kkoudev/introduction-to-kubernetes-for-docker-compose-user)
-
-Kubernetesの大きな特徴の1つに宣言的設定がある.
-宣言的設定とは, イミュータブルなインフラを作るための基本的な考え方で, 「システムのあるべき姿」を設定ファイルに宣言する！という考え方.
-Kubernetesは設定ファイルに書いたとおりのインフラを維持するように設計されている.
-ので, 設定ファイル(yamlファイル)をたくさん書く事になる.
+# Kubernetesとは
+- Dockerコンテナのクラスタ管理を始めとしたオーケストレーションを行うサービスのこと.
+- ホスト間の連携やデプロイについても総括的に管理できる(ここがDocker Composeと違うところ).
+- Kubernetesの大きな特徴の1つに宣言的設定がある.
+ - 宣言的設定とは, イミュータブルなインフラを作るための基本的な考え方で, 「システムのあるべき姿」を設定ファイルに宣言する！という考え方.
+- Kubernetesは設定ファイルに書いたとおりのインフラを維持するように設計されている.
+ - ので, 設定ファイル(yamlファイル)をたくさん書く事になる.
+- **Reference:** [Docker Compose利用者から見た Kubernetes 開発環境構築入門](https://speakerdeck.com/kkoudev/introduction-to-kubernetes-for-docker-compose-user)
+- **GitHubリポジトリ:** https://github.com/kubernetes
 
 ## 他のオーケストレーションと違うところ
 ① 様々なOSSと組み合わせることにより, 柔軟に機能拡張なところ.
@@ -234,9 +234,15 @@ kubectl set image solareenlo/worker-deployment worker=solareenlo/multi-worker:$S
 ## TLS
 - [jetstack/cert-manager](https://github.com/jetstack/cert-manager)
 
-# [Helm](https://github.com/helm/helm)
-Kubernetesのパッケージ管理ツールのこと.  
-デフォルトで使用可能なChartは`kubernetes/charts`の`stable`ディレクトリで確認可能.
+## 良書
+- [Cloud Native Infrastructure](https://pages.cloud.vmware.com/cloud-native-infrastructure-ebook)
+- [Kubernetes Up & Running](https://pages.cloud.vmware.com/kubernetes-up-and-running-ebook)
+- [Managing Kubernetes](https://pages.cloud.vmware.com/managing-kubernetes-ebook)
+
+# Helm
+- Kubernetesのパッケージ管理ツール.
+- デフォルトで使用可能なChartは`kubernetes/charts`の`stable`ディレクトリで確認可能.
+- **GitHubリポジトリ:** https://github.com/helm/helm
 
 |用語|意味|役割|
 |---|---|---|

content/docs/linter-formatter.md

@@ -6,7 +6,7 @@
 
 ## Prettier
 - JavaScript(including ES2017), JSX, Angular, Vue, Flow, TypeScrip,t CSS, Less, SCSS, HTML, JSON, GraphQL, Markdown,  GFM, MDX, YAMLをフォーマットしてくれる.
-- **リポジトリ:** [prettier/prettier](https://github.com/prettier/prettier)
+- **GitHubリポジトリ:** [prettier/prettier](https://github.com/prettier/prettier)
 
 ### vimでの使い方
 1. [こちら](https://github.com/solareenlo/vim-config/blob/master/.vimrc)の.vimrcの様に[vim-prettier](https://github.com/prettier/vim-prettier)を設定する.

content/menu/index.md

@@ -17,6 +17,7 @@ headless: true
   - [C]({{< relref "/docs/c.md" >}})
   - [Rust]({{< relref "/docs/rust.md" >}})
   - [JavaScript]({{< relref "/docs/javascript.md" >}})
+  - [CSS]({{< relref "/docs/css.md" >}})
   - [Node.js]({{< relref "/docs/nodejs.md" >}})
   - [TypeScript]({{< relref "/docs/typescript.md" >}})
   - [Angular]({{< relref "/docs/angular.md" >}})