2018/08/31

Vue CLIで生成したNuxt.jsプロジェクトをhttps化して起動する方法

Labels: ,
Vue CLIで生成したNuxt.jsのプロジェクトをnpm run devでそのまま実行するとhttp://localhost:3000でサーバーが起動する。Nuxt.js単体で開発する分にはこれで問題ないのだが、他サービスが関わってくるとできればhttpsでアクセスできるようにしたい。

ということで、Vue CLIで生成したNuxt.jsプロジェクトをhttps化して起動する方法をまとめる。

環境は以下の通り。

  • macOS High Sierra
  • vue-cli@3.0.1
  • nuxt.js@1.4.2

続きを読む »
時刻: 0 件のコメント :
Labels: ,

2018/08/24

macOS(High Sierra)でChromeからlocalhostにアクセスすると極端に遅くなるときの対処法

Labels: ,
自宅用ラップトップをMacBook Pro 2018 High Sierraに更新したのだが、Chromium系ブラウザからlocalhostにアクセスしようとすると極端に遅くなってしまう。localhostのリソースにアクセスするだけで2〜3分ほどだ。

その対処法についていくつかまとめる。



環境と詳細な症状


環境は以下の通り。

  • MacBook Pro 2018 macOS High Sierra
  • ブラウザ
    • Chrome 68
    • Chromium 70
  • ローカルサーバー
    • Docker CE Version 18.06.0-ce-mac70 (26399)
    • Docker Compose version 1.22.0
    • nginx（Dockerコンテナ内）

続きを読む »
時刻: 0 件のコメント :
Labels: ,

2018/08/21

[golang]TCPサーバ/クライアントをつくって学ぶTCP/IPの基礎

Labels: ,
フロントエンドエンジニアとして働く分にはHTML/CSS/JSの知識だけで良いのかもしれないが、仕事上でTCPについての知識が必要になった。しかし、TCPについては基本情報技術者レベルの知識しかなく、いまだにOSI参照モデルが実際のアプリケーションとどう関連付けられるかわかっていない。

そこで、低レイヤーの学習も兼ねて、Go言語（golang）でTCPサーバーとクライアントをStep by Stepで実装し、TCP/IPについてより深く学ぼうと思う。



知識編: TCP/IPとは


インターネットやネットワークについて学んでいると必ず出てくるのが「TCP/IP」だ。OSI参照モデルの第3層（ネットワーク層）のIP（Internet Protocol）と第4層（トランスポート層）のTCP（Transmission Control Protocol）の2つのプロトコルから構成されており、インターネットで標準的に利用されている通信プロトコルだ。

OSI参照モデルとTCP/IPプロトコル群


基本情報技術者の試験ではOSI参照モデルの概念についてしか触れないが、TPC/IPプロトコル群（別名: インターネット・プロトコル・スイート）も存在する。TCP/IPプロトコル群のほうが効率的で、かつ現実的な仕様となっているので一般的に使われており、OSI参照モデルは「概念」として残っている。

OSI参照モデルとTCP/IPプロトコル群の対比表
OSI参照モデルTCP/IPプロトコル群プロトコル
アプリケーション層アプリケーション層HTTP, SMTP, POP3, Telnet, …
プレゼンテーション層
セッション層
トランスポート層トランスポート層TCP, UDP
ネットワーク層インターネット層IP, ICMP, ARP, RARO
データリンク層ネットワークインターフェース層Ethernet, PPP
物理層

続きを読む »
時刻: 0 件のコメント :
Labels: ,

2018/08/17

pug(Jade)でエスケープせずhtmlタグやscriptをそのまま表示させる方法

Labels:
pug(旧Jade)でhtmlやscript、styleのサンプルコードを表示させたい場合、<>などをエスケープする必要がある。

たとえば以下のような感じだ。
pre
  code
    | &lt;script&gt;
    | alert(&#039;Hello&#039;);
    | &lt;/script&gt;

これではサンプルコードが変わるたびにいちいちエスケープしてから書き換えなければならないし、そもそもヒューマンリーダブルでない。

ということで、エスケープせずにそのままサンプルコードを貼る方法をまとめる。
続きを読む »
時刻: 0 件のコメント :
Labels:
登録: 投稿 ( Atom )