diadia

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

djangoとvuejsをcdn以外の方法で共存させる

npmにvueを入れて構築する方法を試みる。djangoはdjango rest frameworkを使う。 今回気になる事項は、 どうやってdjangoとvueをcdn以外の方法で共存させる環境を構築するのか どういう仕組でdjangoとvueが連携する仕組みになっているのか vueを使うにあたり…

typescriptのみで構築してみた

webpackやnpmの仕組みを分かっていないので一番シンプルな構成でtypescriptを実装する方法を試してみる。 参考資料 以下を記事に従って環境を構築してみた。プロジェクト名はsssとして作成してみた。 最新版TypeScript+webpack 5の環境構築まとめ(React, Vue…

npmに関して分かったこと

右も左も分からないnpmについて少しずつ試してみて分かったことを書き溜める。 パッケージのバージョンを変更をする 1 package.json内のパッケージのバージョンを編集する。 $ vi package.json 2 変更を反映する $ npm update npm install について npm inst…

webpackに関するメモ

webpackのバージョン確認方法 $ ./node_modules/.bin/webpack -v webpack-cli 4.1.0 webpack 5.2.0 webpackのバージョンはどうやら3と4系でwebpack.config.jsで書き方が変わるらしい。 webpack4に更新した時にこけた所まとめ - Qiita

npmのpackage.jsonについて分かったこと

package.jsonには、scripts項目が存在する。 どんなものか? これはnpm runコマンドのあとに続行するコマンドを定義することができるようになる。 $ npm init 言うまでもないが、上記のコマンドを実行するとそのディレクトリにpackage.jsonというファイルが生…

typescriptメモ

基本の型(Basic Types, Primitive Type) TypeScript: Handbook - Basic Types Boolean Number String Array Tuple Enum Unknown Any Void Null and Undefined Never Object アロー関数の戻り値の型定義について理解していない。 環境構築 書いたtypescriptを…

バックエンドでKotlinをさわる

お世話になった本は以下。 入門!実践!サーバーサイドKotlin (技術の泉シリーズ(NextPublishing)) | 横山 恭大 | 工学 | Kindleストア | Amazon androidアプリケーションでKotlinは使っていたけれども、主戦場にしたいバックエンドでKotlinが使えてないの…

応用情報技術者試験の参考書を読むのメモ

掛け算とか割り算はどうやって実現しているか? -> シフト演算を使って掛け算や割り算を行っている。 シフト演算...ビットの並びをまとめて左にずらしたり、右にずらしたりすることで元の値の2倍や1/2倍という計算を実現している。 テストケース設計手法: 同…

みんなのコンピュータサイエンスを読んでみたときのメモ

**通読2回目 一回目では何を言っているのかほとんど理解できなかった。したがって読書で調べたこと、メモを残しておく。 第1章 「プールが温かければ、私は泳ぐ」の意味は、私は温水でしか泳がない、を示すわけではない。「冷たいプール」に関しては何も保証…

AWS: Error creating VPCが出た

aws

terraform applyを実行した結果以下のエラーが表示された。 Error: Error creating VPC: VpcLimitExceeded: The maximum number of VPCs has been reached. status code: 400, request id: c5e55b9d-d44d-437b-bcd3-2303794c1c46 stackoverflow 上記リンク先…

terraform 既存のリソースを使うことについて

今まで勝手に思ってたことにterraformでインフラを立ち上げるときには、terraform内でリソースを生成し、それを組み合わせて環境を作り上げないといけないと思っていた。 しかしながら一度作成したリソースを消さなければ再利用することができる事がわかった…

ECRにpushとpullを試みたときのメモ

ECSを使うためにはどうやらECRが必要だということが判明した。 ECRはdockerhubのようなdocker Imageのコンテナのリポジトリサービスであるようだ。 とりあえずpushとpullをできるようにしたい。 ドキュメントを読んでみると、ECRにpush, pullをするためには…

EC2インスタンスに複数のアパッチコンテナを起動して接続を試みる

今まで一つのサーバーにwebサーバーなどのソフトウェアが一つずつ入っている状況が自然なことだと考えてきたので、同じソフトウェアが同時に動く環境を用意し、いわゆるコンテナという概念を体感してみた。 方法としてはec2インスタンスにcontainerを3つ追加…

terraformを使えるようにする設定

IAMでterraformからインフラを作成するためのユーザーを作成する。 作成するとアクセスキーとシークレットキーが手に入るので、これを環境変数に加えておくこと。 さらにはデフォルトのリージョンも環境変数として定める。 vi ~/.bash_profile #追加 #Terraf…

基本の基本 EC2にssh接続する(復習)

コンテンツ マネージドコンソールを使ってEC2を立ち上げ、SSH接続を行う TERRAFORMから同じことを実現させる 一番最初の基本形としてEC2インスタンスを立ち上げて、ssh接続するまでをマネージドコンソールでどのようにセッティングすればよいかメモしておく…

djangoのcontextをjavascriptに渡す際に困る場合がある件

大した内容ではないので問題点と対処法を軽く書く。 djangoのcontextに格納したデータをjavascriptにわたす方法 最初にviewにてデータをcontextに格納する テンプレートにてjavascriptを走らせ、contextのデータを受け取る def example(self, request, *args…

leafletを使って以下が表示される。"This content should also be served over HTTPS."

問題は何なのか leafletを使っていて以下の内容がconsoleに表示される事になった。 Mixed Content: The page at '<URL>' was loaded over HTTPS, but requested an insecure image '<URL>'. This content should also be served over HTTPS. これは何を示しているかと</url></url>…

supervisorについてメモ

ドキュメント Supervisor: A Process Control System — Supervisor 4.2.0 documentation supervisorは何なのか? これはプロセス管理のツールである。 fabricを使った自動デプロイスクリプトを書いては見たもののgunicornのプロセスを切ってから新たに立ち上…

Djangoのformをより良く見せるために(改訂版)

Djangoにおいてformウィジェットの理解を深めない限り、forms.ModelFormやforms.Formの利用したとて、フォームを使った画面が残念な結果になってしまう。 見た目の良いフォーム画面を作るには htmlファイルを自ら作成して好みのformを作成する ModelFormやFo…

django ページネーションについて(改訂版)

ページネーションについて ページネーションは一覧表示させるオブジェクトを1ページ内にどれだけ分割して表示させるか。それに関わる技術のことのようだ。 関連ドキュメント ページネーション | Django ドキュメント | Django メモ djangoにおけるページネ…

cdnでvuetifyを使うために

軽く要点を残す。 djangoでincludeを使ってコンポーネント化できたのでテンプレートの見通しが良くなった。 cdnを使ってコンポーネント化するとvuecliを入れる前にどんな感じでvuetifyや単一ファイルコンポーネントが使えるか確認できる。(もちろん全く同じ…

nginxで403が返されるときに対応したこと

サーバー上に新しくディレクトリを作成し、そこを起点にgithubからpullを行いデプロイした際にうまく作動しなかった。 環境 centos7 nginx porstgresql django 症状: home画面のhtmlはサーバーから配信される。 home画面の静的ファイルの配信がうまく行って…

AWS学習メモ

知識の整理の方法をよく考えたい。 実現したい実装に対して、概念による実装方法があり、具体的な実装方法がある。 具体的な実装方法はコンソールによる具体的な実装方法とteraformによる実装方法である。これらの棲み分けを意識して分けてメモをしていきた…

fabricでデプロイするために得られた知見

まずfabricでできることはなにか? fabricでできることはshellスクリプトでもできる。シェルスクリプトが書ければfabricをあえて学習する必要ないと思われるが、fabricを使うのはpythonを使うので学習コストが低いし、pythonで書くのでコードの見通しが良く…

circleciのsshキーを登録する

circleciのコンソールにsshキー(秘密の鍵)を登録する事ができる。 しかしこの秘密の鍵はpem形式でなければコンソールでエラーが出てしまう。したがってpem形式のキーを別途作成し登録する必要があった。 手順; 1. pem形式の鍵を作成する 1. サーバーに公開鍵…

CircleCIのメモ

CircleCI環境変数について circleciの環境変数の定め方は2通りある。 一つはconfig.ymlで環境変数をハードコーディングで定める方法である。 もう一つはcircleciのコンソールで環境変数をキーとバリュー形式で登録しておき、config.ymlでキーを呼び出すこと…

vuexのコンポーネント間のデータ受け渡し方法

vuexのデータの受け渡しはvuexのドキュメントを読めばだいたいのことがわかる。 vuexはVue.js アプリケーションのための 状態管理パターン + ライブラリである。 重要なファイル 最初はApp.vueとstore/index.jsだけで済む。 <template> <v-app> <v-app-bar app color="primary" dark > <div class="d-flex align-center"> </div></v-app-bar></v-app></template>

dockerのvolumeがホストのどこにあるのか

Dockerのvolumeがホストのどこに存在するか知りたい。 docker-compose.yml内で以下のように記述することに関していままで自分が勘違いしていた。 db: image: postgres volumes: - postgres_data:/var/lib/postgresql/data <-コレ environment: - POSTGRES_DB…

docker nginxの基本的な使い方

dockerを触ってみて分かったこと。 dockerのコマンドを使ってimage作成やコンテナを実行する。 これとは別に、つまりdockerコマンドを使ってimage作成する代わりに、Dockerfileを作ってdocker buildコマンドを使うとimageを作成する事もできる。 ここに関し…

django vueを追加する

MPAでvueを使いたい。。。 色んな方法で実現できると分かった。 cdnを使う方法 vue cliを使う方法 vue cliを使わないで行う方法 最終的にはvue cliを使って構築するのがわかりやすいと感じた。cdnはもちろんかんたんだけれどもvuetifyを組み合わせて使う方法…