the dawn of yuriko hisory

アニメやら漫画関係で何か作りたいものと勉強したことのメモ用

Amazon Web Service 学習メモ①

DjangoAWS環境で作るための学習
AmazonWebServices 基礎からのネットワーク&サーバー構築の本を読んだので、学んだことをまとめ

システム構築について

インフラ知識を身に着けるメリット
  • 障害に対応できる
  • 堅牢なシステムを作成するためのコードを意識できる
サーバーの構築の流れ

1.LinuxWindows SeverなどのサーバーOSの設定

2.サーバーの用途に沿って必要なソフトウェアのインストール

Webサーバーなら『Apache』や『nginx』

ApacheはSpring等で組み込まれていたため知っていたがnginxは知らなかった
Djangoのデプロイ環境用に使用している人がいるみたいでqiita等で記事がいくつかあがってます

  • データベースサーバーなら『MySQL』など

※メールサーバーの存在自体を初めて知った

ネットワークの構成

1.IPアドレスを設定する
2.ルーターからデータが流れるように設定
3.DNSサーバーを設定

IPアドレスに対応するドメイン名をDNSサーバーに設定するらしい

例えばGoogle
IPアドレス:216.58.220.227
こちらで入力してもアクセスはできるけど
DNSサーバーで対応しているドメイン名として
https://www.google.co.jp/
となる

よくネットワークの接続がうまくいかないときにDNSキャッシュを削除しろ!みたいなのを見かけたけどDNSサーバーで取得してきたこの情報を消していたんですね

AWSの用語とサービス

リージョン

リージョン(Region)
Regionと書かれるとわかりやすい
データセンターの地域
日本で公開するなら東京リージョンがあるのでそちらを使用

Amazon VPC

IPアドレスの範囲を指定して、その中でのネットワークの構築ができる
この辺の設定はすごいインフラっぽい

Amazon EC2

Elastic Compute Cloud
仮想サーバー
LinuxとかWindows Sevrerなんかをこれで扱う
AWSっていうとイメージするのがこれな感じ

DjangoでミリオンライブキャラクターDB一応終了

今回作成物
GitHub - lilly-seventail/milliondb: 簡易ミリオンDB

終わり?

終わりです。
後は徐々に修正とアイドル達を増やしていきます。
Herokuあたりにでもデプロイはしようかとは思っています。
Model周りと個別ページの表示の仕方は修正します。
その他は気が向いたらです。

作成してみた感想

ほぼほぼDjangGirlsでやった内容で作れたんじゃないかなと
filterでの検索やImageFieldの扱いは調べながらになりましたがうまくいきました。

モデル1つと画面2つとだいぶ小規模になりましたが
自分の手で作るのはアウトプットとしてはやはり最適ですね。
今後も作りたいものがあれば作っていきます。

次やること

Django周りでいえばログイン処理だったりカスタムユーザーの作成なんかを勉強しておきたいです。
後は今回できなかったREST Frameworkを使ったものを作りたいですね。
今回勉強したことはそれなりにフルで使えた感じはするので、
しばらくまたインプットをしつつ、思いついたら何かを作っていきます。

DjangoでミリオンライブキャラクターDBを作成 ~検索処理作成~

現在までの完成形

https://i.gyazo.com/8ff55ceb5bc1e37f1249f487b0408c31.png

検索処理の説明

検索用のフォーム
from django import forms
from .models import Idol

class IdolForm(forms.Form):
    name = forms.CharField(label="名前")  //1

今回の検索フォームは名前での検索だけなので名前用のフィールドを作ってあげています。
ChoiceFieldとか使うと選択とかもできたり色々検索処理も色々と弄るのも楽しそう

検索用のView
def index(request):
    if request.method == 'GET': 
        form = IdolForm()
        idols = Idol.objects.all()
    elif request.method == 'POST': 
        form = IdolForm(request.POST) //1
        name = request.POST['name'] //2
        idols = Idol.objects.all().filter(name__contains=name) //3
    return render(request, 'mysite/index.html', {'idols' : idols, 'form' : form } )

1.検索用のフォームです。
ここでformにわざわざ指定しているのは、POST時の値を検索処理後に格納するためです。
IdolFormをGETとPOSTまとめて記述しておくと初期化されてしまいます。

2. request.POST['フィールド名']で該当のフィールドの値が取得できます。
名前に入れられた値をここに格納しておきます。

3.filter(name__contains=name)はフィルター機能を使っています
初めに検索処理を行うフィールド名のnameを指定して__(アンダーバー二個)をつけて
フィルターとして実行する処理を書いていきます。
今回は入力された名前に部分一致しているものを抽出したいのでcontainsを使用しています。
nameは漢字だけの検索になるので読み仮名でも検索したいとなった場合は
from django.db.models import Q
filter(Q(name__contains=name) | Q(yomigana__contains=name))
でいけます。

こちらのサイト様が参考になります。
thinkami.hatenablog.com

次やること

とりあえずあとは徐々に修正しつつでいいかなーと思っています。
APIJSON形式にしてViewModelを~とも思っていたのですが
結局やらずに作成してしまいました。
Ajax周りの処理とかも勉強しておきたいとは思っているのですが。

とりあえず今回はこれで完了ということで次また何か作ります。

DjangoでミリオンライブキャラクターDBを作成 ~メインページ初期表示の作成~

現在までの完成形

https://i.gyazo.com/fd1f311c1e4690d051d64529b00a8b7c.png

メインページのViewの説明

def index(request):
    idols = Idol.objects.all() //1
    return render(request, 'mysite/index.html', {'idols' : idols} )

1. 現状は初期表示に全件取得するだけを記述
この後検索処理用にPOSTメソッドと分ける必要があります。

メインページのテンプレートの説明

{% extends 'mysite/base.html' %}

{% block style %}
<style>
.img-over{            <!-- 1 -->
  transition: 0.3s;
}

.img-over:hover{
  transform: scale(2.2);
}
</style>

{% endblock style %}

{% block content %}

<form> <!-- 2 -->
  <label>名前:</label>
  <input type="text" name="name" />
  <button type="submit">検索</button>
</form>

<div class="col-md-12">
  {% for idol in idols %}
  <div class="col-md-1">
    <a href="{% url 'mysite:detail' pk=idol.pk %}"><img src="{{ idol.image.url }}" class="img-responsive img-circle img-over"/></a> <!-- 3 -->
  </div>
  {% endfor %}
</div>

{% endblock content %}

1.画像の背景が白なのでマウスオーバーしたときにわかりにくすぎたのでCSSでマウスオーバー用に書いています。
マウスオーバーしたときに画像が拡大されて表示されるようになっています。

2.今回は初期表示だけなので検索はべた書きしています。
実際は検索処理用にDjangoのforms.pyを利用していくことになると思います。

3.今回urlを渡すのに mysite:detailを利用しています。
最初のmysiteは
プロジェクトの方のurls.pyのnamespaceで指定したものです。
最初この指定してある値を間違えてて無駄に時間を取ってしまいました。

urlpatterns = [
    url(r'^admin/', include(admin.site.urls)),
    url(r'^', include('mysite.urls', namespace='mysite')), 
] 

こうして書いておくことでどのアプリケーションのどのViewを渡しているのかわかりやすくなっていいですね。

次やること

検索フォームの実装に入ります。

DjangoでミリオンライブキャラクターDBを作成 ~個別ページの作成~

現在までの完成形

現在までの完成形
https://i.gyazo.com/b980fabf75df0e29f5741060cff65f90.png

個別ページのViewの説明

def detail(request, pk):
    idol = get_object_or_404(Idol, pk=pk) //1
    return render(request, 'mysite/detail.html', {'idol' : idol} )

1. 基本通りにDBのプライマリキーからアイドルの情報を取得しています。
アイドルの名前から取得するように変更した方がURLとしてもいいとは思うのですが、
そこまでの必要性はないかなと思いデフォルトのpkにしています。

個別ページのテンプレートの説明

{% extends 'mysite/base.html' %}

{% block content %}
  <div class="row">
    <div class="image col-md-4">
      <img src="{{ idol.image.url }}" class="img-responsive"/> <!-- 1 -->
    </div>
    <div class="detail col-md-8">
      <table class="table table-bordered">
        <tbody>
          <tr>
            <td><strong>名前</strong></td>
            <td>{{ idol.name }}({{ idol.yomigana }})</td>
          </tr>
          <tr>
            <td><strong>誕生日</strong></td>
            <td>{{ idol.birthday }}</td>
          </tr>
          <tr>
            <td><strong>身長</strong></td>
            <td>{{ idol.height }}cm</td>
          </tr>
          <tr>
            <td><strong>声優</strong></td>
            <td>{{ idol.cv }}</td>
          </tr>
        </tbody>
      </table>
      <p class="h2">詳細</p>
      {{ idol.detail }}
    </div>
  </div>

{% endblock content %}

1. 前回モデルで作成したImageFieldのurlを使うと格納されているフォルダのアドレスをそのまま渡してくれるので
imgタグにそのまま入れるだけで表示ができました。

classのimg-responsiveはBootStrapのクラスで、
画像ファイルをレスポンシブ対応にしてくれています。
これのおかげで画像をレスポンシブにしてくれるので、表示がキレイにできます。

テーブル内の表記については、特別難しいことはしていなくて、
Viewから渡された値を表示しているだけです。

次やること

個別ページは現段階ではこの状態で完成形として
(他にやることといえばモデルの修正と実際のデータを入力するだけなので)
Indexページで初期表示に全件のアイドルを取得できるようにしてみましょう。

ゼロから作るDeep Learning 始めました。

ディープな世界へ

もともとAIに興味を持ってエンジニアとして働き始めました。
気が付けばそのためにPythonを始めたというのに
Python自体が好きになってDjangoで何か作ろうとかしている有様です。

もともとWEB側にも興味はあったので今の現状に不満があるわけではないのですが
やはり最終的な目標は自身でAIの作成です。
AIがってわけではなくかわいいアイドルたちを具現化したいだけですけどね。
そのための手段がたまたまAIだっただけです。

そんな話はさておき先週の土日からずいぶんと話題になって時間が経ちましたが
ゼロから作るDeep Learningを読み始めています。
数学の勉強をほぼしてこなかったため、数式をみると頭が…

目標としては8月14日にTensorFlowの本が出るのでそれまでに読み進めて
そこからTensorFlow本を読みふけりたいなーと思っております。

今後はブログでも書評を書いていくのもいいかもしれません。
読まないで積んである本を読むキッカケが欲しいです。

埼玉スーパーアリーナ

タイトルにまったく関係ありませんが、もう一週間後には埼玉スーパーアリーナでシンデレラガールズのライブがあります。
私は2日目の8月13日に参戦いたします。
最近はもっぱらミリオンPですが、やはりライブは楽しみです。
早く響子ちゃんに会いたいものです。

チケットが届いたのでテンションがあがってしまいこんな記事になってしまいました。
申し訳ございません。

DjangoでミリオンライブキャラクターDBを作成 ~モデルの作成~

アイドル用のモデルを作成


以下models.py

from django.db import models

class Idol(models.Model):
    name = models.CharField(max_length=50)
    yomigana = models.CharField(max_length=50)
    height = models.IntegerField()
    threeSize = models.CharField(max_length=20)
    birthday = models.CharField(max_length=20)
    cv = models.CharField(max_length=50)
    detail = models.TextField()
    image = models.ImageField(upload_to='images/')

    def __str__(self):
        return self.name

今回はアイドルDBなのでとりあえずそれっぽい情報だけ入れられれば良いです。
完成してから必要があれば3サイズ順に並べたい!とかになりそうなので
3サイズを分けて検索できるようにしたりとかまあ色々とごにょごにょしたくなりそうですが。

新たに学習したこととしては
ImageFieldでしょうか。
settings.pyの方で

MEDIA_ROOT = os.path.join(BASE_DIR, 'media') #追加
MEDIA_URL = "/media/" #追加

こいつらを追加して置くと、あとは管理サイトで画像を保存すると
/media/imagesに画像を置いてくれます。
非常に便利!だと思いきや、管理サイトに画像を表示しようとして手が止まっています。
後はフォルダに入ったはいいけどこれテンプレートからちゃんと取得できるのかな?といったところです。

管理サイト画像
https://i.gyazo.com/ac8d5e2bbbf2d023800d74e14444eeda.png


次やること

今回作るのは簡易的なデータベースなので
モデルさえできてしまえばあとは簡単な気がします。
画像さえ取れれば…
とりあえず次は個別ページを作って画像をしっかりと取得できるかを作成してみます。