«Ranbu»: как я стал «Комитетом»

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

Предисловие.

Привет, прошло много времени с последней статьи здесь. Когда-то полный надежд и энтузиазма, разработал сервис и презентовал его в этой статье. Так как по образованию географ, то к программированию пришёл совсем недавно. Оглядываясь назад, немного с улыбкой вспоминаю себя тогда, ведь тогда только начинал серьезно программировать.

За последние два года мне пришлось хорошенько поработать на собой, чтобы достичь определенных навыков. Могу теперь сносно писать бэк, фронт, мобильные приложения, но самое главное, что научился этому c оглядкой на проекты «Комитета».

140 > 1. 

Основа.

Как вы знаете, в основе сайтов «VC», «TJ», «DTF» лежит платформа для контентных проектов «Osnova». Благодаря этому продуманному инструменту, издательский дом «Комитет» смог стать одной из основных контентных площадок в «рунете», потеснив на этой ниве медиа старичка "TechMedia« с их ветераном «Хаброй» (в последующем его переписали).

Как написано в презентации инструмента, в основе платформы лежат определенные модули «Paragraph» (редактор), «Leonardo» (хранилище файлов), «Booster» (рекламная система) и «Gutenberg» (озвучка статей). По моему скромному мнению, именно редактор стал той вещью, что предопределила развитие проектов «Комитета».

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

Мне хотелось воссоздать нечто подобное в собственном проекте, чтобы у меня был похожий инструмент, который бы использовал в написании собственных материалов. Так и начался мой долгострой под названием «Ranbu».

Первые шаги.

Когда вы начинаете новый пет проект, то нужно использовать вещи, которые вы хотите изучить (в моём случае хотелось так). Планировал изучить «блоковые редакторы» и на основе них написать проект. Кроме блоковых редакторов, мне нужно было изучить и смежные вещи, на которые завязан был планируемый функционал, а именно, сокеты, обработка картинок, обработка видео и хранение файлов.

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

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

Когда начинал проект, то первоначально использовал в качестве редактора «Sir Trevor Js». Он был первым и единственным открытым блочным редактором в то время. Его использование принесло мне много негатива, так как из него невозможно было выстроить редактор, который использовался в «Комитете». В итоге, мне пришлось от него отказаться и использовать свой.

Написание своего не заняло много времени. Моя поделка была лучше «Sir Trevor JS» и больше походила на то, что использовалось здесь. Но всё это продолжалось до тех пор, пока не наткнулся на открытый аналог «Paragraph» — «editor.js». Мне не сложно было понимать разницу в труде и я не зациклен на своём дерьме. Поэтому, практически сразу отказался от своего редактора и внедрил новый. Очень хорошо, что ребята делятся своими наработками. Большое уважение к «Codex Team».

Написал модули, которые бы повторяли работу прошлого по работе с видео и внедряемыми провайдерами видео (youtube, coub). Это не заняло так много времени, так как модули под редактор пишутся легко. Документация и готовые плагины тоже упрощают разработку (можно подсмотреть).

Учёт просмотров появился в прошлом году. До этого статистика по просмотрам не собиралась.

Пишу статьи.

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

Используя редактор сам, лучше начинаешь понимать специфику создания контента и улучшения инструмента под него.

минутка тщеславия.

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

Озвучивание статьи ака "Gutenberg" в деле.

Простые решения.

«Leonardo» (хранилище и отдача статики) это еще одна вещь, аналоги которой активно используются во многих сервисах. Понимание того, что не нужно резать картинки и хранить их при загрузке это интересный опыт, который пришёл ко мне во время написания сервиса.

Вам легче один раз загрузить одну картинку, а потом шинковать её по запросам на лету, используя готовые медиа провайдеры или микросервисы. Поэтому, картинки которые отдаются в «Ranbu» тоже шинкуются на лету и отдаются в зависимости от «viewporta» устройства.

«Socket IO» (сокеты для реал-тайма), которое используется в «Комитете», является дополнением для «PHP» в деле введения обновляемого контента. Изучение работы сокетов и внедрение реал-тайма в сервис тоже было хорошим опытом.

«Gutenberg» (озвучка статей) стало последним, что внедрил у себя. Реализация подобного заняла день. По сути это всего лишь обращения к API SpeechKit, сборка «ogg» файлов в «mp3» и последующее хранение. Больше всего удивило, что появляются новые модели, которые намного старых.

За кадром.

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

Кроме того, использование «S3» на старте упростило мне контейнеризацию приложения, соответственно, последующее построение архитектуры и CI/CD. Современные приложения работают в кластере и является "stateless", поэтому, свои приложения держу в них.

Кроме того, что нужно было изучить фронт, плюс смежные с ним всякие «Intersection Observer API», «SSR» и прочие радости, то еще время потратил на изучение практик «DevOps» и продумывания развёртки. Пришлось писать собственные образы под «Alpine» и вникать в каждую деталь ремесла.

Но теперь, всё что мне остается, это всего лишь закинуть код в гит и пойти дальше писать статьи на «Ranbu». «Rolling updates» задеплоят новый функционал без простоя.

Забыл упомянуть про мобильные приложения. Так как на изучение нативки у меня уйдёт куча времени, то изучил по работе «Flutter» и написал пару приложении. Переписав под «Strict API» бэкенд, планирую написать и мобильные приложения. Таким нехитрым образом решаю проблему мобилок.

Заключение.

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

Даже и сейчас, пишу статью и подмечаю новые вещи, которые хочу реализовать у себя: часто мне приходится подглядывать за «Комитетом» за лучшими примерами (не считаю это зазорным, так как проекты «Комитета» меня многому научили, за что им большая благодарность).

Ко мне обращались насчёт покупки кода, но там на самом деле не на что смотреть. Я дурачок и мне приходится заниматься всем. Могу с уверенностью сказать, что платформа «Комитета» несомненно крутая. Старайтесь заполучить её. Мои запросы скромные, поэтому, всё это делается для себя и только для улучшения собственных навыков.

Постараюсь побыть здесь немного, а потом вернусь в свою берлогу. Если вы хорошо пишите, то заходите ко мне на огонёк. За хорошие лонгриды буду выписать чек. В общем, до скорого!

0
80 комментариев
Написать комментарий...
Game Topia

О чём этот пост и для кого предназначен? Такое ощущение, что его Яндекс балаболка сгенерировала, поскольку текст ну ваще хаотичен. 
И я вчера вакансию от vc.ru смотрел, так там тот же ковер присутствовал...

Ответить
Развернуть ветку
Dmitry Dubov

Я думал это я не выспался и логические цепочки в голове перестали собираться) а нет,я не один такой))

Ответить
Развернуть ветку
10 комментариев
Ospanov Serik
Автор

Как вы догадались? Наш отдел разработки как раз тестируют натренированную модель. А редактурой занимается сотрудник HR отдела.

Ответить
Развернуть ветку
Антон

Не удивительно. Человек о себе говорит, что он постоянно что-то пишет. Когда постоянно пишут - такое и получается.

Ответить
Развернуть ветку
Влад Цыплухин

У вас тут коллега есть, в прямом эфире разрабатывает https://www.youtube.com/channel/UCdldbhAwO16vjnDwACTs5gQ

Ответить
Развернуть ветку
Ospanov Serik
Автор

Здорова, кстати.

Ответить
Развернуть ветку
5 комментариев
Ospanov Serik
Автор

Жидковато.

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Андрей Андреевич

gsl-news.org я вот такое сделал. Правда без подписок. Редактор editorjs

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
2 комментария
Uzabila

Хорошо получилось. На чем запилен?

Ответить
Развернуть ветку
1 комментарий
Ospanov Serik
Автор

Круто!

Ответить
Развернуть ветку
Nikolay Kenig

Ого! Статья от Создателя!
Хоть буду знать кто это.
Или вы не создатeль vc?
А посмотрите на мою "копию" vc
https://wbforum.ru/

Ответить
Развернуть ветку
Uzabila

Переделанный InstantCMS?

Ответить
Развернуть ветку
1 комментарий
Ospanov Serik
Автор

Прикольно.

Ответить
Развернуть ветку
Виктор Степаньков
«Leonardo» (хранилище и отдача статики) это еще одна вещь, аналоги которой активно используются во многих сервисах. Понимание того, что не нужно резать картинки и хранить их при загрузке это интересный опыт, который пришёл ко мне во время написания сервиса.

Поздравляю, вы изобрели Drupal

Ответить
Развернуть ветку
Valeratal Val

это байда и до друпала была. 

Ответить
Развернуть ветку
2 комментария
Олег Михалевич

Типичная проблема. "Без мам, пап, кредитов, команды и инвестиции стал разработчиком схожего сервиса". А зачем, что это дало, столько времени потрачено... не известно.

Ответить
Развернуть ветку
Ospanov Serik
Автор

Ну, работал учителем географии и получал около 10к. Посмотрел на сайт "Комитета", захотел сделать такой. Научился программировать. Теперь делаю 300 к в наносекунду.

Ответить
Развернуть ветку
2 комментария
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Nikolay Vavilov

что, динамические страницы парсить сложновато? 

Ответить
Развернуть ветку
2 комментария
Askar Seitov

Пардон, я что-то не понял. Вы создали движок vc?

Ответить
Развернуть ветку
Ospanov Serik
Автор

Раньше я работал в компании "Комитет", но меня уволили! я хочу отомстить ублюдкам за это, что уволили квалифицированного работника! Я знаю про секретный запрос для повышения рейтинга постов на любом аккаунте. Если хотите узнать, то регистрируйтесь на https://ranbu.ru.

Ответить
Развернуть ветку
Nikolay Vavilov

Них не понял.
Ну написал и написал. В чем суть то? что за 2 года можно сделать клон чего-то самостоятельно? 

Ответить
Развернуть ветку
Ospanov Serik
Автор

Ну, написал и написал. Чего бухтеть то. Тоже не понимаю.

Ответить
Развернуть ветку
Иван Колыхалов

Хочу этот движ на своем сервере. Хочу перенести свой проект. Не хочу зависеть от ваших хостингов. Как купить\лицензировать\опенсорснуть?

Ответить
Развернуть ветку
Yury Grinev

Чем не устраивает любое опенсорс решение то?

Ответить
Развернуть ветку
4 комментария
Denis

Молодец. А опенсорс будет? Пока не встречал типа опенсорсного UGC-WordPress

Ответить
Развернуть ветку
Сергей Мазур

Если вы имеете ввиду функционал коллективного блога, то таких решений много.

Ответить
Развернуть ветку
Причинно-следственная связь

WordPress +- с коробки умет. Нет? 

Ответить
Развернуть ветку
Vadim Semenov ‏⚡☟

это на хабрахабр

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
33_rublya

Кради, как художник

Ответить
Развернуть ветку
максим яценко

почему все такие злые?! Нищие и голодные?! Человек рассказал свою историю. поделился опытом. и очень правильно сделал!

Ответить
Развернуть ветку
Вася Пражкин
 почему все такие злые?! Нищие и голодные?!

Так день был - трезвые. 

Ответить
Развернуть ветку
Where Filmed

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

Ответить
Развернуть ветку
Ware Wow
По моему скромному мнению, именно редактор стал той вещью, что предопределила развитие проектов «Комитета».

Имхо нет, это невозможно. Причем тут движок? Как за счет движка, CMS, можно сделать лидирующее СМИ?

Ответить
Развернуть ветку
Yuri Trenin

По нынешним временам это несложно. Просто разрешите говорить людям, то что они думают.

Ответить
Развернуть ветку
Mario Kun

Возможно, что проект выйдет в open source ?)

Ответить
Развернуть ветку
Ospanov Serik
Автор

Не знаю, если научусь программировать, то возможно, но не сразу. Очень долго учусь: гуманитарии.

Ответить
Развернуть ветку
2 комментария
Viktor Mann

Так а как Osnova -то получить? Есть фри версия или покупать?

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку
Denis Novikov

Текст для тех кто в теме

Ответить
Развернуть ветку
Ospanov Serik
Автор

Спасибо, кто отредактировал пост. Русский не родной, да и с головой проблемы, поэтому, пишу как умею.

Ответить
Развернуть ветку
Valeratal Val
Благодаря этому продуманному инструменту, издательский дом «Комитет» смог стать одной из основных контентных площадок в «рунете»

Это также глупо, как "благодаря нашей строительной тачке был построен этот дом"
инструменты практически ничего не решают 

Ответить
Развернуть ветку
Daniil Khanin

понадобился тут мне редактор на свой сайт, причина была простой, мне нужен код, который не тянет ничего что может ставить не контролируемые куки. Пришлось писать свой.
Но этот код в паблик не пойдет ;)

Ответить
Развернуть ветку
Alexander Belousov

Сделано интересно. Будете выкладывать в open source или продавать лицензию ?

Ответить
Развернуть ветку
Pavel Loginov

Весьма странный взгляд программиста на существующий проект. Видит не проблемы создания комьюнити, привлечения авторов, редактуры, администрирования... Нет! Если хочешь быть как комитет, тебе нужен просто схожий движок... смешно... завтра фейсбук пойдете клонировать, да?

Ответить
Развернуть ветку
Yuri Trenin

Комьюнити уже давно создано и выбирает куда приземлиться уже из 5 вариантов. Ranbu выглядит наиболее проработанным клоном. Если Серик делигирует креативную часть сообществу на демократических принципах, то проект очень даже может выстрелить.

Ответить
Развернуть ветку
77 комментариев
Раскрывать всегда