1 of 17

Web programming – Homework 1

Giuseppe Leotta O46001732

a.a. 2019/2020

2 of 17

Feisbuk

  • Feisbuk non è altro che una versione estremamente light del Facebook originale, dove però non possono essere condivise fake news. Tramite un’opportuna fase di registrazione e di login(con facoltativo permesso all’utilizzo dei cookie) è possibile subito collegarsi al sito che reindirizza alla home. Una volta nella home si possono vedere i propri post e degli utenti che si seguono. Per seguire un utente sarà necessario andare nella pagina ‘Cerca utenti’ ed effettuare una ricerca per nome oppure visualizzare tutti gli iscritti al sito, dopodiché basta cliccare sul tasto ‘Segui’. Per quanto riguarda la condivisione di contenuti, è possibile condividere foto di gatti, gif e album musicali grazie alle API REST offerte da giphy.com, last fm e thecatapi.com. Tutte e 3 prevedono come meccanismo di autenticazione API KEY.

3 of 17

Diagramma interazione componenti

Login.php

Home.php

Signup.php

Utenti db

Logout.php

Home.js

Home_post_utenti.php

Home_like.php

Post db

Follower db

Likes db

Crea_post.php

Crea_post.js

do_search_content.php

Giphy

API KEY

TheCatApi

API KEY

Last.fm

API KEY

Signup.js

Controllo_username.php

Search_people.php

Search_people.js

Do_search_people.php

Follow.php

Follower db

Unfollow.php

4 of 17

Login.php

Signup.php

Utenti db

Controllo_user.php

Home.php

Home_like.php

Home_post.php

Frecce gialle = fetch a quella pagina php tramite js e ritorno in formato json

Post db

Follower db

Likes db

Create_post.php

Do_search_content.php

Last.fm

APIKEY

Giphy

API KEY

TheCatApi

APIKEY

Logout.php

Search_people.php

Do_search_people.php

Follow.php

Unfollow.php

Post db

5 of 17

API REST

  • TheCatApi permette la ricerca di foto di gatti, informazioni sulle razze feline, votare immagini come preferite
    • https://api.thecatapi.com/v1/images/search?category_ids={category_ids}&api_key={your_apikey}
    • Ricerca di foto tramite categoria(inserimento di un intero da 1 a 10)
    • API KEY, fornita tramite iscrizione, permette molti più accessi ed inserita come parametro della query
  • Giphy permette la ricerca di gif(o stickers) secondo i trend del momento, oppure una semplice ricerca per nome o per tag
    • https://api.giphy.com/v1/gifs/search?api_key={your_apikey}&q={search_text} &limit=25&offset=0&rating=G&lang=it
    • L’endpoint gifs SEARCH permette l’accesso alla libreria di GIPHY contenente una grande quantità di GIFs tramite l’inserimento di una parola o di una frase
    • API KEY, ottenuta mediante iscrizione
  • Last.fm permette la ricerca di contenuti quali informazioni su artisti, album, canzoni

​

​

​

​

6 of 17

ER Model Database

Utenti

nome

cognome

email

ID

password

img

Post

Id_post

Utente_post

Titolo_post

Contenuto_post

data

Scrive

(0,n)

(1,1)

Likes

(0,n)

(0,n)

id_u

Id_p

Un utente può scrivere un post fino ad n post, può anche non condividere post. Un post con quel dato id può essere condiviso da 1 e 1 solo utente, inoltre l’id_post ha senso solo se messo in relazione con l’utente che lo ha condiviso. Naturalmente poi l’utente può mettere like a diversi post così come un post può ricevere tanti likes da utenti diversi. Un utente può seguire qualcuno così come può essere seguito da qualcuno in particolare.

Follower

segue

seguito

(0,n)

(0,n)

7 of 17

Screenshots

  • Screenshot (una per ogni pagina) della web application
    • Login
    • Registrazione
    • Home
    • Nuovo post
    • Ricerca utenti

​

  • Dopo lo screenshot di ogni pagina, riportare un ulteriore screenshot della del codice più significativo per la pagina

8 of 17

Screenshots Login

9 of 17

Screenshots Login

10 of 17

Screenshots signup

11 of 17

Screenshots signup

12 of 17

Screenshots home

13 of 17

Screenshots home

14 of 17

Screenshots create post

15 of 17

Screenshots create post

16 of 17

Screenshots cerca utenti

17 of 17

Screenshots cerca utenti