ryotankの備考録日記

趣味の電子工作についての備考録などなど

2022-01-01から1ヶ月間の記事一覧

電子工作作業報告書管理アプリその41

今回は2つ目のviews.pyの19行目を修正していく いきなりだが、 myapp/views.pyにdata_page() data2_page(),data3_page()を追加する。この名前は、urls.pyで指定した名前。 #myapp/views.py from django.shortcuts import render # Create your views here. f…

電子工作作業報告書管理アプリその40

まず、1つ目のurls.pyを直していく from django.urls import path from.import views app_name='ewrn' urlpatterns = [ path("data/", views.data, name ="data"), path("data2/", views.data2, name = "data2"), path("data3/", views.data3, name= "data3"…

電子工作作業報告書管理アプリその39

データ入力した後確認画面に移行するまでをしたいと以前書いたが、 それを飛ばして実際にhtmlが動作するかを確かめたいので、 先に動作確認をしてみる ローカルサーバーを立ち上げてみるAnacondaのコマンドプロンプトを起動し cd ewrnと入力し、ewrnフォルダ…

電子工作作業報告書管理アプリその38

今回はdata3.htmlをイメージ図になるようにコードを書く <html> <head> <meta charset="utf-8" /> <title>データ入力画面3フォーム</meta></head></html>

電子工作作業報告書管理アプリその37

CSS実験6は、"入力画面3へ"ボタンにマウスポインタを重ねると 紫色に変化する(ボタンの色は白に変化し、変化が分かるように)その時のCSSコード(一部抜粋した) .input3btn:hover{ background-color: #fff; border-color: #9400D3; color: #9400D3; } .input3b…

電子工作作業報告書管理アプリその36

今回はdata2のHTMLをイメージ図になるようなコードを書く data2.htmlのイメージ図は このような感じ data2のイメージ図 <html> <head> </head></html>

電子工作作業報告書管理アプリその35

今回は、CCS実験4の結果を掲載し、 CSS実験5ではリセットボタンとの間隔をあけるようなCSSを書くボタンや画像を複数並べた時に同じ間隔を空け配置する方法があった flexboxというもの等間隔で並べるには、CSSのdisplay:flexと justify-content:space-evenly…

電子工作作業報告書管理アプリその34

実験3では、"入力画面2へ"ボタンを目立つくらい大きくした data1css実験3結果 今回は"入力画面2"や"リセット"のボタンの大きさやアニメーションを付ける CSSのコードを書いてみる最初に"入力画面2"ボタンの大きさを目立つくらいの大きさに変化させる コード…

電子工作作業報告書管理アプリその33

いい感じに調整が出来た1回目がこれで data1css実験12回目がこれ data1css実験2data1css実験2結果その時のCSSコードは /* data1のcss :data1.css*/ /* 全体を左マージン80px移動させた 2022-1-21 運用ブラウザ:FireFox_ver96.01(64bit)*/ /* 文字列のマージ…

電子工作作業報告書管理アプリその32

data1のスタイルシートは data1.cssに記述する また、位置を調整したいので、移動さたい箇所に色付けして 好みの位置になるまで調整を繰り返すCSS用語 その1:マージン マージンとは、領域間のスペースその2:パディング パディングとは、領域内のスペースま…

電子工作作業報告書管理アプリその31

各データ入力画面には、記入例を載せてないので、入力時に どんな事、データを入れるか悩むのを防ぐ為、"入力のヒント"を表示するように 編集するまずdata1.htmlcodepenで検証薄い文字はplaceholderで表現する data1には、作業名、分類名、内容、備考の項目…

電子工作作業報告書管理アプリその30

Djangoに関する事 どのページを表示するかを記載したurls.pyを作っていく urlsの流れとしては、 1.データ入力画面1を表示して入力画面2、入力画面3へと移る 2.入力画面3の入力が終われば内容確認ページを表示する 3.確認ページ内で"報告する"というボタンを…

電子工作作業報告書管理アプリその29

data1用のcss作成ボタンはシンプルなボーダーで囲うスタイルにするボタンの下地を青色、文字を白抜き、フォーカスを合わせると ボタン枠が反転するようにしたい .submit{ display:inline-block; text-align: center; /* 中央揃え */ padding: 0.3em 1em; tex…

電子工作作業報告書管理アプリその28

CSS 解説編Cascading Style Sheets (CSS)とは、HTMLなどのマークアップ言語で 書かれたWebサイトの見た目や書式を記述するための言語の事Bootstrap は美しいWebサイトを開発するためのHTMLとCSSのフレームワークとしてとても有名BootstrapのインストールBoot…

電子工作作業報告書管理アプリその27

viewの解説からviews.pyを開きformの行の後に form .forms import DataForm その後に、ビューを追加するDataFormを新しく作るには、DataForm()を呼び出して、 それをテンプレートに渡す必要がある。 form .forms import DataForm def data_new(request): for…

電子工作作業報告書管理アプリその26

HTMLでのフォーム作成編その2 変更する前のdata1.html <html> <head> <meta charset="utf-8" /> <title>データ入力画面1フォーム</title> </head> <body> <h1>データ入力画面1フォーム</h1> <form method="POST" novalidate> {{ form.as_p }} {% csrf_tok…</form></body></html>

電子工作作業報告書管理アプリその25

HTMLでのフォーム作成編 フォーム例 <form action="confirm.php" method="post"> </form> action""の意味は、 送信ボタンを押した後に移動するページのURLを記入する 入力内容の確認画面へ移動する事を想定した「data1confirm.html」という ページの名前を入れるmethod""の意味は フォームの入力内容の"データ…

電子工作作業報告書管理アプリその24

前回の23ではewrnというデータベースに ewrn_01というテーブルを作成する所でつまづいた原因と思われるのは、テーブルの作成文(CREATE TABLE文)の表記がおかしい テーブルの作成構文 CREATE TABLE テーブル名( カラム名 データ型 [COMMENT 'コメント'], カラ…

電子工作作業報告書管理アプリその23

MariaDBでテーブルを 作成、削除、変更する方法第一段階:テーブルの作成についてまず初めにテーブルを作成するにはMariaDBに接続しないと 始まらないMySQL CLientというコマンドプロンプトを起動して ずいぶん前に作成したパスワードでログインする今回はデ…

電子工作作業報告書管理アプリその22

前回、data.htmlのコードをのせて、{{ form.as_p }}、{% csrf_token %}の 解説をしたが <form method="POST" novalidate> が気になったので、調べると・・・ フォームの入力内容の検証を無効にするかどうかを指定する属性の事でこれが設定されていると入力欄を入力しなくても送信できてしま</form>…

電子工作作業報告書管理アプリその21

models.pyの作業内容や備考などはTextFieldに設定を変更したコード #()内はフィールドオプションでmax_lengthの数はデータ型 #作業内容(work_details)と備考(remarks)はTextFieldに変更 2022-1-7 #CharFieldはmax_lengthは最大255まで それ以上はTextFieldに…

電子工作作業報告書管理アプリその20

フィールドオプションの共通項について解説 フィールドオプション 使い方 blank 入力を必須にするかどうか null データベースのnullを許容するかどうか unique データベース上で一意制約を設定 choices セレクトボックスを作成 verbse_name 管理画面でのフィ…

電子工作作業報告書管理アプリその19

BooleanFieldの解説からBooleanField:ブール値(真偽)TureまたはFalseを保存するフィールド 主にチェックボックスなどで使われる HTMLのinputタグ属性は、checkboxサンプルコード from django.db import models class Person(models.Model): first_name = mod…

電子工作作業報告書管理アプリその18

django そもそもフィールドとはモデル定義で必ず1つ以上必要になる項目 データベースで言うと、テーブルのカラムに該当するフィールドはモデルクラスの属性として定義されます。データベースで言うテーブルは、モデルにあたります。 このモデルを通してデー…

電子工作作業報告書管理アプリその17

ビュー関数から #user/views.py #動作に問題なければewrnフォルダのuserにぶち込む #21行目のif form.is_valid()メソッドでDataFormモデルのバリデーションが実行される #問題ない場合は、save()メソッドでデータが保存され、user/data2へリダイレクトされる…

電子工作作業報告書管理アプリその16

気分転換にフォーム画面を作成しようと思うDjnagoのフォーム画面を作るには 「ModelFormクラス」による作成をするあらかじめ「モデル(データベースにおけるテーブル)があると 「ModelFormクラス」を利用するとフォーム画面が構築しやすいのがメリット今回…

電子工作作業報告書管理アプリその15

第3正規化を使用と思ったが、該当するものがなかった第2正規化から出てきたものからデータの種類を考えると 以下の通りになる ewrn_データの種類を考える先ほどのものからデータの大きさを決めると・・・ ewrn_データの大きさを決めるになり 最終的にテーブ…

電子工作作業報告書管理アプリその14

テーブル定義書の簡易版が完成したので 載せる ewrn_テーブル定義書_簡易版これをテーブル化したのがこれ ewrn_テーブル上記のテーブルを正規化していく 第2正規化はこれ 第2正規化したもの第2正規化から更に「分離」したのがこれ 第2正規化から「分離」した…

基板設計記録WEBアプリその6

テーブル定義書の簡易版が完成したので掲載する PDR_テーブル定義書_簡易版使用するデータベースはMariaDBとする定義書に基づいてDB(データベース)のテーブルを作ると・・・以下の通りになる PDR_テーブル次回はこのテーブルを正規化する