Представляю вашему вниманию веб-сервис note-pad.net, предназначенный для замены простого бумажного блокнота. Я стремился сделать так, чтобы можно было просто открыть сайт, записать что-нибудь и закрыть его. Мой блокнот состоит из большого текстового поля на весь экран и колонки кнопок справа, предназначенных для перелистывания страниц.

Всего в блокноте 36 страниц, добавлять и удалять их нельзя. Если нужно больше страниц, можно завести несколько блокнотов. Всё как в жизни.

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

В этой статье я постараюсь рассказать о разработке сервиса и его технических особенностях.

Редактор

Сердцем сервиса является редактор текста. Казалось бы, что тут сложного? По нажатию кнопки отправляем текст на сервер, вот и всё.

На самом деле всё сложнее. После того, как пользователь нажал «Сохранить», он может продолжить печатать текст. В результате, когда придет ответ от сервера, текст в поле уже будет несохраненным. На эту сложность накладывается автосохранение, переход по страницам, попытки пользователя уйти с сайта или закрыть вкладку. Больших усилий стоит обеспечить, что несохраненный текст никуда не денется, а неправильный текст не затрет правильный.

Индикация состояния «сохранено/не сохранено», а также процесса обмена данными с сервером тоже имеет нюансы. С одной стороны, индикация должна быть всегда на виду, чтобы пользователь знал, сохранен текст или нет. С другой стороны, при включенном автосохранении эта индикация часто мигает и отвлекает от редактирования текста. В текущей реализации при включенном автосохранении по умолчанию индикация не показывается. Чтобы посмотреть текущее состояние, можно навести указатель мыши на кнопку сохранения или нажать комбинацию клавиш, соответствующую сохранению. В случае возникновения проблем с соединением сайт оповещает пользователя о том, что автосохранение невозможно и ему нужно позаботиться о сохранности текста самостоятельно.

Авторизация и регистрация

Изначально авторизации на сайте не было. Каждый блокнот имел уникальную ссылку с секретным кодом. Для доступа к блокноту было достаточно открыть эту ссылку. Такая возможность есть и сейчас. Когда пользователь впервые заходит на сайт нажимает кнопку «Создать блокнот», создается блокнот с доступом по ссылке. Благодаря этому нет необходимости в авторизации для пользования сервисом.

Затем на сайте появился виджет Loginza, позволяющий авторизоваться с использованием аккаунта на одном из популярных сайтов или с помощью OpenID. Когда я реализовал этот способ, мне казалось, что этого вполне достаточно. Однако через некоторое время посыпались жалобы от пользователей: предложенный способ оказался непривычным и неудобным. Были как психологические, так и конструктивные проблемы. Например, Яндекс по умолчанию предлагат запомнить разрешение на доступ, так что после первого входа никаких вопросов у Яндекса больше не возникает. Войти действительно просто, а вот выйти — не очень. При выходе из аккаунта на сайте пользователь остается залогинен в Яндексе и может повторно войти на сайт в два клика, что снижает защищенность данных. А авторизация с использованием другого Яндекс-аккаунта становится нетривиальной задачей: требуется зайти на Яндекс напрямую и перелогиниться. Пользователи привыкли, что авторизация на одном сайте не влияет на авторизацию на другом, и такое поведение кажется им неочевидным.

Лично для меня OpenID очень удобен, но в какой-то момент мне надоело мучить пользователей и я всё-таки реализовал теплую ламповую регистрацию с логином и паролем. Как ни странно, для пользователей это самый удобный вариант.

Каждый авторизованный пользователь может создать несколько блокнотов и задать имя для каждого из них. Ставшие ненужными блокноты можно удалять. Каждый блокнот можно настроить:

Шифрование

Шифрование я добавил совсем недавно. Я знаю, что меня читают параноики (надеюсь, их не очень испугала эта фраза), и эта фича предназначена специально для них. Шифрование работает по алгоритму AES, используется библиотека Crypto-JS. Пароль пользователя не передается на сервер вообще, а текст передается только в зашифрованном виде.

Другие функции

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

Можно настроить цвета всех элементов интерфейса, отключить отображение иконок и номеров страниц.

Пользователь может искать текст по своим блокнотам.

На сервере делается ежедневный бэкап данных на Amazon S3, что значительно снижает вероятность случайной потери данных. Вы также можете сами позаботиться о сохранности своего блокнота: есть легкий способ скачать блокнот целиком в виде текстового файла.

API

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

Разработка

Сайт я делал в одиночку. Первая рабочая версия появилась в марте 2010 года и представляла из себя простенький скрипт на PHP, добавленный на страничку моего основного сайта.

Основной движущей силой для развития служило то, что сайтом пользовался я сам. Пользователей было мало (да и сейчас их мало). Через год я собрался с силами и переписал клиентскую часть, внеся немного порядка в поселившийся там хаос. Тогда же я создал проект на Реформале для обратной связи с пользователями. Они подсказали мне несколько вещей, которых не хватало сервису.

А в прошлом месяце я собрался с силами и переписал серверную часть с использованием Ruby on Rails. Всё-таки добавлять новые фичи в PHP-код двухгодичной давности, в который заглядываешь раз в месяц, очень сложно. Кстати, серверная сторона очень простая, ее полное переписывание заняло у меня всего один день.

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

Планов по монетизации у меня пока нет. Рекламу добавлять я не хочу. Делать часть функциональности платной тоже не очень хочется. Но если посещаемость возрастет и расходы на хостинг увеличатся, придется что-то придумывать.

В дальнейшем планируется реализовать следующие функции:

• Мобильная версия сайта.
• Англоязычная версия.
• Версионирование текста, возможность откатиться на предыдущую версию.
• Работа в оффлайне.
• Отправка резервных копий на email.

На этом у меня всё. Приятного пользования онлайн-блокнотом.