自動化無しに生活無し

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

tips

  • Djangoの管理サイト(admin)をカスタムする【全件表示、全フィールド表示、並び替え、画像表示、検索など】
    admin.pyはとても便利ではあるが、ただのadmin.site.register([モデルクラス])ではとても使いづらい。 特にそのままでは管理サイト内で画像を取り扱ったり、複数のデータを参照したり、検索や絞り込みしたりすることはできない。 そこで、管理サイトをカスタマイズして使いやすくさせる。 コード 元コードは、Djangoで画像及びファイルをアップロードする方法から流用した。以下のようにmode ...
    続きを読む

  • 【django.core.paginator】一度に2ページ以上ジャンプできるように改良する【inclusion_tag()】
    以前のページネーション実装記事では、検索とページのパラメーターの両立を行った。 しかし、このページネーションは1ページずつしか移動できない。つまり、1ページ目の状態から2ページ目に行くことはできても、3ページ目にジャンプすることはできないのだ。 そこでページネーションを改良させ、一度に2ページ以上ジャンプできるように改良する。 やりたいことと方法論の解説 やりたいこと 要するに、本記事でやりたいのはこういう ...
    続きを読む

  • Djangoでviews.pyからmodels.pyのフィールドオプションを参照する【verbose_name,upload_to】
    需要ないかもだけど、備忘録として。 Video.thumbnail.field.upload_to つまり、 [モデルクラス].[フィールド名].field.[フィールドオプション] これで参照できる。 用途 FileFieldでアップロードした動画のサムネイル(ImageField)をviews.pyが自動生成する時、アップロード先のパスを指定する必要があるが、models.pyのフィールドオプションとして書いたupload_toと整合性を合わせるために、本記事で扱 ...
    続きを読む

  • Djangoでmakemigrationsコマンドを実行しても、No changes detectedと言われる場合の対処法
    Djangoでマイグレーションファイルを作る python3 manage.py makemigrations このコマンドを実行しても返ってくるのが、 No changes detected とされ、マイグレーションファイルが作られないことがある。当然この状態でmigrateコマンドを打ってもDBには反映されない。 そこで、本記事ではこの対処法について列挙する。 対処法1:settings.pyのINSTALLED_APPSに対象のアプリを追加 python3 manage.py makemigrations python3 manage.py migrate この2つのコマンドを打って、models ...
    続きを読む

  • Laravelで--resourceで作ったコントローラのルーティングを解体する
    例えば、コントローラーを以下のように作るとする。 php artisan make:controller TopicsController --resource これで、Restfulに必要なcreateやstore等のアクションが自動的に作られるのだが、後からアクションを追加削除しようとした時、ルーディングに追加削除をする必要がある。 その時、このように書かれてあると(注意:下記はLaravel7.x系のルーティング記法)、ルーティングの書き換えは難しい。 Route::resource('/topics', 'TopicsController'); そこで、本記事は--resourceで作 ...
    続きを読む

  • Laravelのプロジェクト名を書き換える【設定に依存していないのであれば、普通にディレクトリ名を書き換えるだけでOK】
    既存のLaravelのプロジェクトを、プロジェクト名だけ書き換えて編集する。 環境 Ubuntu 18.04 Laravel Framework 7.30.4 結論 下記コマンドでプロジェクトを作ったとする。 composer create-project --prefer-dist laravel/laravel [プロジェクト名] 上記コマンドで生成された[プロジェクト名]のディレクトリ名を書き換えれば良いだけの話である。 理屈 まず、プロジェクトを作った後、プロジェクトのディレクトリに移動して、下記コマンドを実行してもらいたい。 grep -rl "[プロジェクト名]&qu ...
    続きを読む

  • JavascriptからCookieを扱う【動画の設定音量の記録と読み込み】
    JavaScriptからCookieを扱う。これで、サイトのデータをユーザーのブラウザに保存できる。 Cookieにvideoタグで設定した音量情報を格納、読み込みするコード 実例を交えながら解説する。下記はvideoタグで指定した音量をCookieに記録する。 window.addEventListener("load" , function (){ const video = document.querySelector("video"); video.addEventListener("volumechange",(event) => { document.cookie = "volume=" + decodeURIComponent(event.target.volume) + ";Path=/single;SameSite=strict"; }); set_video_volume(); }); function set_video_volume(){ let cookies = document.cookie; console.log(cookies); let cookiesArray = cookies.split(';'); let volume = 0; for(let c of cookiesArray) { console.log(c); let cArray = c.split('='); if( cArray[0] === "volume"){ volume = Number(cArray[1]); console.log(volume); break; } } const video = document.querySelector("video"); video.volume = volume; } Cookie ...
    続きを読む

  • jQueryのコードをJavascriptに書き換える【セレクタ、属性値の参照、イベントなど】
    jQueryに依存したコードをそのままにするのは再利用性に欠け、開発効率にも関わる。そこで、今回はjQueryのコードを適宜javascriptに書き換える。 セレクタ まずは基本のセレクタ以下のように書き換える。 var test = $(".test"); //↓以下に書き換え var test = document.querySelectorAll(".test"); //←全ての.textクラスの要素を抜き取る var test = document.querySelector(".test"); //←.testクラスの1番最初の要素を抜き取る jQueryが提供するメソッドや属性などは使用できなく ...
    続きを読む

  • CSS3とHTML5だけでタブを作り、複数のページを表示させる【JS不要】
    例えば、こんなふうにタブでページを切り替えて表示させるフロント。 かつてはJSじゃないと成立しなかったが、今となっては、JS不要でCSS3とHTML5だけで再現できる。 コード まず、HTML。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>タブシステム</title> <link rel="stylesheet" href="style.css"> </head> <body> <input id="tab_radio_1" class="tab_radio" type="radio" name="tab_system"><label class="tab_label" for="tab_radio_1">タブ1</label> <input id="tab_radio_2" class="tab_radio" type="radio" ...
    続きを読む

  • 【Django】バッチ処理のOpenCVが撮影した画像をDBに保存する
    Djangoのバッチ処理を実行し、DBにデータを格納させる。ただし、OpenCVで撮影した画像をDBに保存させる。本記事ではその手順を記す。 実行環境・やりたいこと 実行環境 Django 2.2以上 Ubuntu 18.04 やりたいこと 流れはだいたいこんな感じ OS起動時、バッチ処理がCrontabから実行される バッチ処理はOpenCVを使用し、撮影した画像を保存 保存した画像とコメントをDBに記録 1秒経ったら、2に戻る つまり、コマ撮りし ...
    続きを読む