Diferències

Ací es mostren les diferències entre la revisió seleccionada i la versió actual de la pàgina.

Enllaç a la visualització de la comparació

--- flask_basic [2023/07/06 18:20]
antoni_hortal_martinez [Instal·la Flask al teu sistema operatiu]
+++ flask_basic [2023/07/06 21:37] (actual)
antoni_hortal_martinez [Crea les rutes de l'aplicació al controlador]
@@ Línia 1: / Línia 1: @@
 **Flask** és un //framework// o entorn de treball dedicat a facilitar la creació d'aplicacions web utilitzant el llenguatge de programació Python.
 {{:pythonflask.jpeg?400|}}
 Un //framework// és un marc o esquema de treball que consisteix en un conjunt d'eines i mòduls per a facilitar-nos el desenvolupament de programari. En aquest cas, Flask, igual que el famós Django, és un //framework// que ens facilita la creació d'aplicacions web dinàmiques utilitzant Python.
@@ Línia 19: / Línia 20: @@
 En primer lloc, actualitza pip amb
-''python3 pip install --upgrade pip''
+''python3 pip install %%--%%upgrade pip''
 o
-''python3 -m pip install --upgrade pip''
+''python3 -m pip install %%--%%upgrade pip''
 Després, instal·la Flask amb
@@ Línia 49: / Línia 50: @@
 Així que cada cop que creïs un projecte és probable que hagis de crear aquestes mateixes carpetes, entre d'altres, per a allotjar plantilles, fitxers d'estils, imatges, etc.
-===== Importa la classe flask i crea app en el controlador de l'aplicació =====
+===== Importa la classe Flask i crea app al controlador de l'aplicació =====
 El primer que hem de fer és indicar que es tracta d'un fitxer script de Python i després importar el framework Flask per a començar a treballar amb ell.
@@ Línia 69: / Línia 70: @@
 Però... **què són les rutes?**
-Les rutes són bàsicament funcions que determinen què passarà en carregar determinada url de la nostra aplicació. Una url és una determinada adreça al navegador, i totes la pàgines o llocs web tenen una url d'inici o "home" que és la url principal. Així que anem a crear la url principal de la nostra aplicació web.
+Les rutes són bàsicament funcions que determinen què passarà en carregar determinada //url// de la nostra aplicació. Una //url// és una determinada adreça al navegador, i totes la pàgines o llocs web tenen una //url// d'inici o "home" que és la //url// principal. Així que anem a crear la //url// principal de la nostra aplicació web.
-N'hi ha prou amb afegir a sota de l'import i de la instància de Flask el següent:
+N'hi ha prou amb afegir a sota de l'**import** i de la instància de Flask el següent:
-''
+<file python controlador.py>
 @app.route('/')
 def inici():
-     return 'Aquesta és la pàgina d%%'%%inici'
+    return 'Aquesta és la pàgina d´inici'
-''
+</file>
+El que fem a la primera línia d'aquest bloc de codi és utilitzar un "decorador" conegut com a "route". El decorador és una mètode de la instància de **app** que hereta de la classe **Flask**.
+Podem dir que app és la instància de Flask, pel que en cridar **@app.route()** estem indicant que es tractarà d'una ruta, i a dins dels parèntesis estem proporcionant una cadena que és la //url// com a argument.
+**<color #22b14c>En el moment que la url coincideixi amb la que el client està sol·licitant s'executarà la funció que es trobi a sota.</color>
+**
+Ara... **com creem una altra ruta per a la //url// "**/agraiments**", per exemple?**
+Simplement afegim un altre decorador argumentant-hi la url i a sota creem una nova funció:
+<file python controlador.py>
+@app.route('/')
+def agraiments():
+    return 'Moltes gràcies!'
+</file>
+=== Inicia la teva aplicació Flask ===
+Ara ja podem provar la nostra aplicació (si es pot anomenar així, ja que encara no fa res!).
+Per a fer-ho disposem d'un servidor que ens proporciona Flask apte per a proves, però abans hem d'indicar-li el fitxer o a la configuració de Flask quina és l'aplicació que ha d'iniciar, en quin mode i en quina adreça.
+Ho pots fer afegint el següent al final del fitxer **controlador.py**:
+<file python controlador.py>
+if __name__ == '__main__':
+    app.run('127.0.0.1', 5000, debug=True)
+</file>
+Recordes que quan vam crear l'objecte **app** instància de la classe Flask vam afegir com a argument "**%%__%%name%%__%%**"? Doncs el condicional el que fa és comprovar si el nom és igual al fitxer que executem (**%%__%%main%%__%%**). Sempre que vegis **main** es tractarà del fitxer en si. Per tant, en executar el nostre fitxer aquest condicional es compleix!
+I a dins s'especifica que executi el mètode "**run**" de l'app, el que farà que s'iniciï. Però també especifica com a argument que s'activi el mode "**debug**", que ens permetrà identificar i corregir errors en la programació de la nostra app. Així que mentre la iniciem i fem ús de la nostra app **veurem a la consola els errors que vagin sorgint i les sol·licituds que es realitzen**. I a més indiquem l'adreça **//url//** i el port que anema a utilitzar.
+El nostre controlador.py ha quedat així:
+<file python controlador.py>
+from flask import Flask
+app = Flask(__name__)
+@app.route('/')
+def inici():
+    return 'Aquesta és la pàgina d'inici'
+@app.route('/agraiments')
+def agraiments():
+    return 'Moltes gràcies!'
+if __name__ == '__main__':
+    app.run('127.0.0.1', 5000, debug=True)
+</file>
+Ara sí, prova-la!
+N'hi ha prou d'obrir un terminal o consola (ho pots fer directament des de Visual Code Studio amb la seva terminal integrada).
+Com qualsevol aplicació, ens posicionem a la carpeta o directori on es troba controlador.py i executem
+''python3 controlador.py''
+Immediatament hauríem de veure la nostra aplicació corrent:
+{{:flask02.png?400|}}
+Com vam dir al començament d'aquest tutorial, aquest framework serveix per a crear aplicacions web, així que només hem d'obrir un navegador i anar a l'adreça que hem especificat ''127.0.0.1:5000''. Veurem el següent:
+{{:flask03.png?400|}}
+És clar que és molt humil, però funciona!!!!
+No et descuidis d'accedir a la //url// **/agraiments** amb ''127.0.0.1:5000/agraiments''
+{{:flask04.png?400|}}
+Aquests són els passos a seguir per a crear una app amb Flask.

bytes.cat

Eines de l'usuari

Eines del lloc

Diferències

Eines de la pàgina