Используя силу JS во всех аспектах веб-проекта

Привет хабр! Хочу представить вам мой проект над которым я работал последние несколько месяцев. Это небольшой пост о том как в одиночку и без денег имея в запасе знание JS разработать небольшой веб проект, плагины для нескольких браузеров и мобильную версию к нему.

Предисловие

Меня всегда удручали закладки браузера или любые другие сервисы своей не информативностью. Довольно затруднительно найти нужную ссылку имея только фавиконку и заголовок. А если нужно найти конкретное видео или картинку в разросшейся коллекции закладок?
Одно время я просто сохранял URL-ы в txt файл, вел скрытую группу Вконтакте, делал заметки в Evernote, пользовался кучей сервисов. Все это привело меня к созданию Raindrop.io.

Под катом подробности и немного закулисья.

О проекте

   
Raindrop.io сохраняет не просто закладки, но и связанный с ними контент в зависимости от типа страницы. Если это статья например с хабра или лента.ру, она будет вырезана и сохранена вместе с закладкой.
Тоже самое касается видео, фото, коуба с Coub.com или презентации например c SlideShare.
Таким образом вы можете организовывать тематические коллекции с разным контентом.
Коллекции можно делать публичными и использовать в ваших приложениях или на сайте с помощью простого API. Мне очень интересно какие коллекции создадите вы! Примеры использования можно посмотреть здесь.

С мобильного вы можете использовать Raindrop например как сервис отложенного чтения статьей. Клиент для iOS доступен в AppStore. Для других платформ в скором времени.

Что скрыто под капотом?

• На сервере работает Node.js+Express который выдает только статику и данные в JSON, на клиенте AngularJS, а мобильная версия на Appcelerator Titanium. Он позволяет писать нативные кроссплатформенные приложения под iOS, Android, Blackberry и др.
  Никаких проблем с одобрение в AppStore замечено не было. Понадобилась ровно неделя на апрув со стороны Apple.
• Для парсинга статей модуль Node-Readibility. Изначально использовал открытое API от Readability но не ясно во сколько оно обойдется при большом количестве запросов, т.к открытого прайса у них нет. Есть еще Diffbot. Цены не кусаются, широкое API, возможность кастомизации парсера. Но вот скорость зачастую очень не радует. В среднем на одну страницу 3-5 сек и до бесконечности.
• Так-же для точного определения типа страницы смотрятся мета-теги Open Graph и Twitter Cards. Они используются довольно часто и несут много полезной информации, например iframe плеера или превью, не говоря уже о заголовке и описание.
• Написав расширение для Google Chrome очень просто портировать его в Safari. Единственное браузер от Apple не позволяет использовать куки для iframe в всплывающем окне расширения. Он их просто не сохраняет.
  Для оперы можно добавлять расширение от Chrome без изменений.

О каких то других аспектах могу рассказать подробнее в комментариях.

Аналоги

• Pinterest — социальная сеть, ориентирована преимущественно на картинки, Raindrop же скорее ваша личная копилка любого контента
• Pocket — сервис отложенного чтения статей, т. е имеет более узкое применение
• http://kippt.com — похожий функционал, но визуальное отображение по моему мнению не очень удобное. Бесплатная версия с ограничениями.
• https://icebergs.com — скорее для креативных людей. Имеет более широкий функционал (заметки, файлы). Бесплатная версия с ограничениями.
• https://springpad.com — вместо коллекций записные книжки. Мне кажется имеет довольно излишний функционал. Кроме контента доступно создание рецептов, списков задач, точек на карте и мн. др.

Буду признателен любой обратной связи! Хочу поблагодарить администрацию Habrahabr за бесплатное предоставление аккаунта компании.