Первые 20 часов. Как быстро научиться… чему угодно

Вы, наверное, заметили, что дизайн страницы состоит из трех частей: верхней навигационной панели, области основного содержания и бокового поля. Я сконструировал эту структуру с помощью инструмента Bootstrap [42], созданного разработчиками Twitter Марком Отто и Джейкобом Торнтоном.

Веб-страницу не нужно разрабатывать с нуля, поскольку Bootstrap представляет собой библиотеку шаблонов HTML и CSS, находящихся в открытом доступе. Использование Bootstrap сэкономит вам уйму времени: вы сможете собрать прототип своего приложения за несколько минут вместо нескольких дней.

Основная единица этого приложения называется «Page», и она отображает запись, хранящуюся в базе данных. Специальная кнопка позволяет просматривать все записи базы данных. Внизу расположены еще две кнопки. Первая дает возможность редактировать текущую страницу, вторая — удалить.

В боковом поле реализованы три основные функции. Вверху расположена форма, позволяющая создать новую страницу, для чего нужно ввести ее название. Здесь также есть список страниц, добавленных пользователем, и этот список может служить указателем. И, наконец, справка по форматированию, помогающая пользователю вспомнить, как применять стандартные функции форматирования.

Верхняя навигационная панель очень проста. Она содержит ссылку на главную страницу, а также дополнительную ссылку на экран «Показать все страницы». Позже я могу добавить еще функции, если потребуется, но пока этого достаточно.

Каждое интернет-приложение имеет главную страницу, и я должен решить, что хочу видеть на своей главной странице. В данном случае мне просто нужно отобразить запись Home базы данных.

Что же содержится в Page? Поскольку каждая Page представляет собой запись базы данных с полями, в которых хранится информация, я должен указать DataMapper, какие поля требуется создать. Вот как это выглядит:

class Page

include DataMapper:: Resource

property: id, Serial

property: title, String

property: content, Text

property: lastupdated, DateTime

end

DataMapper.finalize

Данный фрагмент программы использует DataMapper для создания нового объекта под названием Page. Теперь Ruby может использовать Page подобно любому другому объекту, а я могу создавать и применять методы, которые формируют, изменяют и удаляют объекты Page. Изменения, внесенные в Page, сохраняются в базе данных при помощи DataMapper.

Команда DataMapper.finalize указывает приложению, чтобы оно создало эти поля, если они еще не существуют в действующей базе данных.

Теперь, когда база данных есть, пора выяснить, какие маршруты должна будет обслуживать среда разработки Sinatra. Вот какой у меня получился список:

# Show home page

g e t '/'

# Creates new note from "new page" form

p o s t '/'

# Displays requested note

get '/: url/'

# Edits requested note

get '/: url/edit'

# Saves user edits to note

p o s t '/: u r l /e d it'

# Deletes specified note

delete '/: url/'

# List all pages in database

get '/all/'

# Error handling

not_found

error

Это очень полезный список. Мое приложение будет строиться вокруг команд, которые я создам для каждого маршрута.

Слаги, везде слаги!

Помните, я сравнивал базу данных с магической стопкой учетных карточек, которую вы можете просматривать так, как вам удобно? Нам нужен способ поиска конкретных записей, и именно потому в этих маршрутах встречается url. Содержание параметра url указывает базе данных, какую запись следует извлекать.

В качестве параметра можно использовать заголовок страницы, но тут есть одна проблема: браузеры не любят в интернет-адресах такие вещи, как пробелы, заглавные буквы и специальные символы (например, $ и %). В заголовках такие символы встречаются достаточно часто, поэтому от них нужно избавиться.

Строка, однозначно определяющая страницу сайта, называется слагом [43]. Слаг моей страницы будет основан на заголовке и подчиняться правилам, приемлемым для интернет-адресов.

1. Все символы строчные.

2. Никаких специальных символов — только буквы и цифры.

3. Никаких пробелов — все пробелы должны быть заменены на подчеркивание.

Для этого нужно создать метод, который берет заголовок страницы и форматирует его в слаг. Сложные замены выполняются при помощи метода программирования, получившего название регулярных выражений, который преобразует или находит текст в строках в соответствии с установленными правилами [44].

Регулярные выражения могут быть очень сложными, но применяются они широко, и я смог найти подходящий шаблон. Вот как выглядит мой метод: