taisablog

taisa's engineer blog

スクリーンショット 2019-06-18 17.00.56

投稿日:

-

執筆者:

関連記事

no image

Vue.js+TypeScriptで外部APIを使ったTODOリストを作ってみた

Vue.jsで外部APIを使ったTODOリストを作ってみた に続き、それのTypeScript版を作ってみました。TODOリスト用のAPIは以前書いたこちらのAPI「Go言語 GORM+GinでTODOリストのAPIを作ってみた」を利用します。CORSを全て許可しているのでどこからでも叩けるようになっています。TypeScriptを書くのは今回が初めてなので、誤っている箇所やもっとよい書き方などがあれば指摘して頂ければと思います。 できたもの できたものはこちらです。http://vuejs-ts.taisablog.com/todo <div class=”graybox”> <div class=”clearfix”><figure><a href=”http://52.196.213.4/wp-content/uploads/2019/08/063dff08aea69d0ee7c6cea19de29030.png”><img class=”alignleft size-full wp-image-1684″ src=”http://52.196.213.4/wp-content/uploads/2019/08/063dff08aea69d0ee7c6cea19de29030.png” alt=”” width=”600″></a></figure></div> </div> APIのエンドポイント APIのエンドポイントは以下としました。 URL http://gin.taisablog.com/api/v1/ GET /todo // 一覧表示 POST /todo // 新規作成 GET /todo/:id // 編集画面表示 PUT /todo/:id // 編集(今回未使用) DELETE /todo/:id // 削除 プロジェクト作成 vue-cliを使ってプロジェクト作成をしました。プロジェクト作成のコマンドを打つと、色々と聞かれますが、TypeScriptを利用する為にManually select featuresを選択し、TypeScriptをONにします。ここではRouterもONにしました。 % npm install -g @vue/cli % vue create my-project default (babel, eslint) ❯ Manually select features vue-cliでできたプロジェクトのsrc配下の構成は以下となっています。今回はそこにTodo.vueとTodoList.vueを追加して実装しました。views配下で実装するだけでも大丈夫ですが、今回はあえてviews/Todo.vueからTodoList.vueコンポーネントを呼び出す形としました。 . ├── App.vue ├── assets │   └── logo.png ├── components │   ├── HelloWorld.vue │   └── TodoList.vue ← 新規追加 ├── main.ts ├── router.ts ├── shims-tsx.d.ts ├── shims-vue.d.ts └── views ├── About.vue ├── Home.vue └── Todo.vue ← 新規追加 views/Todo.vue TodoList.vueコンポーネントを呼び出します。 …

no image

AWS LightsailでVirtual Hostするメモ

AWS Lightsailにwordpressを移行して、LightsailでVirtual Hostを利用したいと思ったけど、bitnami、Apacheということでどこになにがあるかわからず調べたのでメモ。 bitnamiのApache設定 /opt/bitnami/apache2/conf/bitnami/bitnami.conf この中で bitnami-apps-vhost.conf が Include されている Include “/opt/bitnami/apps/wordpress/conf/httpd-vhosts.conf” /opt/bitnami/apache2/conf/bitnami/bitnami-apps-vhosts.conf には wordpress の httpd-vhosts.conf が Include されている Include “/opt/bitnami/apps/wordpress/conf/httpd-vhosts.conf” wordpressのprefixにはDocumentRootが記述されている Include “/opt/bitnami/apps/wordpress/conf/httpd-vhosts.conf” /opt/bitnami/apps/wordpress/htdocs/sampleのようにhtdocsの配下にディレクトリを作成してindex.htmlを置き、sample.taisablog.com ドメインにDNS設定を追加してあげればとりあえず、VirtualHostが追加できる <VirtualHost *:80> ServerName sample.taisablog.com DocumentRoot “/opt/bitnami/apps/wordpress/htdocs/sample” Include “/opt/bitnami/apps/wordpress/conf/httpd-app.conf” </VirtualHost> Apache再起動 sudo /opt/bitnami/ctlscript.sh restart apache

Go言語 GORM+GinでTODOリストを作ってみた

前回の「Go言語 ORMライブラリ GORMの使い方」に続いて「GORM+Gin」でTODOリストを作ってみました。使い方は「GitHubのREADME」を参考にしました。できたものは下記URLから確認できます。装飾は別途やれればと。 http://gin.taisablog.com/todo 事前情報 Webフレームワーク:Gin (https://github.com/gin-gonic/gin) ORM:GORM (https://gorm.io/docs) DB:MySQL ルーティングは通常のフォームだとPUT/DELETEが使えないので以下のようにしました。 [GIN-debug] GET /todo –> main.main.func1 (3 handlers) // 一覧表示 [GIN-debug] POST /todo –> main.main.func2 (3 handlers) // 新規作成 [GIN-debug] GET /todo/:id –> main.main.func3 (3 handlers) // 編集画面表示 [GIN-debug] POST /todo/edit/:id –> main.main.func4 (3 handlers) // 編集 [GIN-debug] POST /todo/delete/:id –> main.main.func5 (3 handlers) // 削除 main.goだけで作成した場合 main.goに全ての処理を記述しています。 package main import ( “github.com/gin-gonic/gin” “github.com/jinzhu/gorm” _ “github.com/jinzhu/gorm/dialects/mysql” “net/http” “strconv” ) type Todo struct { gorm.Model Text string Status uint64 } func main() { db, err := gorm.Open(“mysql”, “gorm:gorm@/sandbox_gin?charset=utf8mb4&parseTime=True&loc=Local”) if err != nil { panic(“データベースへの接続に失敗しました”) } defer db.Close() db.LogMode(true) db.AutoMigrate(&Todo{}) r := …

no image

平成最後にEvernoteの昔のエモい感じのメモ達を供養する

今年、持ってる本をすべてリサイクルに出した。そして今や自分の荷物はほとんどないと言っていいくらい無くなった。情報も整理したくなったのでとりあえずEvernoteに残ってるよくわからないメモ達も消してみた。すると昔悶々としてたんだな〜みたいなメモが見つかった。折角だからそんな昔のエモい感じのメモ達をさらしてから削除する。 SI会社に残らない理由 近い将来移民が大量に入ってくる その頃には課長または部長になっている程度 エンジニアとして対応できるようになってたい 求心力がない 名前だけでかくて組織が時代についていけていない 40代以上の人間がぎりぎり、50代以上の人間は定年を待つばかり 使えない派遣が集まる 会社自体に魅力がない 優秀な人材は入ってこないし出ていく 君がオヤジになる前に 一週間に一本アプリリリース モテル 家を持つリスク 結婚するリスク オヤジ化が加速する 子供にいい思いをさせることはそこまで必要か 狭い家に住んでいた時代も経験していてよいのでは? そのような体験が逆にうらやましかったこともある。 情報量 突き抜けること 保険には入らない 何十年先のことを憂う必要があるのか 気持ち悪い昔からの風習がある 昔の美徳は今の美徳ではない 英語はのりで 君がオヤジになる前に 「君がオヤジになる前に」という本を読んだ時のメモとその時に感じがことが書いてあると思われる 『今はまだ』という呪文 起業時代 今はまだ実力がないから というがその気になれば実は一週間または一ヶ月死ぬ気でやればそれなりに戦える実力がつくのではないか そういう人間に限って本を買って終了ということがほとんど 何年かすればそれなりにできる自分になっていると思い込んでいる SIer時代 同様に人材派遣をするSE業界でも、 今はまだ我慢してやってくれ。 そのうち景気が上向きになるときを待つ 今はまだ動き時でない ではいつなのか? 周囲の人たち、親 今はまだやめとけ とりあえず大手に入っておけ 『今はまだ』と『とりあえず』のダブルパンチ とりあえずといって何十年も経過していくのが目に見えている そしてかぶせるようにサラリーマンは我慢だと 戦わない人が多すぎる Noと言えない日本人ニアルイコール ただNoと言う必要があるのではなく、交渉しよう、戦おう 日本の政治も同様 いいカッコしいはやめよう どうせいいカッコするのであれば我慢はやめよう、戦う姿を見せよう 部下に迷惑がかかる さされそうになったら必死で抵抗するだろう 上司だろうが客であろうが頭が上がらない人であろうと関係ない 交渉しよう 交渉することを楽しもう 恋愛もそう 後からでは遅い、そのとき戦わなくては その為に準備している必要があるだろう また、急に戦場にたたされ先制攻撃を受けてしまったら 一旦保留して戦略を練ろう 体制を整えよう 少しだけでも有利にしよう 常に先制攻撃ができるようにしよう リスクを回避しよう 最悪の事態を避けよう アラームをあげよう 人生の命題 世界中でアプリケーションを作る 世界をアプリケーションを作りしながらまわる 超解釈 変化に対応していく対応力 対応していくしかない 変化は能力のあるひとがやるのさ 他にはないものをつくる もしくは他にあるもののコピーをつくる 無題ノート ふけとか、衰えとか、関係、かいもん、ねー! いずれのメモも平成22年〜26年くらいに書かれたメモだった。 平成最後にこれらのメモ達をここに供養します。

Python Bottleのソースを読む 起動編

Pythonの軽量WebフレームワークBottleのソースを読む 起動編 Bottleとは Bottle is a fast, simple and lightweight WSGI micro web-framework for Python. It is distributed as a single file module and has no dependencies other than the Python Standard Library. Pythonの軽量Webフレームワークで、特徴はシンプルで早く、Pythonの標準ライブラリにも依存していないWebフレームワークであることとフレームワーク本体が1ファイルで構成されていることである Class Hierarchy Doxygenを使って出力した図Bottleは1ファイルながら中でそれぞれのクラス、主にServer、Templateが継承関係にあるのがわかる(コード量は4000行位)。ServerやTemplateクラスはたくさんあるが実際はその中のどれかを選択して利用する形となる 起動 Bottleの起動はrun()を呼び出す方法とコマンドラインインターフェースを使う方法が用意されている run()を使う方法 以下のように記載し起動することでサーバが立ち上がる from bottle import run, route @route(‘/’) def index(): return ‘Hello World’ run(host=’localhost’, port=8000, debug=True) コマンドラインインターフェースを使う場合 以下のコマンドで起動可能 # コントローラを指定 python -m bottle ‘package.controller’ # 説明は省略するが明示的にアプリを指定することも可能 python -m bottle ‘package.controller:app’ controller.py # runは不要 from bottle import ,route @route(‘/’) def index(): return ‘Hello World’ 起動処理を確認する コマンドラインインターフェースを使う場合 mainが2箇所あるが、これはサーバアダプダに必要なライブラリを必要としているからで、1つ目のmainでまずサーバアダプタに必要なライブラリを読み込み2つ目のmainでサーバが起動される仕組みになっている run()でサーバを起動する run()では、渡された引数の値をそれぞれ読み込んだあと最後にServerAdapterのrun()を呼び出している。Bottleでは多くのサーバをServerAdapterを継承することでサポートしており、指定されたサーバを起動するようになっている。指定しない場合はwsgirefがデフォルトで呼ばれる。また、appパラメータは特別指定しなければ、内部で自動的にdefaultが使われるので特別指定する必要はない。 サーバをロードするまで処理を追ってみる まず、Bottleでサポートしているサーバは以下のように宣言してある。 server_names = { ‘cgi’: CGIServer, ‘flup’: FlupFCGIServer, ‘wsgiref’: WSGIRefServer, ‘waitress’: WaitressServer, …