---
title: 2. Curs SOC UF2. Model de programació web i base de dades
tags: SOC, UF2
---
# 2. Curs SOC UF2. Model de programació web i base de dades
<div>
<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/"><img alt="Licencia de Creative Commons" style="border-width:0" src="https://i.creativecommons.org/l/by-nc-sa/4.0/88x31.png" /></a><br />Este obra está bajo una <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">licencia de Creative Commons Reconocimiento-NoComercial-CompartirIgual 4.0 Internacional</a>.
</div>
## Disseny de la API REST.
El disseny de la API REST és un dels passos més importants a l'hora de planificar la nostra futura apliació web. Serà el nexe d'unió entre el front-end i el back-end que en entorns professionals, la majoria de vegades els implementaran equips de treball diferents i en algunes ocassions inclús equips que pertanyen a empreses diferents. És per aquesta raó que el disseny de la API ha d'estar prou clar per a permetre un desenvolupament en paral·lel del client i del servidor alhora.
Per ajudar-nos en aquesta tasca hi ha diferents formats que permeten documentar les APIs i alguns inclús permeten provar-les sense haver de desenvolupar el programari de back-end. En aquest curs utilitzarem el format de [API Blueprint](https://apiblueprint.org/).
Api Blueprint és un llenguatge de descripció d'APIs obert (llicència MIT) que disposa d'un conjunt d'eines obertes i també privades al seu voltant que ens faciliten el seu ús.
Api Blueprint està basat en [Markdown](https://es.wikipedia.org/wiki/Markdown) i permet obtenir una documentació atractiva pels humans alhora que descriu el seu ús d'una manera tant precisa que ens permet provar la nostra API durant l'etapa de disseny en un mock server.
### El mock server.
Un mock server, com el seu nom indica, és un servidor que no implementa tota la funcionalitat de la aplicació final, però que ens permet provar els diferents endpoints amb respostes idèntiques en forma a les que ens donarà la API final.
Podem replicar un mock server de la nostra aplicació final amb el següent codi i allotjar-ho a [apiary.io](https://apiary.io).
```blueprint=
FORMAT: 1A
HOST: https://todo.apiblueprint.org/
# Curs_SOC_todo_list
Una aplicació TODO list que permet aprendre a crear una aplicació web basada en una API creada amb Python3 i Flask.
## Benvinguda [/]
### Mostra missatge de benvinguda [GET]
+ Response 200 (text/html)
<h1>Benvingut a la api de la meva todo list!</h1>
## Tasques [/tasks/]
### Obtenir la llista complerta de tasques.[GET]
Aquest end point permet recuperar la llista sencera de tasques emmagatzemada a la base de dades.
+ Response 200 (application/json)
[
{
"done": false,
"id": 2,
"titol": "Rentar els plats."
},
{
"done": false,
"id": 3,
"titol": "Escombrar les habitacions"
}
]
## Operacions CRxD sobre tasques a partir del seu títol [/tasks/titol/{titol}]
### Crear una tasca nova [POST]
Aquest end point permet crear una nova tasca a partir del títol.
No cal enviar res al body, tot queda codificat a la URL.
Si tot va bé, retorna un JSON amb un missatge que indica que la operacio s'ha executat correctament.
+ Response 201 (application/json)
+ Body
{
"Missatge": "La tasca ha estat creada correctament!"
}
### Obtenir una tasca donat el seu títol [GET]
Permet llegir una tasca de la basea de dades passant-li el títol com a paràmetre.
+ Response 200 (application/json)
+ Body
{
"done": false,
"id": 3,
"titol": "Escombrar les habitacions"
}
### Esborrar una tasca a partir del títol [DELETE]
Permet esborrar tasques només sabent el títol.
+ Response 200 (application/json)
+ Body
{"success": "Tasca esborrada correctament"}
## Operacions xRUD sobre tasques a partir de la seva Id [/tasks/id/{id}]
### Obtenir una tasca donada la seva id [GET]
Permet llegir una tasca de la basea de dades passant-li la Id com a paràmetre.
+ Response 200 (application/json)
+ Body
{
"done": false,
"id": 3,
"titol": "Escombrar les habitacions"
}
### Modificar una tasca coneixent la seva Id [PUT]
Permet modificar tasques. Hem de subministrar un JSON al body de la request amb les dades complertes de la nova tasca.
Ens retorna un Json amb la tasca modificada. En cas d'inconsistència la Id de la URL prevaldrà sobre la id del Json del body.
+ Request (application/json)
+ Body
{
"done": false,
"id": 3,
"titol": "Escombrar les habitacions"
}
+ Response 200 (aplication/json)
{
"done": false,
"id": 3,
"titol": "Escombrar les habitacions"
}
### Esborrar una tasca a partir de la id [DELETE]
Permet esborrar tasques només sabent la Id.
+ Response 200 (application/json)
+ Body
{"success": "Tasca esborrada correctament"}
```
També disposeu d'un accés públic a la documentació generada al següent link: [https://curssoctodolist.docs.apiary.io/](https://curssoctodolist.docs.apiary.io/). Que a més de permetre-us provar el mock server des de la seva pàgina web, també el posa a disposicició en un servidor amb adreça pública:
```bash=
$ curl https://private-6f5c58-curssoctodolist.apiary-mock.com/tasks/
[
{
"done": false,
"id": 2,
"titol": "Rentar els plats."
},
{
"done": false,
"id": 3,
"titol": "Escombrar les habitacions"
}
]
```
__Nota:__ un servidor mock no és un servidor que permeti probar la funcionalitat de l'aplicació, només la API. Tot i que aceptarà cridar als endpoints que desen noves tasques, la llista de tasques que podem llegir sempre serà la mateixa i les tasques retornades no seran reals.
En aquest moment ja estem en disposició de começar a crear la nostra aplicació, tant si decidim començar pel client o pel servidor o per tots dos alhora.
### Proves.
Una primera forma de testejar la nostra API pot consistir en cridar un per un tots els end-points i verificar que la resposta és la dessitjada, inclús ens podem generar un script de bash per realitzar totes les crides d'una tacada:
```bash=
xavi@xavi-portatil:~$ cat auto_test.sh
echo "[HTTP] Obtenir la llista de tasques"
curl -i 'https://private-6f5c58-curssoctodolist.apiary-mock.com/tasks/'
echo
echo "[HTTP] Afegir tasca"
curl -i -X POST 'https://private-6f5c58-curssoctodolist.apiary-mock.com/tasks/titol/unTitol'
echo
echo "[HTTP] Obtenir tasca a partir del titol"
curl -i 'https://private-6f5c58-curssoctodolist.apiary-mock.com/tasks/titol/unTitol'
echo
echo "[HTTP] Esborrar tasca donat el seu titol"
curl -i -X DELETE 'https://private-6f5c58-curssoctodolist.apiary-mock.com/tasks/titol/unTitol'
echo
echo "[HTTP] Obtenir tasca a partir de la seva ID"
curl -i 'https://private-6f5c58-curssoctodolist.apiary-mock.com/tasks/id/123654'
echo
echo "[HTTP] Modificar una tasca a partir de la seva ID"
curl -i -X PUT -d '{"done": false, "id": 123654, "titol": "Implementar testing de la app"}' 'https://private-6f5c58-curssoctodolist.apiary-mock.com/tasks/id/123654'
echo
echo "[HTTP] Esborrar tasca a partir de la seva ID"
curl -i -X DELETE 'https://private-6f5c58-curssoctodolist.apiary-mock.com/tasks/id/123654'
echo
```
No oblideu establir el permís d'execució del fitxer, en cas contrari no el podreu executar.
```bash=
$ chmod 774 auto_test.sh
```
I si volem fer una comprovació rápida, ens podem quedar només amb les línies que contenen la descripció de la prova i els codis d'status filtrant amb la comanda grep com podem veure a continuació:
```bash=
$ ./auto_test.sh | grep HTTP
[HTTP] Obtenir la llista de tasques
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
100 195 100 195 0 0 310 0 --:--:-- --:--:-- --:--:-- 310
HTTP/2 200
[HTTP] Afegir tasca
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
100 60 100 60 0 0 99 0 --:--:-- --:--:-- --:--:-- 99
HTTP/2 201
[HTTP] Obtenir tasca a partir del titol
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
100 78 100 78 0 0 262 0 --:--:-- --:--:-- --:--:-- 262
HTTP/2 200
[HTTP] Esborrar tasca donat el seu titol
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
100 43 100 43 0 0 143 0 --:--:-- --:--:-- --:--:-- 143
HTTP/2 200
[HTTP] Obtenir tasca a partir de la seva ID
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
100 78 100 78 0 0 271 0 --:--:-- --:--:-- --:--:-- 271
HTTP/2 200
[HTTP] Modificar una tasca a partir de la seva ID
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
100 149 100 78 100 71 262 238 --:--:-- --:--:-- --:--:-- 500
HTTP/2 200
[HTTP] Esborrar tasca a partir de la seva ID
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
100 43 100 43 0 0 148 0 --:--:-- --:--:-- --:--:-- 148
HTTP/2 200
```
Sign in with Wallet
Connect another wallet