diadia

興味があることをやってみる。自分のメモを残しておきます。

vue Dialogを作ってみる

ポイント: CSSの要素を使うことでダイアログを実装する事ができるってことをしっておくこと。z-indexを使えば良いことさえわかればあとはボタンの制御の問題へ置き換わる。 参考にさせていただいた資料: vue.js モーダルウィンドウ実装でコンポーネント理解…

動的コンポーネントを試してみる

動的 & 非同期コンポーネント — Vue.js 動的コンポーネントはisを使ってコンポーネントを切り替えて使う。 サンプルコード # Home.vue <template> <div class="home"> <img alt="Vue logo" src="../assets/logo.png"><br /> <button @click="onClickChangeComponent">コンポーネントを切り替える</button> </div></template>

propを使う

PROPを使う場面 propを使ってみたのでコードを残しておく。 propは親コンポーネントから子コンポーネントにデータを渡したい時に使われる。 親コンポーネント内にコンポーネントを記述している場合書かれているコンポーネントを子コンポーネントという。 # …

エラー:error Type string trivially inferred from a string literal, remove type annotation @typescript-eslint/no-inferrable-types

エラー内容 error Type string trivially inferred from a string literal, remove type annotation @typescript-eslint/no-inferrable-types エラーが出たコード import { Component, Prop, Vue } from 'vue-property-decorator'; @Component({}) export de…

npmのショートカットコマンドを作る

package.jsonにscriptsがある。ここに追加や修正することで好きなコマンドを作る(ショートカットを作ることができる)。 // package.json { "name": "my-project", "version": "0.1.0", "private": true, "scripts": { "serve": "vue-cli-service serve", "…

typescript 型の判定方法

typescriptは静的型付け言語なので、型を意識さざるを得ない。 例えばユニオン型で2つの異なるクラスを定義した場合、そのインスタンスはクラスによって使えるプロパティが変わる。 ていうことで、型を判定する条件分岐と判定する方法が重要になるらしい。 …

セッターゲッターについて

まずアクセス修飾子について アクセス修飾子はクラスを基準としてアクセスできるかどうかを定めるものと考えると良い。 class Person{ public name: string; constructor(name: string){ this.name = name; }; } let mario = Person("mario"); mario.name = …

typescriptコンパイラの設定について

udemyの超TypeScript入門 完全パック(2021)の内容をメモしている。とてもわかり易いのでおすすめ。 コンパイラの設定方法 watchモードを使って、保存時に自動的にTSからJSにコンパイルする方法 tsc --initコマンドでtsconfig.jsonを作り、すべてのファイルを…

djangoのインテリセンスを有効化する

参考: https://kic-yuuki.hatenablog.com/entry/vscode-python-autocomplete この方の記事が分かりやすかった。 djangoをvscodeで書く際にインテリセンスを働かせる。 visual studio code のルートディレクトリ(プロジェクト)に.vscode/settings.jsonを作…

typescriptのメモ

typescriptの特徴 Detecting errors in code without running it is referred to as static checking. Determining what’s an error and what’s not based on the kinds of values being operated on is known as static type checking. TypeScript checks a…

カスタムディレクティブを使う

ドキュメント カスタムディレクティブ — Vue.js 作り方概要 以下2つのステップで実装する。 カスタムディレクティブを定義し、カスタムディレクティブを適用したい要素に設定する。 カスタムディレクティブを定義する カスタムディレクティブを定義する方法…

javascript DOM操作でcssを変更する

DOM操作の一つとしてcssを変更する。 pタグのcssのborderを"solid black 2px"に変更したい場合は要素のstyleプロパティにアクセスして変更すれば良い。 てことで、要素の取得する。その要素のプロパティを変更する。このステップを踏めば良い。 <p id='practice'>styleを変更</p>…

vueのプロジェクト始め方(vue-cliを使って)

1. Vue cliをインストールする npm install -g @vue/cli vue --version 2. 新規プロジェクトの作成 #vue create プロジェクト名 vue create myproject プロジェクトを作る際に出てくるbabel, vuexについて - babelはトランスパイラ。 - Vuexは状態管理を行う…

SQLITE3のINSERT文を動的に作成する。

sqlite3のインサート文は文字列である必要がある。 文字列であるがゆえにダイナミックなインサートは実行しづらいが、 辞書型のデータをもとにインサート文を作成する事ができる。また同一の辞書型データからインサートの値であるタプルを作成できる。 だか…

Seleniumを使う際のメモ(改訂版)

困ったときの参照ページ Python + Selenium で Chrome の自動操作を一通り Selenium の API (Official) Selenium with Python 使用準備 まずseleniumを扱う環境を作成した。anacondaを利用して環境を設定した。 conda create -n selenium python=3.6.4 pip i…

VisualStudio Codeでエディタとターミナル間の移動をショートカットキーに登録する

参考 統合ターミナルウィンドウへフォーカスするショートカットキーを設定する - Qiita Ctrl+;でエディタ-ターミナル間を移動する(VSCode) 前提 前提としてショートカットキーを登録するには、ショートカットキーを登録するファイルが存在するので、そのファ…

Djangoのpermissionを付与するサンプルコード

基本的なmodelに基づくpermissionは自動的に作成される。ということで、permisson自体は作らず、作成されているpermissonを付与するサンプルコードを書く。 permissionを付与するにはUserに直接付与するケースとGroupに付与し、そのGroupに属するUserが間接…

gunicornについて

テーマ アプリケーション・サーバー間やりとり PythonではアプリケーションとWebサーバのインタフェースとして PEP3333 で定義された WSGI(Web Server Gateway Interface)という仕様が広く利用されているらしくgunicornについて全く分かっていないので少し理…

APIViewのpermission_classesはどんな仕組みで動いているのか

APIViewのプロパティは以下の通り。 # APIViewのプロパティ class APIView(View): # The following policies may be set at either globally, or per-view. renderer_classes = api_settings.DEFAULT_RENDERER_CLASSES parser_classes = api_settings.DEFAUL…

django permissonでリソースを制御する

webアプリの場合、認証する->認可するの流れをたどる。 この認可されたパーミッションにしたがってリソースのアクセス制御を実施したい。 djangoの場合どうすれば実装できるか? 下準備 Userオブジェクトにパーミッションを付加する Groupオブジェクトにパー…

email認証する方法

一つはUserモデルを自分で作成する方法。 もう一つは認証バックエンドにemailで認証するバックエンドを実装して、settings.pyでそれを使う宣言する方法。 後者を最近試してできたので時間があれば詳しく書きたい。 要点だけまとめておく。 1.備え付けのdjang…

pipenvを使ってみる

ドキュメント Pipenvの基本的な使い方 — pipenv 2018.11.27.dev0 ドキュメント 前提 os ... macos python... anacondaではなくbrewでインストールしたpython インストール brew install pipenv 仮想環境作る pipenv --python 3.8 # 3.8でも3でよい。指定した…

APIViewのauthentication_classesとpermission_classesについて分かったところまで。。。

DRF

書きかけ。。。 APIViewのオリジナルコード django-rest-framework/views.py at master · encode/django-rest-framework · GitHub # APIViewのプロパティ class APIView(View): # The following policies may be set at either globally, or per-view. rende…

djangoログイン時にクッキーにセッションIDをセットする仕組みを見てみたのでメモ

まず認証 認証はユーザーが誰であるかを特定するものである。そのためクレデンシャル情報を用いて認証を行う。 クレデンシャル情報は種類がある。 ユーザーの記憶によるもの(something you know) ユーザーが所有しているもの(something you have) ユーザーの…

authtokenをrestframeworkだけで実装して観察してみる

昔Token認可で実装したことがあるけど、rest-authを使って実装したのでライブラリを使わないで試してみる。 ドキュメント https://www.django-rest-framework.org/api-guide/authentication/#tokenauthentication settings.py まず、Tokenで認可させたい場合…

cookieやlocalStorageを操作するには?

アンドロイドアプリを作る場合はアプリのストレージ領域に暗号化したTokenを保管し、通信を行うときだけそれを引っ張り出してリクエストヘッダにセットして通信を行っていた。クライアントがブラウザの場合にはブラウザに保存するのでどうやって保存して取り…

djangoのキャッシュを使ったセッションの設定

ドキュメント: https://docs.djangoproject.com/ja/3.1/topics/http/sessions/#using-cached-sessions https://docs.djangoproject.com/ja/3.1/topics/cache/#django-s-cache-framework 手順 1 . 概要 今回memcachedにデータを保存するセッション方式の実装…

vscode 使い方メモ

ショートカットキーを使ってエディタとターミナルを移動する設定 https://torajirousan.hatenadiary.jp/entry/2021/01/13/170804 デバッグモード 最近デバッグモードの使い方が分かってきた。 自宅でも使えるように設定する際に調べたことを記録しておく。 …

vuexのメモ

コンポーネント間のデータの受け渡しについて。 コンポーネント間のデータの受け渡しの方法はいくつか方法があることがわかった。 props, emitを使った方法。 vuexを使った方法。 vuexを使った方法を考える。 コンポーネント間の通信:もうコンポーネントじ…

チーム開発で使うgitについて

プログラミングを始めてあと少しで3年になりますが、がっつり開発をやっている会社につとめるのは今回が初めてでgitによるチーム開発について分かったことを少しまとめる。 ブランチの扱い 自分の勤める環境では、master, dev, featureというブランチが存在…