Matteo Vaccari

Matteo Vaccari > Applicazioni Web

ESEMPIO di Esame scritto per Applicazioni Web 2012/13

Esercizio 0.

Vogliamo realizzare un’applicazione che gestisce un archivio dei libri della propria biblioteca personale. Ogni utente registra i libri della sua biblioteca nel servizio.

Di ciascun libro vogliamo salvare il titolo e l’autore.
Di ciascun libro vogliamo ricordare a quale utente appartiene.
Non deve essere possibile inserire libri con titolo vuoto o autore vuoto.

(a) Disegnare un diagramma entità e relazioni

(b) Scrivere il codice SQL che crea lo schema

(c) Pagina principale.

La pagina principale deve ricavare dalla sessione l’utente corrente, e presentare:

un elenco di tutti i libri dell’utente corrente;
un link alla pagina “Inserisci un nuovo libro”

Questa pagina risponde alla url “/books/index”

(d) Pagina “Inserisci un nuovo libro”

Questa pagina deve mostrare una form che permette di inserire un nuovo libro. Risponde alla url “/books/new”.

(e) Azione /books/create

Questa azione riceve i dati della form e deve ridirigere su “/” se il salvataggio del nuovo libro ha successo, oppure ripresentare la form se la validazione dei dati fallisce.

Per i punti (c) e (d) ed (e), scrivere il codice da inserire nei file:

config/routes.rb
app/models/book.rb
app/models/user.rb
app/controllers/books_controller.rb
app/views/books/index.html.erb
app/views/books/new.html.erb

Esercizio 1.

Un browser fa una richiesta alla url http://www.example.org/pippo.html. Assumendo che la risorsa /pippo.html esista, che sia di tipo HTML e che il contenuto sia <p>pippo</p>, scrivere il messaggio di richiesta HTTP e il messaggio di risposta HTTP.

Esercizio 2.

Dato il codice html seguente:

<html>
  <head><title>Prova</title></head>
  <body>
    <div id="page">          
      <div id="sidebar">
        sidebar
      </div>
      <div id="main_content">
        main content
      </div>
      <div id="footer">
        footer
      </div>
    </div>
  </body>
</html>

Scrivere il codice CSS per realizzare un layout di questo tipo:

+---------------------------
| sidebar | main content   |
|         |                |
|         |                |
|         |                |
+---------------------------
| footer                   |
+---------------------------

Il layout può essere di larghezza fissa (ad esempio: larghezza della pagina di 600 pixel) oppure fluido, a vostra scelta.

Esempio di soluzione

Esercizio 0.

(a) Disegnare un diagramma entità e relazioni

Ci possono essere molte maniere più raffinate di rappresentare questo problema, ma per una prima versione possono essere sufficienti queste:


+------------- *       1 +--------------+
| Books      |-----------|  Users       |
+-------------           +--------------+

(b) Scrivere il codice SQL che crea lo schema

Mi aspetto che le tabelle rispettino le convenzioni di Ruby on Rails.

create table users (
  id integer auto_increment not null primary key,
  email varchar(255),
  hashed_password varchar(255),
  created_at datetime,
  updated_at datetime
);

create table books (
  id integer auto_increment not null primary key,
  user_id integer,
  title varchar(255),
  author varchar(255),
  created_at datetime,
  updated_at datetime
);

(c) (d) (e)

Soluzione:

# config/routes.rb
root :to => "books/index"
get "/books/new"
post "/books/create"

# app/models/book.rb
class Book < ActiveRecord::Base
  validates_presence_of :title, :author, :user_id
  belongs_to :user
end

# app/models/user.rb
class User < ActiveRecord::Base
  has_many :books
end

# app/controllers/books_controller.rb
class BookController < ApplicationController
  def index
    @books = current_user.books
  end

  def new
    @current_user = current_user
  end

  def create
    @book = Book.new(params[:book])
    if @book.save
      redirect_to "/"
    else
      @current_user = current_user
      render "new"
    end
  end

  def current_user
    User.where("id = ?", session[:user_id]).first
  end
end

# app/views/books/index.html.erb
<h1>I tuoi libri</h1>
<ul>
  <% for book in @books %>
    <li><%= book.title %></li>
  <% end %>
</ul>
<p>
  <a href="/books/new">Inserisci nuovo libro</a>
</p>

# app/views/books/new.html.erb
<h1>Inserisci un nuovo libro</h1>    
<form action="/books/create" method="post">
  <input type="hidden" name="books[user_id]" value="<%= @current_user.id %>" />
  <p>
    Titolo:
    <input type="text" name="books[title]" />
  </p>
  <p>
    Autore:
    <input type="text" name="books[author]" />
  </p>
  <p>
    <input type="submit" />
  </p>
</form>

Esercizio 1.

Richiesta:

GET /pippo.html HTTP/1.1\r\n
Host: www.example.org\r\n
\r\n

Risposta:

HTTP/1.1 200 OK\r\n
Content-type: text/html\r\n
Content-length: 12\r\n
\r\n
<p>pippo</p>

Esercizio 2.

Soluzione con un layout di larghezza fissa:

#page {
  width: 600px;
}

#sidebar {
  width: 200px;
  float: left;
}

#main_content {
  width: 400px;
  float: left;
}

#footer {
  clear: both;
}