ざきの学習帳(旧 zackey推し )

日々の学びを書きます

じぶん Release Notes ver 0.30.8

f:id:kic-yuuki:20200705205224p:plain

気づけば、2020年も後半戦。転職して1ヶ月が経ち、時の流れの早さを感じています。

2020/06の取り組みの成果を書いていきます。

先月分はこちら -> じぶん Release Notes ver 0.30.7 - ざきの学習帳(旧 zackey推し )

  • 学んだこと
      • 読書中
      • 完了
  • 勉強会・コミュニティ
  • プライベート
    • トピック(出来事)
      • タンパク質取りすぎて、腎臓が悪くなった
      • ミリオンライブがアニメ化始動
    • 記事(じぶんリリースノートを除く)
    • PV数
  • Challenge Every Month
    • 2020/06の結果
    • 2020/07の目標
  • おわりと所感
続きを読む

HTML5 の Local Storage / Session Storage についての考えメモ

ローカルストレージは認知していたのですが、使ったことがない。また、セッションストレージの存在をいまさら知り、それぞれの特徴について学んだのでメモしておきます。

Web Storage API

developer.mozilla.org

ローカルストレージ / セッションストレージとも、Web Storage APIの仕組みとして括られています。

ローカルストレージ / セッションストレージの違い

ざっくりまとめると以下となります。

特徴 ローカルストレージ セッションストレージ
生存期間 永続(明示的に消すまで有効) タブが削除されるまで
有効範囲 ブラウザ全体 タブごと

詳しくは以下をご参照ください。

利用用途

特徴はわかったけど、それぞれどんな使い道があるんですかね... 🤔
自分がパッと思い浮かんだのは以下です。

  • ローカルストレージの場合
    • 複数タブにわたって情報を引き継ぎたい機能
      • ドキュメント編集(Google Docsとか 実際にはわからない)
      • プレーンテキストではない、スタイル情報を含めたテキストやオブジェクトのコピー
  • セッションストレージ
    • SPAなサイトでの情報引き継ぎ(具体例あんま思い浮かばない...)

他、何か使い道があれば、ご教示いただけると助かります。🙏

ローカルストレージのアンチパターン

以下の記事で、ローカルストレージは使わないでね的なことが書いてありました。

techracho.bpsinc.jp

咀嚼すると、

  • ローカルストレージは簡単にアクセスできてしまうセキュアではない情報だよ
    • とくに 個人情報 / 認証情報(JWT ジョット とか) 等は保存しちゃだめだよ!
    • (セッションストレージも同じく、アクセスできちゃうから注意必要だよ)

じゃあどうすればいいの?の答えは、

  • 認証情報はサーバーサイドセッション使おうよ
  • 純粋な文字列や数値だったら、IndexedDBを使おうよ
  • オフライン(PWA)でデータを扱うならCache API使おうよ

と書いてあります。

新規開発や小規模なアプリケーションでは、これらを考慮した作りに切り替えることが容易だと思います。

しかし、絶賛稼働中かつ中規模以上のアプリケーションでは、影響範囲調査や改修コストと戦うことになると予想できます。そんな状況下、優先的に対応するとしたら、ローカルストレージから個人情報を排除する(個人情報の代わりにIDを保持、APIアクセスして取得するようにする など)かなと思いました。

おわり

以上です。

気になる点などありましたら、FBいただけると助かります。🙏

VSCode Remote Container でPythonお試し環境を作った時のメモ

Pythonのバージョン管理をpyenv、ライブラリ管理をpoetryに頼っているのですが、現場(業務)ではコンテナ上で動かすものが多い印象です。

コンテナ上での開発であれば、VSCode Remote ContainerでPythonの補完を効かせて開発したいと思っていたのですが、なかなか手が出ない状態となっていました。

そんななか、kdnaktさんの以下記事を拝見し、まずはRemote Containerで開発環境を構築する素振りをしてみました。

kdnakt.hatenablog.com

本記事では、Remote Container上でPythonお試し環境を動かすため、以下を作成した際のメモを書いていきます。

参考記事

お世話になった記事を先に書いておきます。

起動方法

python-remote-containerは、READMEに記述している通り、コマンドパレット(Macだとcommand+shift+p)でRemote-Containers: Reopen in containerを選択すると、Remote Container(コンテナ起動→コンテナのディレクトリをVSCodeで開く)が起動します。

f:id:kic-yuuki:20200623212817p:plain

各種設定ファイル

.devcontainer.json

.devcontainer.jsonには、

  • Remote Containerを起動するまでの設定
  • Remote Container上で有効化するVSCode拡張機能
  • etc...

といったことを記述します。詳しくは以下を参照どうぞ。

ワークスペースフォルダの指定

Dockerfileでソースを配置したフォルダと、同じフォルダを.devcontainer.jsonに記載します。

# Dockerfile
ADD . /code
WORKDIR /code
// .devcontainer/devcontainer.json
{
    "workspaceFolder": "/code",
}

この設定をしておくと、Remote-Containers: Reopen in containerしたときのカレントディレクトリがソースを配置したフォルダとなります。

VSCode拡張機能

Remote Container上でもVSCode拡張機能が利用可能です。

利用するには、拡張機能の...

f:id:kic-yuuki:20200623215511p:plain

赤枠部分をextensionsに記載します。以下設定例です。

// .devcontainer/devcontainer.json
{
    "extensions": [
        "ms-python.python",
        "atisteo.vscode-django",
        "bibhasdn.django-snippets",
        "bibhasdn.django-html",
        "editorconfig.editorconfig",
        "donjayamanne.githistory",
        "eamodio.gitlens"
    ],
}

docker-compose.yml

今回はサーバー等を起動しないため、コンテナ起動後に即終了してしまいます。(Remote Containerもできない状態)

コンテナを起動し続けるため、ttyを有効にします。

# docker-compose.yml
version: '3'
services:
  python_remote:
    tty: true

おわり

以上になります。

自分のためのメモですが、参考になれば幸いです。

じぶん Release Notes ver 0.30.7

f:id:kic-yuuki:20200612230427p:plain

気づけば30歳も後半戦。

6月半ばになってしまいましたが、2020/05の取り組みの成果を書いていきます。

先月分はこちら -> じぶん Release Notes ver 0.30.6 - zackey推し

  • 学んだこと
      • 読書中
      • 完了
  • 勉強会・コミュニティ
  • プライベート
    • トピック(出来事)
      • 3回目の転職
    • 記事(じぶんリリースノートを除く)
    • PV数
  • Challenge Every Month
    • 2020/05の結果
    • 2020/06の目標
  • おわりと所感
続きを読む

【AngularJS】$resourceのカスタムメソッド、DELETEを扱う場合の注意

AngularJSとは、Angularの古いバージョンを指します。詳しくはWikiの「AngularとAngularJSの違い」を参照してください。(以下、一部抜粋)

2012年6月にリリースされたバージョン1は「Angular 1」や「AngularJS」と呼ばれており、その後、2016年9月にリリースされたバージョン2は「Angular v2」または「Angular2+」と呼ばれていた。ただし、後述の通りバージョンリリースサイクルが早いため、バージョン2以降は単に「Angular」と呼ばれるようになった。

  • この記事に書くこと
  • カスタムメソッド
  • DELETEメソッドの場合、Bodyを送信できない
  • おわり
    • 所感
続きを読む