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

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

Сегодня еще проработаю систему комментирования. А после этого возьмусь за общий вид постов.

Список экранов и состояний для прототипов

Итак. Надо составить себе небольшое ТЗ, список экранов, чтобы ничего не забыть.

В первую очередь надо подразделить весь проект на подпроекты. Какие-то страницы в них будут повторяться. Такие я буду отмечать курсивом.

1. Блог о путешествиях
2. Блог об исследованиях
3. Блог о жизни
4. Магазин
5. Книги
6. Работа

Блог о путешествиях

в этом блоге будут только посты о путешествиях. Как о прошедших, так и о текущих и предстоящих. В принципе, это основной раздел проекта, поскольку именно ради него все и задумывается. Путешествия — очень важная часть нашей жизни.

1. Главная
   1. Открытое меню
   2. Закрытое меню
2. Категория
3. Пост (стандартный вид — простыня)
   
   1. Простыня
   2. Комментарии
   3. Добавление комментария
   4. Обновление комментариев
4. Пост (Альтернативный вид — галерея)
   1. Главный баннер
   2. Блок поста, левый и правый
   3. Блок поста для вертикального фото
   4. Комментарии
   5. Добавление комментария
   6. обновление комментариев
5. Варианты оформления поста
   1. Большая литера-иллюстрация
   2. Вставки партнерок
   3. Рекламные вставки
6. Покупка фотографии
   1. Выбор носителя
   2. Оформление
   3. Оплата

Блог об исследованиях

1. Главная
   1. Открытое меню
   2. Закрытое меню
2. Категория
3. Пост (стандартный вид — простыня)
   
   1. Простыня
   2. Комментарии
   3. Добавление комментария
   4. Обновление комментариев
4. Варианты оформления поста
   1. Большая литера-иллюстрация
   2. Вставки партнерок
   3. Рекламные вставки

Блог о жизни

1. Главная
   1. Открытое меню
   2. Закрытое меню
2. Категория
3. Пост (стандартный вид — простыня)
   
   1. Простыня
   2. Комментарии
   3. Добавление комментария
   4. Обновление комментариев
4. Пост (Альтернативный вид — галерея)
   1. Главный баннер
   2. Блок поста, левый и правый
   3. Блок поста для вертикального фото
   4. Комментарии
   5. Добавление комментария
   6. обновление комментариев
5. Варианты оформления поста
   1. Большая литера-иллюстрация
   2. Вставки партнерок
   3. Рекламные вставки

Магазин

1. Главная
2. Категория
3. Карточка товара
4. Покупка
   1. Выбор носителя
   2. Оформление
   3. Корзина
   4. Оплата
   5. Статус заказа

Книги

1. Главная
2. Карточка книги
   1. Чтение книги

Работа

1. Портфолио
   1. Категория
   2. Карточка проекта
2. Резюме
3. Услуги
   
   1. Все услуги
   2. Карточка услуги
   3. Заказ услуги

Нарисовал для пробы пару прототипов будущих экранов. Это еще не финальная версия, но так, наметки мыслей. Хотя бы для понимания, что так реализовать можно и это будет удобно.

Итак. Порывшись немного в новинках веб-разработки и попробовав разные фичи, обдумав варианты, я принял для себя ряд окончательных решений.

1. Основой всего послужит MeteorJS. Я окончательно убедился в крутости этого решения. Что это такое, можно подробно изучить тут: Ссыль. Если кратко, то это фулл-стек технология, которая представляет собой сборную солянку из различных решений, собранную в стабильно работающий JS-фреймворк. Фуллстековость заключается в принципе, который проповедуют создатели: Единый код на клиенте и сервере. В эбщем, это JS на клиенте, JS на сервере под Node.JS.
2. В качестве базы данных по умолчанию в метеоре используется MongoDB. Это база данных документарного типа. Отличие от обычных табличных реляционных БД заключается в способе хранения данных. Это чем-то напоминает JSON, хранящийся в файлах.
3. Перейдем к клиентской части. SASS в качестве пре-процессора. И собственно все.

Все остальное в целом определяется набором технологий в самом метеоре, так что и выбирать как бы сильно нечего. Отмечу только, что хочу попробовать все это разместить на хостинге Heroku (Ну или иже с ним), особенность которого в размещении именно веб-приложений. А всю статику пихаем в CDN от Amazon.

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

Еще надо посмотреть-подумать на счет Docker. Интересная штука, но пока не совсем понимаю, как я могу ее использовать и надо ли мне вообще оно.

Как-то так.

ТЗ самому себе.

Чтобы что-то делать правильно и обдуманно, надо составлять план. Планировать нужно все. Многим кажется, что «эй, чувак, хорош заниматься фигней, пошли делать дело! Хватит витать в фантазиях!» Этим людям кажется, что у них все получится с первого раза. Но, как показывает практика, так никогда не происходит. Как правило, сначала ничего не получается. И ты начинаешь все переделывать. А все потому, что ты что-то не учел, не продумал. Даже самую мелочь.

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

Сейчас, конечно, я хочу начать с более базовых вещей.

Итак. Что же и как будет у меня в блоге?

1. Все такие же посты. Но несколько в необычной форме. Будет и стандартный вид, привычный людям. То есть вертикальная простыня. Но я хочу попробовать реализовать и несколько иной визуальный эффект. Ведь в моем блоге основную роль будут играть фотографии. Я много путешествую, часто снимаю и у меня огромное количество фоток. Я хочу, чтобы они занимали основополагающее место. А значит их надо развернуть на весь экран. А вот текст будет играть второстепенную роль.
2. На один блок текста может приходиться несколько фотографий, это тоже надо учесть.
3. Листание блоков текста и фотографий должно быть интуитивным и простым. Как мышкой, так и с клавиатуры, так и с сенсорных устройств.
4. Каждую фотографию должна быть возможность купить.
5. Нужно учесть возможные местоположения для партнерок и рекламы. Без этого никак, такие вещи должны приносить хоть какой-то доход. Но надо это делать ненавязчиво и уважительно к пользователям.
6. Система комментирования, типа той что у medium.com, но более продвинутая.
7. Социальная интеграция. Людям жутко лениво регистрироваться где-то еще. Поэтому комментирование надо сделать простым до примитивизма.

Основные разделы

1. Тревел-блог. Мы с моей любимой очень много путешествуем. По сути мы большую часть своей жизни проводим в дороге. И окружающий нас мир — часть нашей жизни. Этим хочется делиться. Конечно, тревел блогов нынче уйма. Путешествуют все, кому не лень. Но нам без разницы. =)
2. Лайф-стайл блог. Жутко не люблю это понятие, но так или иначе мы скорее всего будем писать и о том, что происходит в жизни у нас и в самой семье.
3. Раздел исследовательских статей на тему космоса и истории. Это две темы, которые меня довольно сильно интересуют. Я часто роюсь во всевозможных источниках и узнаю интересные подробности. Как устроен космос? была ли уже ядреная война? Что таит Плутон? Кто такой Цезарь? и т.д. Это просто увлекательно. И не только мне.
4. Книги. Я пишу. Интересную книгу. Скоро кстати на эту тему тоже создам цель. Это скорее будет даже не просто какой-то раздел, а нечто просто приаттаченное к ресурсу, но не так тесно с ним связанное.
5. Магазин. Фотографий, книг и прочего
6. Рабочий раздел. Тут будет все о моей и Ксюшиной работе. Чтобы нам было не стыдно заказчикам показываться. =)
   

Как-то так. альше буду уточнять по ходу действия. =)

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

Я больше не хочу делать статические сайты. Это скучно, уныло и примитивно. Поэтому я стал искать что-либо на тему клиентских веб-приложений. В частности, я по большей степени интересовался AngularJS, EmberJS и иже с ними. Но по ходу изысканий я наткнулся на такую вещь как MeteorJS.

На первый взгляд может показаться, что это очередной фреймворк клиентской MVC парадигмы. Но нет! Мне тоже так показалось, но я быстро понял, что этот зверь значительно круче и увесистей. Метеор — это фуллстек фреймворк, который работает и на клиенте, и на сервере и с БД. И вообще короче он самодостаточен и больше ничего ему не нужно. Плюс к этому, он жутко быстрый.

Выбор был сделан мгновенно. Однозначно MeteorJS. Это будет крутое путешествие. =)

Начнем незамедлительно!

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

Mind map — это вообще очень крутая штука. Она представляет собой спантанно построенное дерево ассоциаций и мыслей, которые постепенно структурируются в четкую и логичную структуру. Лучше, конечно, будет почитать на той же вики, а то я расскажу как-то криво.

Но в любом случае, в конце всех действий должна получиться карта в виде разветвленного дерева связей с записанными понятиями и ассоциациями в его узлах. Такая карта дает возможность быстро оценить весь проект (хотя это применимо для чего угодно в жизни) и по ходу мозгового штурма заполнять и запоминать все мысли, не теряя ни одной.

Я не буду сейчас подробно рассказывать, что тут есть что. Поскольку это и интригу будет портить, и хронику действий. =) Стоит лишь отметить, что как правило на этапе формирования идеи в моей голове уже складывается практически конечный концепт проекта, которые позднее лишь в чем-то совершенствуется и дорабатывается.