Chulakov Dev – Telegram
Chulakov Dev
1.15K subscribers
140 photos
5 videos
205 links
Канал команды разработки Студии Олега Чулакова.

Советы по Frontend- и Backend-разработке web-сервисов, мобильных приложений, статьи и презентации от наших разработчиков, анонсы проектов и многое другое.

Обсудить проект @YuraAndreev
Download Telegram
Слоты в React.js
#frontend #react

Современные frontend-библиотеки и фреймворки для работы с UI, будь то React, Angular или Vue.js, решают важную задачу разделения интерфейса на отдельные компоненты. У каждой такой библиотеки свой синтаксис, API и подходы к реализации компонентов.

Работая с различным стеком технологий, специалисты Студии выделили одну полезную особенность в API распределения контента у фреймворков Vue.js и Angular — слоты. Мы решили перенять такой подход для своих React-приложений.

В React-компонентах по умолчанию дочерние элементы можно добавить только в определенное место JSX-разметки.

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

Такую задачу мы решаем с помощью API React.Children. Используя методы объекта Children, мы можем легко разделить список дочерних элементов на несколько отдельных групп — слотов. Все, что нужно сделать, — в цикле сопоставить тип дочернего элемента с компонентом, от которого он был создан.

Для наглядной демонстрации мы подготовили небольшой пример, в котором решена задача с разделением свойства children для компонента страницы. В результате было выделено три слота: header, content, footer.
Способы слияния массивов в PHP
#backend #php #basics

Работа с массивами является неотъемлемой частью жизни PHP-разработчика. В массивы поступают выборки данных из БД, результаты чтения файлов и обращений к внешним API — список таких операций весьма велик.

Крайне часто необходимо сливать несколько массивов в результирующий с различными артефактами на выходе. Рассмотрим способы слияния и их отличия.

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

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

Есть два важных момента: при перемене мест слагаемых сумма меняется 😱; если в слагаемых массивах имеются значения с одинаковыми числовыми ключами, то итоговый массив будет содержать значение первого слагаемого.

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

Оценить разницу в работе трех способов слияния можно в «песочнице».
Азы безопасности в PHP от Александра Макарова
#backend #php #security

Используя современные библиотеки и фреймворки, мы не задумываемся о том, как их механизмы обеспечивают безопасность нашего приложения. Например, как шифруются и хранятся пароли пользователей, как валидируются email- и IP-адреса, указанные в формах ввода, как работают с данными объекты-обертки, предоставляющие доступ к HTTP-заголовкам, cуперглобальным переменным.

Если грамотно использовать современные фреймворки, то также можно в меньшей степени задумываться и об SQL-инъекциях и XSS-атаках. А если мы делаем что-то не так? 🤔

Рекомендуем посмотреть выступление Александра Макарова про базовую безопасность в PHP.

Основной тезис доклада — «нельзя доверять данным, несмотря ни на что».

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

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

Chulakov Dev
Nginx: PHP и Node.js под одним доменом
#devops #backend #frontend

Планируя архитектуру веб-сервиса с SPA и RESTful API, мы часто применяем несколько разноуровневых доменных имен. Например, на домене some-site.ru размещаем основное клиентское приложение, а на поддомене api.some-site.ru — backend-приложение с API. Это могут быть два различных веб-сервиса на абсолютно различном стеке.

Рассмотрим, как организовать общую маршрутизацию http-запросов между двумя сервисами под одним доменом. Разделять запросы по сервисам будем с помощью префиксов в части URI. Например, http-запросы, поступающие на адрес some-site.ru/api/some-method-route, будут проксироваться на сервис php-fpm, остальные запросы, без префикса api, будут уходить на upstream c Node.js.

Для решения такой задачи необходимо написать правила для веб-сервера Nginx, который должен выступать в виде fastcgi- и http-прокси-сервера одновременно, а также маршрутизировать соответствующие запросы по двум различным upstream-целям.

Для наглядности и понимания общей архитектуры мы собрали небольшой проект. В директории ci располагаются инструкции по сборке Docker-образов для доставки их, например, на серверы с Docker Swarm.

Отдельного внимания заслуживает файл конфигурации Nginx.

Для того чтобы роутинг и окружение в PHP работали верно, нам необходимо произвести модификацию некоторых fastcgi-параметров, которые впоследствии становятся ключами суперглобального массива $_SERVER на уровне PHP.

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

Все исходники проекта располагаются в директории src, внутри которой они делятся на два изолированных типа, которые впоследствии будут собраны в два различных образа — PHP и Node.js. Таким образом, финальная поставка продукта будет состоять из трех образов: Nginx, PHP-FPM и Node.js.

Chulakov Dev
💩1
Веб-разработка. Подборка полезного контента для новогодних праздников
#frontend #backend

Специалисты Студии Олега Чулакова поздравляют вас с наступающим Новым годом. А чтобы праздники прошли с толком, наши разработчики подобрали несколько интересных YouTube-каналов.

Frontend-разработка:

https://youtube.com/c/WebDevSimplified — про fullstack-разработку на JavaScript;
https://youtube.com/c/YauhenKavalchuk — про frontend-разработку;
https://youtube.com/c/GoogleChromeDevelopers — разборы новых фич и объяснение существующих технологий;
https://youtube.com/c/VladilenMinin — туториалы по технологиям, которые нужно знать здесь и сейчас;
https://youtube.com/c/TraversyMedia — туториалы с fullstack-уклоном;
https://youtube.com/c/pepelsbey — подкасты и выступления Вадима Макеева на тему frontend-разработки и верстки;
https://youtube.com/c/Web-standardsRu — знаменитый канал «Веб-стандарты» — подкасты и беседы с ведущими специалистами направления;
https://youtube.com/c/HolyJS — доклады участников конференции HolyJS;
https://youtube.com/user/shiffman — Coding challenge, по большей части рисование на канвасе на p5.js, и здесь можно прокачать свой английский 🏴󠁧󠁢󠁥󠁮󠁧󠁿

Backend-разработка:

https://youtube.com/c/PHPPoint — набирающий популярность канал PHP-разработчиков;
https://youtube.com/c/HexletOrg — канал онлайн-университета Хекслет;
https://youtube.com/c/BadooTech — технический канал «Баду»;
https://youtube.com/user/codefestru — канал конференции разработчиков CodeFest.

Приятного просмотра и всего наилучшего в Новом году 🎄

Chulakov Dev
💩1
Трейты в PHP — зло? Наш взгляд на проблему
#backend #php

В конце прошлого года перед релизом PHP 8 ведущие разработчики языка высказались про неудачную реализацию трейтов в PHP. А после прошел интересный батл «Трейты в PHP — зло?».

Мы относимся к написанию и использованию собственных трейтов с большой осторожностью, стараясь их избегать. И вот несколько причин:
— трейты могут увеличивать связанность (coupling) вашего кода;
— частично решают проблему переиспользования типового инфраструктурного или обслуживающего кода, при этом несут опасность накопления бизнес-логики в руках новичка;
— трейты фактически не определяют структуру и не являются типом, но при этом позволяют применять внутри своих методов конструкции ООП. Например, вызов конструктора или обращения к контексту $this. При этом разработчик не может гарантировать, что поведение класса, к которому будет подключен трейт, совпадет с ожидаемым поведением логики работы методов трейта.

А как вы относитесь к трейтам в PHP?

Chulakov Dev
2💩1
Быстрая сортировка массива по внешнему списку в PHP
#backend #php #lifehack

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

Рассмотрим пример, когда эталонная последовательность идентификаторов, по которой должны быть отсортированы элементы массива $items, хранится в переменной $orders.

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

Для получения более оптимального и красивого решения задачи такой специфической сортировки мы воспользовались несколькими стандартными PHP-функциями для работы с массивами.

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

Поэкспериментировать с работой алгоритма можно в «песочнице».

Chulakov Dev
💩1
PHP Intl. Правильная транслитерация кириллицы
#backend #php

Современные фреймворки предоставляют готовый функционал в составе библиотек или хелперов для работы с библиотекой ICU через API Intl.

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

В разделе «Телеграм-каналы» сайта Студии во время автоматического импорта постов из наших каналов производится транслитерация названий заметок для формирования ЧПУ.

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

Например, уникальная часть URL заметки про релиз PHP 8 после транслитерации имела вид php-8-pocti-novogodnij-podarok. Замена некоторых букв произошла некорректно.

Для того чтобы транслитерация кириллицы производилась по традиционным правилам, необходимо произвести конфигурацию объекта-транслитератора, передав следующее значение параметра $id:

Russian-Latin/BGN; Any-Latin; Latin-ASCII; NFD; [:Nonspacing Mark:] Remove; NFC;

После такой конфигурации результат преобразования наименования заметки изменится на php-8-pochti-novogodniy-podarok.

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

Chulakov Dev
🔥2💩1
7 важных факторов PHP-приложения
#backend #devops #php

Инженеры платформы Heroku на основе собственного опыта создали методологию для разработки SaaS-приложений.

Эта методология учитывает три важных аспекта:
— расширяемость — развитие кодовой базы и функционала;
— сопровождаемость и возможность командной работы над проектом;
— масштабируемость.

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

Кодовая база. Забота о коде начинается с принципов его версионирования и хранения. Используйте Git Flow или его адаптацию с учетом специфики работы ваших команд.

Зависимости. Используйте менеджер зависимостей Composer и его основные операции install и update для манипуляций c composer.json и composer.lock.

Конфигурация. Предпочтительным методом обработки конфигурации является использование переменных среды. Для работы с ними мы применяем компонент symfony/dotenv.

Параллелизм. Выполняйте процессы в фоне, тем самым снижая время отклика при взаимодействии с вашим сервисом. Выделяйте веб-процессы в реальном времени и рабочие процессы. Первые принимают http-запросы от клиента, а вторые — выполняют фоновые задачи, например, с помощью брокера сообщений RabbitMQ.

Паритет разработки/работы приложения. Для того чтобы обеспечить схожесть сред разработки, тестирования и продакшена, мы используем виртуализацию на основе Docker и специально подготовленные образы, содержащие одинаковые наборы и версии библиотек. Промышленные и тестовые среды отличаются лишь степенью масштабирования, на основе технологий K8S и Swarm.

Журналирование. Фактор утверждает, что приложение должно просто писать в STDOUT и STDERR, а среда должна отвечать за маршрутизацию этих сообщений в хранилище. Технология PHP-FPM позволяет производить вывод логов в STDOUT, что крайне полезно при работе с Docker-контейнерами. Для организации процесса логирования на уровне приложения мы используем сторонние внешние библиотеки, например Monolog или компоненты фреймворков.

Задачи администрирования. Реализовать сценарии администрирования приложения можно с помощью внешних библиотек, например Symfony Console. Большинство современных фреймворков имеют встроенные средства для организации запуска консольных команд для служебных целей и миграций. Например, в Yii Framework есть понятие консольного приложения и команды.

Chulakov Dev
💩2
Всем привет! 👋

Всего за 3 недели ситуация в мире и на рынке труда изменилась кардинально. События продолжают развиваться, уровень неопределенности растет. Компании уходят с рынка, меняют полностью бизнес-модели и стратегии. Все это сказывается на сотрудниках и их карьере.
💩1
Приглашаем вас на прямой эфир в среду, 23 марта, в 19:00 в telegram-канале @chulakov_team

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

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

Тема эфира: «Карьера в новой реальности».

Спикеры: Анна Гусева, HR-директор и Елена Рыжикова, менеджер по развитию персонала в Студии Олега Чулакова.

Что обсудим:
— как изменилась ситуация на рынке digital- и IT-специалистов;
— как и в какую сферу совершить карьерный переход;
— какие компетенции привлекают работодателей;
— как адаптировать свой опыт в резюме для успешного трудоустройства;
— как справляться со стрессом в нестабильное время.

У вас будет возможность задать вопросы в эфире нашим экспертам.
👍7🔥3👏2💩2
Всем привет 👋

Напоминаем, что сегодня в 19:00 в telegram-канале @chulakov_team мы проводим прямую трасляцию на тему «Карьера в новой реальности».

В канале @chulakov_team уже сейчас вы можете задавать вопрос на эфир в комментариях.
7💩5🔥2
This media is not supported in your browser
VIEW IN TELEGRAM
💩8🔥6
На случай важных переговоров
сделали свой анимированный
стикерпак 🔥

Используйте стикеры
по зову сердца. Они скрасят
пребывание в рабочих чатах
и помогут лучше понимать друг друга.
💩17🔥10😁1
​​Ковариантность и контравариантность

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

Эти термины используются в типизированных языках программирования: Java, JavaScript, PHP, C, C++, C#, Python и др. Ковариантность и контравариантность описывают совместимость типов по отношению друг к другу. Вместе они обеспечивают механизм типобезопасности. Она отвечает за надежность системы типов, которая считается безопасной, если исключаются ошибки согласования во время выполнения.

Разберем сложные термины на простых примерах — на котиках и собачках.

Ковариантность позволяет уточнять тип возвращаемого значения. То есть при наследовании мы можем повысить возвращаемый тип с «животного» до «кошки» или «собаки». Примеры php, ts.

Контравариантность позволяет снижать требования для входных параметров. То есть при использовании в коде «кошки» или «собаки», если мы понимаем возможность работать напрямую с «животным», мы можем понизить требования в наследуемом коде. Пример php, ts.

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

Chulakov Dev
👍25🔥4😁2🎉1
В эту пятницу у нас состоялось два важных мероприятия.

Впервые прошла встреча Design Fresh, где участники разобрали самые интересные и свежие примеры из собственного опыта и сферы дизайна в целом.

Также стартовала серия митапов по технологиям Frontend-разработки для неразработчиков, которую мог посетить любой, кто стремится говорить на языке digital.

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

Чтобы узнать больше о мероприятиях, которые проводит Студия, следи за анонсами на карьерном сайте. У тебя есть возможность попасть на открытое мероприятие, а также отликнуться на вакансии и присоединиться к команде единомышленников Chulakov Team.
👍7🔥5😁1
Ростов-на-Дону, мы проводим круглый стол по разработке для всех IT-компаний!

Обсудим проблемы выбора стратегии версионирования

Среди участников дискуссии уже:

Илья Караваев, Backend Development Team Lead, Студия Олега Чулакова.
Альберт Рыбалко, Frontend Development Team Lead, Студия Олега Чулакова.
Олег Бондаренко, Development Team Lead, Tapfiliate.
Кирилл Нога, Web Developer, Motorsport Network.
Иван Поддубный, CTO, Webpractik.

г. Ростов-на-Дону, Театральный пр., 85, коворкинг «Рубин»

7 июля 2022 г. в 19:30

Если Git для тебя не пустой звук — приходи, будет интересно!

Регистрируйся прямо сейчас 😉
🔥11
7 июля у нас прошел круглый стол по разработке на тему «Проблемы стратегии версионирования» ⚡️

Мероприятие посетили более 70 специалистов разных направлений: Frontend, Backend, QA и другие 🔥

Благодаря разработчикам Студии и приглашённым спикерам мы глубоко погрузились в тему версионирования: заглянули на внутреннюю кухню разных компаний, обсудили отличные примеры из рабочей практики с нескольких точек зрения.

Спасибо спикерам и участникам за вклад в мероприятие!

Фото и запись круглого стола уже доступны для просмотра 📸
🔥16👍3