Flask und React im Zusammenspiel ohne Jinja

Django, Flask, Bottle, WSGI, CGI…
Antworten
Feind
User
Beiträge: 7
Registriert: Montag 19. Februar 2018, 18:38

Hi zusammen,

ich habe es jetzt hinbekommen, dass ich einen Webserver per Python zum Laufen gebracht habe (war ja auch nicht weiter schwer). Nun möchte ich aber die weitere Bearbeitung im Backend mit Python erledigen und als Frontend React nutzen. Das mit dem Frontend klappt ja schonmal, aber wie bekomme ich jetzt praktisch meine DB-Abfragen aus Python an React übergeben? Ich glaube je mehr ich lese, desto komplizierter mache ich mir meine eigenen Vorstellungen.


Das ist momentan mein Server:

Code: Alles auswählen

# server.py
from flask import Flask, render_template

app = Flask(__name__, static_folder="../static/dist", template_folder="../static")

@app.route("/")
def index():
    return render_template("index.html")

@app.route("/hello")
def hello():
    return("Hello World!")


if __name__ == "__main__":
    app.run()
und das meine entsprechende index.html (inkl. webpack (das funktioniert bereits))

Code: Alles auswählen

<!-- index.html -->
<html>
  <head>
    <meta charset="utf-8">
    <title>MaiThaitle</title>
  </head>
  <body>
    <div id="content" />
    <script src="dist/bundle.js" type="text/javascript"></script>
  </body>
</html>
Hier meine App:

Code: Alles auswählen

// App.jsx
import React from "react";

export default class App extends React.Component {
  render () {
    return <p> Hello React!</p>;
  }
}
und hier meine index.jsx

Code: Alles auswählen

// index.jsx
import React from "react";
import ReactDOM from "react-dom";
import App from "./App";

ReactDOM.render(<App />, document.getElementById("content"));

Gesetzt dem Fall ich habe jetzt bspw. einen Datensatz per SQLAlchemy (nennen wir es "obj": enthält einen Namen und ein Alter) aus der DB ausgelesen. Was muss ich denn tun, um diese (als JSON-Object?) an React weiterzugeben?

Kann mich mal einer vom Schlauch schubsen?

Danke.
DasIch
User
Beiträge: 2718
Registriert: Montag 19. Mai 2008, 04:21
Wohnort: Berlin

Normalerweise stellt das Backend eine API bereit die vom Frontend aufgerufen wird.
Feind
User
Beiträge: 7
Registriert: Montag 19. Februar 2018, 18:38

Ok, jetzt bin ich auf dem Schlauch nur ein Stückchen weiter, aber noch nicht runter.

Was wäre denn so eine API? Nach was muss ich denn suchen? Ich habe da null Anhaltspunkt.

Wäre super, wenn mir dazu jemand noch was sagen könnte.
__deets__
User
Beiträge: 14493
Registriert: Mittwoch 14. Oktober 2015, 14:29

Flask JSON requests sollte es tun bei Google (ich benuzte selbst wenn bottle, aber in dieser Beziehung wird sich das alles nix nehmen).
Benutzeravatar
noisefloor
User
Beiträge: 3843
Registriert: Mittwoch 17. Oktober 2007, 21:40
Wohnort: WW
Kontaktdaten:

Hallo,

im einfachsten Fall sendet Frontend eine POST-Request (Stichwort: AJAX) an eine Route , welche darauf hin die gewünschten Daten zurück liefert, z.B. im JSON-Format. Die zeigst du dann halt im Frontend an.

Gruß, noisefloor
Feind
User
Beiträge: 7
Registriert: Montag 19. Februar 2018, 18:38

Super, __deets__. Das war schon mal der erste Fuß und noisefloor hat mich dann noch mal komplett runtergeschubst. Ich hatte das mit der Route irgendwie falsch verstanden. Jetzt ist es denke ich etwas klarer. Trotzdem muss ich noch ordentlich ran, das ist doch recht komplex. Aber wie immer muss man nur machen und irgendwann fällt dann der Groschen/Pfennig/Cent/wasauchimmer.

Dankeschön!
Antworten