Илья Зыкин. Pro Жизнь

HTML визуализатор

Микро проектик для лекций по HTML

- Выдает все возможные HTML теги в алфавитном порядке.

- Позволяет выбрать группу тегов по типу и увидеть ее в общей "таблице"

- После выбора группы тегов внизу появляется список тегов с описанием. В процессе сортировка по частоте использования.

- При клике на тег переход на MDN для получения более подробной информации.

https://github.com/the-teacher/HTML

Релиз прошел успешно

Сегодня запустили новогодний проект для команды.

Это мини проект для коллектива, где можно выиграть подарки на новый год.

Проект небольшой, но под капотом полный стек React и NodeJS. + Деплой, докер и мониторинг. Проект был полностью под под моей ответственностью. Мы его дожали.

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

Дед Мороз уже начал раздавать подарки хорошим мальчикам и девочкам.

С наступающим! И вам легких релизов!

Подготовка

Сделал простое решение на HTML для более наглядного изучения HTML 🤣

Таблица представляет собой список всех возможных HTML тегов.

В селекторе можно выбрать группу и увидеть какие теги в нее входят.

Хотите узнать какие теги блочные, или какие инлайн? Какие теги для оформления списков или для таблиц — пожалуйста! Выбираешь группу и вот они!

Таблица поможет увидить HTML в целом и группы тегов в частности.

Ну а мне поможет при записи следующей открытой лекции.

Мой голос прозвучал на весь Стамбул 😂

Ездили в mall of Istanbul. Ходили в игровой центр. Там в Молле мини парк (высотой в 3 этажа) аттракционов.

Я пошел покататься на горках, сумку с телефоном и деньгами оставил жене.

Ну и конечно на выходе мы не встретились. Ходили кругами друг за другом и друг друга так и не нашлись в этом шуме и большом пространстве.

В итоге мне надоело, я пошел на кассу и говорю - ребята, деньги, кошелек, телефон в сумке, а сумка у жены с ребенком. Я потерялся. Спасите, помогите.

Они врубают микрофон и я говорю на весь огроменный многотысячный Молл. «Анна и Матвей, ваш папа ждет вас у кассы на втором этаже игрового центра»

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

Самое интересное, что рядовой сотрудник просто включил микрофон и врубил меня на весь ТЦ. Ну, мальчик 40 лет потерялся в игровом центре. Ну как не помочь?! 😂

Илья Зыкин. Pro Жизнь pinned a file

4. Итоги

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

- работать с ssh соединением (по ключу)
- уметь работать с git и пушить на сервак
- знать о git bare репозиториях
- знать о git hooks (хуках)
- уметь настраивать NGINX
- уметь в Docker
- запускать в докере через Docker Compose Nginx и Backend
- уметь писать Makefile и автоматизировать рутинные операции

(Опционально) хорошо бы знать как настроить DNS и получить бесплатные сертификаты для вашего сайта.

На практике все эта работа занимает от 15 минут до 4 часов. Смотря какие обстоятельства.

Деплой это просто!

3. Обновление всего

Git bare репозиторий легко может отследить то, что в него поступил новый код. Запустить соответствующий хук.

Простейший скрипт отработает и обновит код самого проекта. Но что делать с перезапуском сервисов?

Поскольку все сейчас запускается в докере, а Docker + Makefile это самая классическая и убойная связка, то я в хуке гит репозитория в самом конце прописал только одну команду make update — а уж как она реализована на уровне проекта и что делает — это специфика конкретного проекта.

Обычно нужно компилировать ассеты фронта.

Обычно нужно перезапускать бэкенд.

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

2. Доставка кода

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

Да, я бы не побрезговал (S)FTP для того чтобы закинуть код на сервер.

Если мне не надо поднимать 10+ серверов — я легко автоматизирую все руками и баш скриптами.

Если сервер один, то и того проще.

Не все об этом знают, но git позволяет на удаленном сервере создавать так называется BARE хранилища.

Это репозиторий без фактического кода, только с техническими данными о проекте.

Можно с локального компа закинуть код на сервер в bare хранилище.

В bare репозитории можно настроить hook который при получении новой порции данных будет обновлять основной проект и перезапускать нужные сервисы.

Те. Принцип простой.

1) Я делаю с локального компьютера git push
2) Только небольшой фрагмент свежих изменений уходит на сервер.
3) Проект автоматически обновляется и сервисы перезапускаются.

Красота!

Деплой на практике

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

Но деплоить то все таки и мне надо.

Как бы это организовать? Как это работает, если под рукой нет кубернетиса, а ансибл заржавел или потерялся.

1. Изучаем инфраструктуру.

Вероятно, в проекте есть девопс — этот такой современный сис. админ.

Девопс может создать вам инстанс (сервер) в облаке и дать вам доступ по SSH ключу.

Вероятно, перед сервером будет стоять какой-то CDN или сервис, который сам на себя возьмет обеспечение доступа к проекту по HTTPS. Сам разберется с сертификатами. Даже про покупку сертификатов или letsencript думать не придется.

Сфокусируемся на нашем проекте.

Про английский язык

Последние 12 лет я работаю с клиентами со всего мира. Много работаю с американцами. Провожу интервью на английском языке.

У меня фантастический английский!

Примерно 70% того что говорят — я просто не слушаю. Там нет ценной информации.

Из оставшихся 30% я понимаю примерно 30%. Иногда вообще не ничего понимаю.

Я умею переспрашивать. Мне повторяют, и я опять переспрашиваю. Пока из часового звонка я не пойму те нужные 5% информации которые мне нужны для работы.

У меня чудовищный славянский акцент. Я даже не пытаюсь его скрыть.

Я знаю и умею применять все основные 12-18 времен. Но по факту использую максимум 4.

Я не могу смотреть фильмы на английском. Я не понимаю юмора. У меня нет для этого культурного слоя носителей.

При этом я неплохо зарабатываю работая в командах с нейтив спикерами и людьми со всего мира. Даю лекции и презентации на английском. Коллегам нравится.

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

С кодом так же. Ты точно сможешь!

После тяжелых будней программиста, хочется чего-то легкого. Например, Heavy Metal + Symphony orchestra концерт.

Алгоритмы. Что правда не знаешь? (Часть 2)

А вот что действительно нужно знать об алгоритмах — этого никто не формулирует и на интервью не спрашивает.

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

Просто у людей нет опыта и никто им не подсказывал как это сделать лучше.

Кто-то скажет, Илья, ты говоришь что-то странное. Я про такое никогда не слышал(а). Такого не бывает.

А я отправлю вас на новости о сливе кода алгоритма сортировки и назначения весов одного крупного поисковика в зоне RU. Кто захочет, тот найдет (было пару лет назад).

И окажется, что те, кто спрашивает за алгоритмы — сам делает все черти как и лишь бы работало.

Будем учиться у лучших на рынке. Если и они делают деньги — нам-то чего страдать?!