自動化無しに生活無し

WEB開発関係を中心に備忘録をまとめています

  • JavaScript(jQuery)で神経衰弱
    canvas未使用、JavaScript(jQuery)で神経衰弱を作ってみた。 突貫で作ったためかなり雑ではあるが、トランプを使用したゲームに流用できそうだ。 デモページ カードの素材は ( https://opengameart.org/content/playing-cards-vector-png )より。ウラ面は自前で作った。 https://seiya0723.github.io/memory_cards_game/ ソースコード https://github.com/seiya0723/memory_cards_game HTML <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>Hello World test!!</title> <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> <script src="script.js"></script> <style> img { width:200px; } </style> </head> <body> <table id="table"></table> </body> </html> JavaScript window.addEventListener("load" , function (){ // カードの画像: https://opengameart.org/content/playing-cards-vector-png //カードのデータ形式 var CARD_DATA = [ { "number":1,"src":"img/ace_of_clubs.png" }, { "number":1,"src":"img/ace_of_diamonds.png" }, { "number":1,"src":"img/ace_of_hearts.png" }, { "number":1,"src":"img/ace_of_spades.png" }, { "number":2,"src":"img/2_of_clubs.png" }, { "number":2,"src":"img/2_of_diamonds.png" }, { "number":2,"src":"img/2_of_hearts.png" }, { "number":2,"src":"img/2_of_spades.png" }, { ...
    続きを読む

  • Sendgridのアカウントが一時的に凍結された場合の対処法と対策
    • 作成日時:
    • 最終更新日時:
    • Categories: インフラ
    • Tags: sendgrid tips
    某日、Sendgridからメールが届く。内容は下記。 Dear Twilio SendGrid Customer, Your Twilio SendGrid account has been temporarily suspended as we have detected that your account's credentials (password and/or API key) are publicly listed on the code repository GitHub. This is a dangerous practice which may result in your account being used by unauthorized third parties to send malicious content and which may incur damage to your reputation as a quality sender and charges against your account for high usage that you did not perform. Before you ask for your account's reactivation, please ensure that you: 1) Change your account's password: https://sendgrid.com/docs/ui/account-and-settings/resetting-your-username-and-password. If your account was created using Heroku or IBM BlueMix, you must use our password reset form. 2) Delete and update exposed API keys in your account [APIのID] : https://sendgrid.com/docs/ui/account-and-settings/api-keys/#delete-an-api-key 3) Enable two-factor authentication for your account 4) Remove your account credentials and API keys from any public listings on code repositories or associated comments on sites such as GitHub or BitBucket. Please see the following link(s) for locations where your credentials ...
    続きを読む

  • 【Django】settings.pyのINSTALLED_APPSにはどのように書くのが適切か【順番とapps】
    公式の書き方 Django公式によると、下記のように書くのが適切。 INSTALLED_APPS = [ "bbs.apps.BbsConfig", 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', ] 参照元: https://docs.djangoproject.com/ja/4.0/ref/applications/#configuring-applications 一部媒体における書き方 一方で一部の媒体では以下のように書かれてある。 INSTALLED_APPS = [ "bbs", 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', ] どちらが正しいのか？ bbs/apps.pyにて、下記のように仕立てる。 from django.apps import AppConfig class BbsConfig(AppConfig): default_auto_field = 'django.db.models.BigAutoField' name = 'bbs' verbose_name = "簡易掲示板" これは管理サイトで操作するモデルの一覧を表記する際、verbose_nameを追加 ...
    続きを読む

  • 【Django】ユーザー作成時に何らかの処理を行う方法【saveメソッドオーバーライド】
    カスタムユーザーモデルを使用している時、ユーザーアカウント新規作成時に何らかの処理を行って欲しい場合。 そういう時はSignupFormのsaveメソッドをオーバーライドする。 SignUpFormのコード from django.contrib.auth.forms import UserCreationForm from .models import CustomUser class SignupForm(UserCreationForm): class Meta(UserCreationForm.Meta): model = CustomUser fields = ("username") def save(self, request, commit=True, *args, **kwargs): #ユーザーモデルのオブジェクト作成(ただし、保存をしない) user = super().save(commit=False) #生のパスワードをハッシュ化した上で、モデルオブジェクトの属性にセットする。 user.set_password(self.cleaned_data["password1"]) #保存す ...
    続きを読む

  • UbuntuにWordpressをインストールする【MariaDB+Apache】
    手元のPCにWordpressをインストールして試したいが、OSに直にインストールするのは避けたい。 そういう時、VirtualBoxにインストールしたUbuntuへ、Wordpressをインストールすると良いだろう。 流れ Apacheのインストール MariaDBのインストールとDB・ユーザーの作成 PHPのインストール Wordpressのインストール Apacheのインストール インストール sudo apt install apache2 自動起 ...
    続きを読む

  • JavaScript(jQuery)でQRコードを表示させる
    例えば、ユーザーの一部がPCでの操作をやめて、スマホで操作したいと思ったとする。 こういう時QRコードを表示させる、ブラウザのアドオンや機能を使えば良いが、ユーザーにそれを強いるのはやや酷である。 そこで、jQueryを使用して、QRコードを簡単に表示させると良いだろう。 コード <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>Hello World test!!</title> <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.qrcode/1.0/jquery.qrcode.min.js"></script> <script> window.addEventListener("load" , function (){ let qrtext = location.href; let utf8qrtext = unescape(encodeURIComponent(qrtext)); $("#qrcode").html(""); $("#qrcode").qrcode({width:160,height:160,text:utf8qrtext}); }); </script> </head> <body> <div id="qrcode"></div> </body> </html> 動かすとこうなる。 結論 下記を参照。 https://github.com/jeromeetienne/jquery-qrcode ...

  • 【Django】context_processorsを使い、全ページに対して同じコンテキストを提供する【サイドバーのカテゴリ欄、ニュース欄などに有効】
    以前は、ビュークラスの継承を使ったり、MIDDLEWAREでリクエストオブジェクトを操作したりすることでテンプレートに対してデータを提供していたが、これではやや無駄が多い。 Djangoにはcontext_processorsという、任意の処理を行った後contextを追加できる便利な機能があるので、こちらを使う。 context_processorsを作る まず、アプリディレクトリ内部に、custom ...
    続きを読む

  • 【Django】モデルクラスのfilterメソッドで検索・絞り込みをする
    モデルクラスを使用してデータをDBから取り出す時、filterメソッドを使用することで、取り出しの条件を指定することができる。 完全一致の場合(=) =を使用することで完全一致のデータを取り出すことができる。 topics = Topic.objects.filter(id=3) 主キーに対して、=を実行した時、取り出されるデータは1個もしくは0個になる。 そのため、上記のやり方だとforループしなければ、データを取り出すことができない for topic in topics: print(topic) そこで、単一のモデルオブ ...
    続きを読む

  • 【Django】ファイルアップロード時にファイル名をリネーム(改名)する
    方法論として、2つある。ビューから書き換える方法と、モデルに独自のバリデーションを仕込む方法の2つである。 ビューからファイル名を書き換える request.FILES["image"].nameから書き換えができる。 request.FILES["image"].name = "test.png" form = TopicForm(request.POST,request.FILES) # 以下略 # request.POSTに対しては書き換えできないが、何故かFILESに対しては書き換えできる。 もしちょっと気持ち悪いなと思う場合は下記にすると ...
    続きを読む

  • 【Django】アップロードするファイルサイズに上限をセットする【validators】
    本記事ではアップロードするファイルサイズに上限をセットする方法を解説する。 ただし、ビュー側にファイルサイズの上限をチェックする機能を実装させるのではなく、以前紹介した、『【Django】models.pyにて、オリジナルのバリデーション処理を追加する【validators】【正規表現が通用しない場合等に有効】』を元に実装させる。 ビューに判定機能を実装させる方法でも問題はないが、投稿するビューが二分 ...
    続きを読む