[PYTHON] Der Tag, an dem ein Anfänger, der zweieinhalb Monate mit dem Programmieren begann, eine Webanwendung mit Flask erstellte

Einführung

Vielen Dank, dass Sie diesen Artikel zuerst gelesen haben!

Es ist ungefähr zwei Wochen her, seit ich einen Artikel über Datenanalyse veröffentlicht habe.

Dieses Mal habe ich den AI-App-Kurs von Aidemy beendet, daher möchte ich eine Web-App erstellen.

Die App ist eine App, die Bilder sortiert.

Für wen ist der Artikel?

Diejenigen, die gerade anfangen oder gerade mit dem Programmieren begonnen haben. Besonders für berufstätige Erwachsene, um Programmieren zu lernen

Wenn Sie es Interessierten vorlesen, ist es eine der Referenzen. Weil ich die App für die Arbeit gemacht habe

Es ist ein wenig Zeit am Ende und die Zeit, die in den Ferien verbracht wird. Daher: "Welches ist das Beste beim Programmieren während der Arbeit?

Können Sie einen Abschluss programmieren? Auf die Frage, die für Berufstätige und Programmieranfänger besorgniserregend ist

Ich denke, ich kann eine der Beispielantworten geben.

Vorsichtsmaßnahmen für Leser

Da ich der Ausgabe selbst große Bedeutung beimesse, habe ich kein striktes Verständnis für den Inhalt des Codes.

Eine detaillierte Erklärung ist möglicherweise nicht möglich. Es tut mir Leid.

Dieser Artikel besagt, dass Sie in der Programmierung ausgeben können, ohne den Code genau zu verstehen.

Ich möchte es durchschicken. Dies ist eines der wichtigsten Dinge, die mir in letzter Zeit aufgefallen sind. Drücken Sie es so oft wie möglich aus,

Ich hoffe, dass es allen mitgeteilt wird.

Umgebung

MacBookAir macOS : Catalina 10.15.5 Atom : 1.53.0 JupyterNotebook

Text

0. Themeneinstellung und Endziel

Diese App ist eine App, die Bilderkennung verwendet. Wenn die Maschine ähnliche Dinge leicht vom menschlichen Auge unterscheiden kann,

Ich fand es gut, also dachte ich vorerst über zwei Dinge nach, die angemessen ähnlich waren. Mit Butter, Margarine, Curry

Hirame, Kai Ato und Ai Kato. Nachdem ich über verschiedene Dinge nachgedacht hatte, machte ich Kohl und Salat. Es war einfach, Bilddaten zu sammeln

Weil.

Implementieren Sie eine Anwendung im Web, mit der festgestellt werden kann, ob es sich um Kohl oder Salat handelt. Dies ist das ultimative Ziel.

Dieses Mal werde ich einen Texteditor namens Atom verwenden, aber die Struktur des endgültigen Verzeichnisses, das auf Atom erstellt wurde

Ich werde es im Voraus setzen.

cabbage_lettuce/ 　├ image/ 　│ 　└ additional_image 　│　├ cabbage 　│　└ lettuce 　├ model.h5/ 　│　└ my_model 　├ static/ 　│　└ stylesheet.css 　├ template/ 　│　└ index.html 　├ exe.py 　└ imagenet.py

1. Datenerfassung

Erstellen Sie zunächst ein Verzeichnis mit dem Namen cabbage_lettuce. Darunter befindet sich eine Datei namens imagenet.py

machen. In diesem Abschnitt erstellen wir imagenet.py. Bilddaten stammen aus einer Datenquelle namens ImageNet

Belastung 　 Der Inhalt von imagenet.py wird größtenteils aus den folgenden Referenzen kopiert. Weitere Informationen finden Sie auf der folgenden Seite.

Ich freue mich darauf, mit Dir zu arbeiten.

(Referenz) ImageNet Herunterladen von ImageNet

Verwenden Sie nach dem Schreiben von imagenet.py die Befehlszeile. Erfahren Sie, wie Sie die Befehlszeile mit Progate verwenden

Hat. Der Befehlszeilen-Studiengang ist kostenlos. Wenn Sie nicht damit vertraut sind, versuchen Sie es bitte. sehr viel

Es ist leicht zu verstehen.

Da ich einen Mac verwende, verwende ich eine Befehlszeile namens Terminal. Verwenden Sie das Terminal, um imagenet.py zu erhalten

Sie können es mit "python imagenet.py" starten, aber dafür an der Stelle, an der imagenet.py existiert

Sie müssen in ein Verzeichnis wechseln, das eine Ebene höher liegt. Schauen Sie sich die oben beschriebene Verzeichnisstruktur an

Ausgehend vom Verzeichnis cabbage_lettuce werden die Verzeichnisse und Dateien verzweigt, dies ist jedoch der Fall

Wenn Sie in die entgegengesetzte Richtung folgen, steigen Sie in der Hierarchie auf. Nach dieser Beschreibung liegt es eine Ebene über imagenet.py.

Das Verzeichnis ist das Verzeichnis cabbage_lettuce.

Verwenden Sie den Befehl cd, um in ein anderes Verzeichnis zu wechseln. Wenn Sie eine Ebene über cabbage_lettuce sind,

Sie können zu cabbage_lettuce wechseln, indem Sie den Code auf dem Terminal ausführen. Die Hierarchie über cabbage_lettuce ist

Auf dem Mac können Sie dies über eine vorhandene App namens Finder überprüfen.

Terminal

cd cabbage_lettuce

Wenn "Benutzername cabbage_lettuce%" angezeigt wird, ist dies erfolgreich. Wenn dies erfolgreich ist, gehen Sie wie folgt für Salat und Kohl vor

Laden Sie das Bild herunter.

Terminal

python imagenet.py

2. Modellbau

Das Modell wird mit Jupyter Notebook hergestellt. Dies ist sehr praktisch, wenn Sie die Daten im Detail optimieren möchten.

JupyterNotebook

from sklearn.model_selection import train_test_split
from keras.callbacks import ModelCheckpoint
from keras.layers import Conv2D, MaxPooling2D, Dense, Dropout, Flatten
from keras.models import Sequential
from keras.utils import np_utils
from keras import optimizers
from keras.preprocessing.image import img_to_array, load_img
import keras
import glob
import numpy as np
import matplotlib.pyplot as plt


#Bildverzeichnispfad
root_dir = '/cabbage_lettuce/image/'
#Name des Bildverzeichnisses
veg = ['cabbage', 'lettuce']

X = []  #Liste, in der 2D-Daten von Bildern gespeichert sind
y = []  #Etikette(Richtige Antwort)Liste zum Speichern von Informationen über

for label, img_title in enumerate(veg):
    file_dir = root_dir + img_title
    img_file = glob.glob(file_dir + '/*')
    for i in img_file:
        try:

            img = img_to_array(load_img(i, target_size=(128, 128)))
            X.append(img)
            y.append(label)
        except:
            print(i + "Fehler beim Lesen")
#4-dimensionale Liste von Numpy-Arrays(*, 244, 224, 3)
X = np.asarray(X)
y = np.asarray(y)

#Konvertieren Sie Pixelwerte von 0 in 1
X = X.astype('float32') / 255.0
#Beschriften Sie Eins-In Hot Label konvertieren
y = np_utils.to_categorical(y, 2)

#Teilen Sie die Daten
X_train, X_test, y_train, y_test = train_test_split(X, y, test_size=0.2, random_state=0)
xy = (X_train, X_test, y_train, y_test)

model = Sequential()
#Eingabeebene,Versteckte Ebene(Aktivierungsfunktion:relu)
model.add ( Conv2D ( 32, (3, 3), activation='relu', padding='same', input_shape=X_train.shape[1:]) )
model.add ( MaxPooling2D ( pool_size=(2, 2) ) )

model.add ( Conv2D ( 32, (3, 3), activation='relu', padding='same' ) )
model.add ( MaxPooling2D ( pool_size=(2, 2) ) )

model.add ( Conv2D ( 64, (3, 3), activation='relu' ) )
model.add ( MaxPooling2D ( pool_size=(2, 2) ) )

model.add ( Conv2D ( 128, (3, 3), activation='relu' ) )
model.add ( MaxPooling2D ( pool_size=(2, 2) ) )

model.add ( Flatten () )
model.add ( Dense ( 512, activation='relu' ) )
model.add ( Dropout ( 0.5 ) )

#Ausgabeschicht(2 Klassenklassifikation)(Aktivierungsfunktion:softmax)
model.add ( Dense ( 2, activation='softmax' ) )

#Kompilieren (Lernrate:1e-3, Verlustfunktion: kategorisch_Crossentropie, Optimierungsalgorithmus: RMSprop, Bewertungsfunktion: Genauigkeit(Richtige Antwortrate)）
rms = optimizers.RMSprop ( lr=1e-3 )
model.compile ( loss='categorical_crossentropy',
                optimizer=rms,
                metrics=['accuracy'] )

#Modell-Epoche lernen
epoch = 10

#Lernen Sie mit dem gebauten Modell
model.fit (X_train,y_train,batch_size=64,epochs=epoch,validation_data=(X_test, y_test) )

model.save('/cabbage_lettuce/model.h5/my_model')

scores = model.evaluate(X_test, y_test, verbose=1)

print('Test accuracy:', scores[1])

Dieser Code ist fast wie eine Vorlage, daher ist es besser, die Artikel anderer Personen zu lesen, um detaillierte Erklärungen zu erhalten.

Ich hoffe, Sie werden verstehen, wie es geht. Wenn es nur eine Erklärung gibt, geben Sie die try- und Except-Anweisungen in der for-Anweisung ein

Es ist möglich, fehlerhafte Bilddaten zu identifizieren, die nicht gelesen werden können und in die Bilddaten eingemischt sind. dazu

Daher ist das Bearbeiten der Bilddaten etwas einfacher geworden.

Der obige Code gibt die richtige Antwortrate für dieses Modell aus. Ergebnis ist

Test accuracy: 0.3184931506849315

31% !? Es ist eine schreckliche Genauigkeit, es ist ungefähr die gleiche Genauigkeit wie ich, weil ich nicht unterscheiden kann, bis ich es beiße (lacht)

Da das Ziel dieses Mal darin besteht, eine App zu erstellen, gibt es kein Problem mit dem Zweck, ohne die Genauigkeit zu verbessern. Keine Zeit mehr

Ich will es nicht aufhängen, also gehe ich weiter.

3. Drücken Sie die App im Web aus

Wir werden Flask, ein Tool zum Erstellen von Web-Apps, und HTML & CSS erstellen, das das Erscheinungsbild der App erstellt.

exe.py

import os
from flask import Flask, request, redirect, url_for, render_template, flash
from werkzeug.utils import secure_filename
from tensorflow.keras.models import Sequential, load_model
from tensorflow.keras.preprocessing import image
import numpy as np

classes = ["cabbage","lettuce"]
num_classes = len(classes)
image_size = 128

UPLOAD_FOLDER = "./image/additional_image"
ALLOWED_EXTENSIONS = set(['png', 'jpg', 'jpeg', 'gif'])

app = Flask(__name__)

def allowed_file(filename):
    return '.' in filename and filename.rsplit('.', 1)[1].lower() in ALLOWED_EXTENSIONS

model = load_model('./model.h5/my_model')#Laden Sie das trainierte Modell

@app.route('/', methods=['GET', 'POST'])
def upload_file():
    if request.method == 'POST':
        if 'file' not in request.files:
            flash('Keine Datei')
            return redirect(request.url)
        file = request.files['file']
        if file.filename == '':
            flash('Keine Datei')
            return redirect(request.url)
        if file and allowed_file(file.filename):
            filename = secure_filename(file.filename)
            file.save(os.path.join(UPLOAD_FOLDER, filename))
            filepath = os.path.join(UPLOAD_FOLDER, filename)

            #Lesen Sie das empfangene Bild und konvertieren Sie es in das np-Format
            img = image.load_img(filepath,grayscale=False,target_size=(image_size,image_size))
            img = image.img_to_array(img)
            data = np.array([img])
            #Übergeben Sie die transformierten Daten zur Vorhersage an das Modell
            result = model.predict(data)[0]
            predicted = result.argmax()
            pred_answer = "das ist" + classes[predicted] + "ist"

            return render_template("index.html",answer=pred_answer)

    return render_template("index.html",answer="")


if __name__ == "__main__":
    port = int(os.environ.get('PORT', 8080))
    app.run(host ='0.0.0.0',port = port)

Ermöglichen Sie Benutzern das Senden von Bilddateien. Fügen Sie die übermittelten Daten in das zuvor erstellte Bilderkennungsmodell ein.

Der Inhalt soll die Ausgabe zurückgeben.

index.html

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>CL_Discriminator</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="./static/stylesheet.css">
</head>
<body>
    <header>


    </header>

    <div class="main">
        <h2>Gibt an, ob es sich bei dem übertragenen Bild um Kohl oder Salat handelt</h2>
        <p>Bitte senden Sie das Bild</p>
        <form method="POST" enctype="multipart/form-data">
            <input class="file_choose" type="file" name="file">
            <input class="btn" value="einreichen" type="submit">
        </form>
        <div class="answer">{{answer}}</div>
    </div>



</body>
</html>

stylesheet.css

header {
    background-color: #76B55B;
    height: 60px;
    margin: -8px;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
}

.main {
    height: 370px;
}

h2 {
    color: #444444;
    margin: 90px 0px;
    text-align: center;
}

p {
    color: #444444;
    margin: 70px 0px 30px 0px;
    text-align: center;
}

.answer {
    color: #444444;
    margin: 70px 0px 30px 0px;
    text-align: center;
}

form {
    text-align: center;
}

Jetzt können Sie loslegen.

Wechseln Sie auf dem Terminal in das Verzeichnis eine Ebene über exe.py (zu cabbage_lettuce) und führen Sie dann Folgendes aus.

Terminal

python exe.py

Die URL ist im Ausgabeergebnis enthalten. Als ich dorthin wechselte, wurde die App im Web angezeigt.

Ich werde ein Bild von Salat einreichen, der als Probe aus dem Netz genommen wurde.

Ich kehrte ruhig zurück, machte aber einen Fehler.

Nun, ich möchte den zu liefernden Bericht hier beenden.

abschließend

Abschließend möchte ich über mein Lernen und die App nachdenken. Beschleunigen Sie das Lernen für den letzten Monat oder so

Ich lerne bewusst Programmieren und habe mir zusammenhängende Meinungen zum Lernen ausgedacht.

Ich werde darüber schreiben. Wenn Sie schnell lernen möchten, ist es so, als wären Sie früher zur Schule gegangen

Ich dachte, ich müsste dem Paradigma des Output-Lernens entkommen. Also, Ausgabe → imp

Lernen, das heißt, zuerst entscheiden, was Sie machen möchten, und wenn Sie im Prozess des Machens stolpern, wie wäre es, jedes Mal zu überprüfen (einzugeben)?

Ich habe die Methode der Fertigstellung als Produkt gewählt. Dies ist aufgrund meiner eigenen Erfahrung, alleine zu lernen, ziemlich schwierig.

Es gibt ein Problem. Durch den Besuch einer Online-Schule schaffe ich eine Umgebung, in der ich Menschen mit praktischer Erfahrung Fragen stellen kann.

Jetzt ist es möglich, das Lernen von Ausgabe → Eingabe festzulegen. Viele Male in dieser App-Produktion

Ich bin darauf gestoßen und jedes Mal hat mir der Mentor viele Male geholfen. Natürlich können Sie jemanden fragen und das richtige Feedback erhalten

Wenn es eine Umgebung ist, die zurückkehrt, können selbst Anfänger mit allen Mitteln schnell lernen. Es gibt jedoch auch Probleme

Ich werde. Ich habe gelernt, dass es kein Problem gibt, weil es auch mit einem vagen Verständnis wie erwartet funktioniert hat, ohne mit dem Inhalt des Codes vertraut zu sein.

Es ist ein Punkt, der voranschreitet. Wie Sie in diesem Artikel sehen können, wird das Programmieren mit zunehmender Komplexität komplexer

Es ist zu erwarten, dass komplexere Probleme auftreten und umfassende Kompetenz erforderlich ist. Fahren Sie mit einem flachen Verständnis fort, wie es jetzt ist

Wenn Sie fortfahren, gibt es zu viele Punkte, um zu stolpern, und im Gegenteil, die Effizienz wird sich verschlechtern. Das ist die Zukunft

Ich denke, das ist ein Problem. Schließlich sind die Wörter, die ich kürzlich gelernt habe, für Anfänger in der Programmierung geeignet, einschließlich mir.

Ich dachte, also möchte ich den Artikel fertig schreiben, indem ich dieses Wort zitiere.

Das Ende all unserer Quests Um zum Ursprungsort zurückzukehren, Es ist das erste Mal, dass Sie den Ort kennen.

• T. S. Elliott

In Zukunft möchte ich das Programmieren aus verschiedenen Blickwinkeln lernen. Analysieren Sie danach die Daten erneut und erstellen Sie die App erneut

Mit der Zeit denke ich, dass ich ein tiefes Verständnis dafür habe, wo ich bin und in der Lage bin, qualitativ hochwertige Ergebnisse zu produzieren.

Ich bin sehr aufgeregt.

Wenn einer der Leser Anfänger wie ich sind, geben wir gemeinsam unser Bestes!

Vielen Dank, dass Sie den Artikel bis zum Ende gelesen haben! !!

Verweise

Aidemy AI App Course Anfänger 2 Monate nach Beginn der Programmierung versuchten eine Zeitreihenanalyse des realen BIP Japans mit dem SARIMA-Modell ImageNet [So laden Sie ImageNet herunter] (http://murayama.hatenablog.com/entry/2017/11/18/160818) [Bilderkennungspferd und Hirsch mit CNN](https://qiita.com/nuhsodnok/items/a3fb71bba4e0148e782f#%E8%A9%A6%E3%81%97%E3%81%9F%E3%81%93 % E3% 81% A8% E3% 81% 9D% E3% 81% AE1) Zusammenfassung zum Schreiben von Umweltinformationen Anfängermemorandum zur Erstellung von Qiita-Artikeln