Cesco
Cesco

Il mio blog personale

Francesco
Author

Share


Tags


L'esercitazione di oggi con AngularJS e Flask uniti in un'unica app

FrancescoFrancesco

Ore 09:47

Nella mattinata di oggi cercherò di unire lo studio di AngularJS allo studio di Flask, per ottenere un'applicazione web che permetta di visualizzare sullo schermo delle flashcard di studio. L'idea è quella di realizzare un applicazione fatta con AngularJS che visualizzi cinque flashcard prelevate da un backend realizzato con Flask. Per farlo avrò bisogno di creare due applicazioni distinte che dialogheranno fra loro tramite JSON. Questo esercizio, che mi aspetto di portare a termine entro le ore 13:00 di oggi, mi aiuterà ad esercitare tutto
quello che ho imparato finora su AngularJS in merito a routing, direttive, controlli, viste e servizi; inoltre mi permetterà di rinfrescare le idee sul funzionamento di flask come sistema CRUD (Create-Read-Update-Delete) che inizialmente passerà al frontend un file JSON creato a partire da dei valori in memoria, per poi (se mi avanza tempo) trasferire i dati da un database.

Ore 11:21

Ci sono riuscito: Flask passa ad AngularJS un file JSON con una domanda ed una risposta scelte a caso da un'array, ed AngularJS lo visualizza sullo schermo consentendo di visualizzare la risposta e di passare alla prossima.

Ecco una schermata:

Immagine dell'app

Adesso visto che manca ancora più di un ora e mezza al tempo limite massimo che mi ero dato, vorrei aggiungere il supporto ad un database per fare in modo che Flask peschi le domande dal database.

Ore 12:54

Con sei minuti di anticipo rispetto all'orario di scadenza che mi ero prefissato, sono riuscito ad aggiungere un database ed a farlo gestire da Peewee. E' stato meno facile di quello che pensavo, probabilmente perchè non ho molta dimestichezza con Peewee. Comunque alla fine ho avuto successo perchè:

Punto primo

Quando apro il database gli passo l'intero percorso al file. Ad esempio invece di scrivere:

db = SqliteDatabase(database.sqlite)  

Ho scritto:

db = SqliteDatabase(os.path.join(os.path.dirname(__file__), "database.sqlite"))  

Punto secondo

Ho fatto creare il database e le tabelle direttamente a Peewee; originariamente avevo creato il file e le tabelle con un programma, ma poi Peewee sclerava. Così ho invertito il processo: Ho fatto creare a Peewee una-tantum la tabella di cui avevo bisogno per memorizzare le domande e le risposte, e poi l'ho aperta con il programma di gestione per aggiungere le domande.

E quindi, concludendo..

Alla fine il codice che ho dovuto scrivere per far gestire a Peewee il mio database è piuttosto breve e semplice:

# Si collega al database sqlite chiamato "soft.db"
db = SqliteDatabase(os.path.join(os.path.dirname(__file__), "database.sqlite"))  
db.connect()

class Domanda(Model):

    domanda = TextField()
    risposta = TextField()

    Meta:
        database = db

Per scegliere una domanda a caso dal database, ho utilizzato una piccola e (anche in questo caso) semplice

def get_domanda():

    # Sceglie una domanda a caso dal database

    # Si fa dire da Peewee quanti record (alias domande)
    # ci sono all'interno della tabella
    maxdomande = Domanda.select().count()

    # Sceglie un numero a caso per l'ID fra 1 e il massimo
    caso = random.randint(1, maxdomande)

    # Si fa dare da Peewee il record che contiene l'id
    # indicato dal numero a caso che ha scelto
    ricerca = Domanda.get(Domanda.id == caso)

    # Restituisce un'oggetto con la domanda e la risposta
    return {"domanda": ricerca.domanda, "risposta": ricerca.risposta}

Ore 13:37

Mentre aspetto l'arrivo di mio nonno comincio ad impostare, quantomeno mentalmente, l'esercizio che ho intenzione di realizzare durante il pomeriggio: un sistema che consenta di visualizzare delle prenotazioni prese da un database, e che permetta di aggiungere e cancellare i record. Dovrà utilizzare AngularJS per la parte frontend e Flask per la parte backend. Flask ed Angular dialogheranno fra loro tramite file JSON.
Dalla app dovrò avere la possibilità di aggiungere una nuova prenotazione e di cancellare una prenotazione esistente.

Francesco
Author

Francesco

Comments