アラフィフの普通のサラリーマンが、将来フリーランスになれるかを目指してプログラミングをいちから勉強をはじめました。 夫がブログに残した勉強の過程を公開できるようにブログ編集しながら一緒に学んでいきます。
Flask 複数の実行ファイルを一つにする方法（トップページに目次を作成）
はじめに 新しいWebアプリを作成したいけど「PythonAnywhere」だと無料では1つのトップページしか登録できません。以前作成したのも残したいので、トップページに目次のようなものを作り各Webアプリを実行できるようにしていきます。今回は「Blueprints」というモジュールを使います。通常「Blueprints」は長くなった一つの実行ファイルを分けるために使用するみたいです。ディレクトリ構成やファイル名なども今回から真剣に考えていきます。 start-python.hateblo.jp このときに作成した簡単なWebページのコードを使っていきます。 動作環境 Windows10Pyt…
はじめに 今回はHTMLからCSSとJavaScriptを外部から読み込み、図形を動かす方法について学んでいきます。CSSは何度か使ってきましたががっつり勉強する意味で「はじめてのCSS」にさせていただきました。また、文字に色を付けたりサイズを変更したりがCSSの基本になると思いますが、いきなり図形の表示からはじめます。 動作環境 Windows10メモ帳（テキストエディタです）Google Chrome（ブラウザです） 作業フォルダ/ ├─ test.html ├─ test2.css └─ test3.js // HTMLの解説 test.html <!DOCTYPE html> <htm…
はじめてのJavaScript（HTMLで現在の時刻を表示する）
はじめに 今回はJavaScriptをHTML内に<script>を用いて記述する方法について学んでいきます。JavaScriptを本格的に学ぶのは大変なので必要最小限で理解できるように心掛けます。 動作環境 Windows10メモ帳（テキストエディタです）Google Chrome（ブラウザです） // ただいまの時刻は 上のように現在の時刻を表示します。 <!DOCTYPE html> <html> <head> <title>時計</title> <script> window.onload = function() { setInterval(function() { var dd =…
はじめてのHTML言語（HTML5 タグが省略可能になっていた）
はじめに 今回はHTMLの基本について学んでいきましょう。 はじめての方にも理解できるように具体例を使ってわかりやすく解説していきます。 動作環境 Windows10メモ帳（テキストエディタです）Google Chrome（ブラウザです） まずは作ってみよう <!DOCTYPE html> <html> <head> <title>タイトル</title> </head> <body> <h1>表題</h1> <p>ここに本文が入ります</p> </body> </html> メモ帳で上記の文書を作成します。入力が完了したら、メモ帳のメニューから [ファイル]→[名前を付けて保存] で入力した…
Flask matplotlibを使ってグラフを表示する方法（JavaScriptのChart.jsを使ってグラフを描画）
はじめに 今回はちょっと寄り道してFlaskでグラフを表示してみます。本当はグラフのアニメーションを作りたかったのですが諦めました。あとで調べたところ、JavaScriptを使ったほうが簡単できれいに出来るみたいだったのでそちらも作成してみました。 動作環境 Windows10Python 3.7.5Flask 1.1.1 コード test.py from flask import Flask, render_template, make_response from io import BytesIO import urllib from matplotlib.backends.backend…
Flask ボタンの大きさや位置を変更する（ボタンでページ移動する）
はじめに 今回から「Flask」の基本を勉強していきます。「html」「css」「javascript」の知識が必要になってきます。まずは基本的なwebページを作ってみます。次にボタンを作ります。 動作環境 Windows10Python 3.7.5Flask 1.1.1 作業フォルダ/ ├─ templates/ │ └─ index.html ├─ static/ │ ├─ index.css │ └─ index.js └─ test.py htmlファイルを保存するフォルダ名は「templates」でないといけません。また、CSSファイルとJavaScriptファイルを保存するフォルダ…
Python Flaskを使ってweb公開する方法 第2回（PythonAnywhereの使い方）
はじめに 今回は、前回「PythonAnywhere」で作成した「Flask（フラスコ）」のファイルを確認して編集してみます。そして新しいファイルをアップロードしてみます。今回も「Git」は使いません。 ファイルの確認と編集 前回、webアプリ作成のときの最後に表示されたパス（/home/Startpython/mysite/flask_app.py）の場所を見てみます。 「PythonAnywhere」のサイトを開きます。 https://www.pythonanywhere.com/ 「Browse files（ブラウズファイル）」を押します。 「mysite」フォルダの中にある「flas…
Python Flaskを使ってweb公開する方法 第1回（PythonAnywhereの使い方）
はじめに 前回は「Git」でファイルをアップロードしてインターネットで公開（デプロイ）するまでをやりましたが、PythonAnywhereのヘルパーツールが全部自動でやってくれたので実際の設定方法などがわかりませんでした。また「Django」が難しすぎたためまだ理解できなさそうだったので「Flask」の基本から勉強していきます。 まずは「PythonAnywhere」で「Flask（フラスコ）」を作成してみます。今回は「Git」は使いません。 PythonAnywhereのアカウント作成 こちらのサイトから「PythonAnywhere」の新規登録をします。 https://www.pytho…
Windowsでインターネット上にWebアプリを公開する方法（「Git」と「PythonAnywhere」を使用）
はじめに 前回はサンプルアプリを起動するところまで進みました。今回はそのサンプルアプリをインターネットで公開（デプロイ）していきます。 ここをご覧いただいている方の多くは、デプロイが初めての方もしくは途中であきらめた方だと思いますので、説明は少なめに最短で進めていきたいと思います。 デプロイの方法 前回新規登録した「Git」と「PythonAnywhere」を使っていきます。 1．Gitリポジトリを始める リポジトリを初期化します。コマンドプロンプトから下記を入力（コピペ）します。 cd djangogirls cd instant-django git init git config --g…
Windowsでマッチングアプリを作ってみよう（Djangoの使い方、最短でチュートリアルを進める）
はじめに プログラミング初心者がマッチングアプリ作成に挑戦します。マッチングアプリと言っても恋活アプリではなく趣味を通じた出会いや情報交換ができるアプリを目指します。1つ基本形が完成すればそれを利用していろいろ応用できそうです。 まずは「Django」を使ってマッチングサイトから作り始めてみます。「Django」の使い方を勉強していきましょう。 使い方 説明を少なくしてなるべく最短でサンプルが使えるまでを解説します。 1．仮想環境を作る（フォルダを作る） コマンドプロンプトを起ち上げて下記を入力（コピペ）します。 mkdir djangogirls cd djangogirls python3…
3Dグラフのアニメーションを作成する（Python matplotlibの使い方）
はじめに 前回に続き、今度はmatplotlibモジュールを使って三次元グラフを作ってみます。「from mpl_toolkits.mplot3d import Axes3D」を使用します。サイコロの出た目を、前回の目をx軸、前々回の目をy軸にしたとき、z軸に偶数なら青色で奇数なら赤色で出た目の合計回数グラフで表します。 プログラムのコード import random import numpy as np import matplotlib.pylab as plt import matplotlib.animation as animation from mpl_toolkits.mplot…
棒グラフのアニメーションを作成する（Python matplotlibの使い方）
はじめに matplotlibモジュールの基本的な使い方を勉強します。「animation.FuncAnimation」を使ってサイコロの出た目の合計回数を棒グラフで表します。 棒グラフの表示だけならこちらです。 ※jupyter notebookでグラフを表示する場合は、「%matplotlib nbagg」を最初に入れます。 プログラムのコード import random import numpy as np import matplotlib.pyplot as plt import matplotlib.animation as animation fig, ax = plt.subp…
PythonでGIF編集ソフトが完成しました（動画ファイルを読み込んでGIFへの保存も可能）
はじめに GIFファイルを開いて編集（再生、カット、トリミング）ができるソフトです。 保存したGIFファイルがこちらです。 使い方 実行ファイルがあるフォルダにdataフォルダを作ってdataフォルダの中にGIFファイルを用意します。 ソフトを起動するとGIFファイルの一覧が出ます。ファイル名をクリックすると画面が変わってGIFが編集できます。 上のボタン 「<」・・・タイトル一覧に戻ります 「保存」・・GIFファイルを保存します（保存ファイル名はtest.gifにしています） 下のボタン 「 ◀」・・・最初（1コマ目）に戻ります 「◀ 」・・・1コマ戻ります 「▶」・・・再生します（「■」・…
Kivy 範囲選択を行い座標を取り出す（Python 点線の描画）
はじめに 今回は範囲選択を行い座標を取り出します。図形の移動の応用です。 範囲選択（点線の描画） def __init__(self, **kwargs): super().__init__(**kwargs) self.lines = [] def on_image1_down(self, touch): self.x1 = touch.x self.y1 = touch.y if len(self.lines)>0: for line in self.lines: self.ids.image1.canvas.remove(line) self.lines = [] with self.i…
Kivy 「on_touch_move」を利用して図形を移動する（Python 図形の移動）
はじめに 今回は「on_touch_move」を利用して図形を移動させます。 図形の移動 def on_image1_down(self, touch): try: self.ids.image1.canvas.remove(self.lines) except: pass with self.ids.image1.canvas: Color(1, 0, 0) touch.ud['line'] = Rectangle(pos=touch.pos, size=(100, 100)) self.lines = touch.ud['line'] def on_image1_move(self, to…
Kivy 「canvas.remove」を利用して図形を消す（Python 図形の削除）
はじめに 今回は「canvas.remove」を利用して図形を消します。 図形の削除 def on_image1_down(self, touch): try: self.ids.image1.canvas.remove(self.lines) except: pass with self.ids.image1.canvas: Color(1, 0, 0) touch.ud['line'] = Rectangle(pos=touch.pos, size=(100, 100)) self.lines = touch.ud['line'] 解説 クリックしたときに描画する図形を「self.line…
Kivy 特定のウェジットだけでon_touch_downを使う（Python クリックした座標を取り出す）
はじめに クリックした座標を取りたくて「on_touch_down」を利用したらボタンが押せなくなりました。その時に使った対処法です。 def on_touch_down(self, touch): print(touch.pos) これだとマウスをクリックした座標は取れますが、ほかの操作（ボタンを押す）が効かなくなります。 解決策（例） kvファイルで「on_touch_down:」の行を追加して BoxLayout: orientation: "vertical" Image: id: image1 size_hint_y: 10 texture: root.image_texture o…
Python GIFファイルを再生する（Kivy 画像更新）
はじめに 今回はClockオブジェクトを利用して画像を更新する方法です。指定された間隔で繰り返し処理を行います。 プログラムのコード # フル画面を解除して画面の幅と高さを設定 from kivy.config import Config Config.set('graphics', 'fullscreen', 0) Config.set('graphics', 'width', 320) Config.set('graphics', 'height', 568) Config.set('graphics', 'resizable', 1) import os import glob impo…
Python 一部のレイアウトだけ変更する（kivy 画面遷移）
はじめに 前回の続きでGIFファイルを表示しようと思いましたが、先にレイアウトの切り替えが必要になりました。画面のスライドで使ったCarouselを利用します。 プログラムのコード # フル画面を解除して画面の幅と高さを設定 from kivy.config import Config Config.set('graphics', 'fullscreen', 0) Config.set('graphics', 'width', 320) Config.set('graphics', 'height', 568) Config.set('graphics', 'resizable', 1) im…
Python ファイル一覧にサムネイルを付ける（Kivy Image画像で一覧を作る）
はじめに 前回の続きです。フォルダ内のファイル名一覧にサムネイルを表示しました。 プログラムのコード # フル画面を解除して画面の幅と高さを設定 from kivy.config import Config Config.set('graphics', 'fullscreen', 0) Config.set('graphics', 'width', 320) Config.set('graphics', 'height', 568) Config.set('graphics', 'resizable', 1) import os import glob import cv2 import nu…
Python フォルダ内のファイル名を取得する（スライド可能な一覧を作る）
はじめに 今回からGIF編集ソフトを作っていきたいと思います。 まずはファイル選択の部分を作ります。特定のフォルダからGIFファイルだけを抜き出し一覧にします。 プログラムのコード # フル画面を解除して画面の幅と高さを設定 from kivy.config import Config Config.set('graphics', 'fullscreen', 0) Config.set('graphics', 'width', 320) Config.set('graphics', 'height', 568) Config.set('graphics', 'resizable', 0) fr…
あけましておめでとうございます！ 今までは日記として毎日の進捗状況を書いてきました。明日から正月の間はブログ休みます。 現在のブログの状況です。 ブログを始めてからTwitterも始めました。 今年からは完成した内容や詰まったところを不定期で書いていきたいと思います。 12月を振り返って 人工知能とはどういう仕組みか、どうやっているのかなど、機械学習のやり方がわかりたくて始めたPython（プログラミング）です。 毎日ブログ更新を目標に1日で出来る範囲で何をしようかと考えてきました。いつのまにかプログラミングの勉強よりブログが優先になってた気がします。 今後はアクセス数は気にせずプログラミング…
「ブログリーダー」を活用して、ReyLukeさんをフォローしませんか？
指定した記事をブログ村の中で非表示にしたり、削除したりできます。非表示の場合は、再度表示に戻せます。
画像が取得されていないときは、ブログ側にOGP(メタタグ)の設置が必要になる場合があります。
