В детстве у меня была Mattel Auto Race — портативная игровая консоль со встроенным LED-экраном с красными светодиодами, элементами управления, одной игрой и динамиками. Почему-то я однажды о ней вспомнил и субботним вечером решил создать версию игры, используя p5.js. Сначала дела шли хорошо: я поработал над встречными автомобилями и логикой создания и удаления автомобилей. Затем я решил немного усложнить игру, добавив немного рандома в процесс появления автомобилей.

Вот тогда я столкнулся с проблемами. Что-то было не так с тем, как я управлял таймингом — я никак не мог заставить машины появляться в нужном мне порядке. Повозившись с разными вариантами, я так и не понял, что не так, и разочаровался. Прошло 2 дня, а я так и не могу вернуться к проекту, чтобы не сталкиваться с досадой и чувством разочарования.

Но оказалось, что так и должно быть.

• Простые компоненты — Stateless function
• JSX распределение атрибутов — JSX Spread Attributes
• Деструктуризация аргументов — Destructuring Arguments
• Условный рендеринг — Conditional Rendering
• Типы потомков — Children Types
• Массив как потомок — Array as children
• Функция как потомок — Function as children
• Функция в render — Render callback
• Проход по потомкам — Children pass-through
• Перенаправление компонента — Proxy component
• Стилизация компонентов — Style component
• Переключатель событий — Event switch
• Компонент-макет — Layout component
• Компонент-контейнер — Container component
• Компоненты высшего порядка — Higher-order component

Реакт это все что вам нужно для управления состоянием вашего приложения.

Управление состоянием это одна из сложнейших задач при разработки приложения. Вот почему каждый день появляются все новые и новые библиотеки для управления состоянием, их становится все больше и больше, причем многие из них разрабатываются поверх уже существующих решений. В npm вы можете найти сотни "упрощенных Redux" библиотек. Однако, несмотря на то что управлять состоянием сложно, одной из причин того почему так получилось стало именно то что мы слишком переусложняем решение проблемы.

Существует метод управления состоянием который лично я пытаюсь применять еще с тех пор как я начал использовать Реакт. И теперь, после релиза хуков (hooks) и улучшения контекстов (context), этот метод управления состояниями стало очень просто использовать.

В этой статье я хочу затронуть еще одну задачу, с которой вы можете столкнуться на собеседовании на позицию Front-End — создание Star Rating виджета.

За последние пять месяцев у меня было 15 онсайт собеседований, а также офферы от Google, Roku, Microsoft и других компаний.

Вы должны уточнить требования и реализовать этот виджет в течение ~ 45–50 минут.

Для джуна поиск работы похож на полосу препятствий. Тот, кто успешно преодолел ров с крокодилами, катящиеся шары, лаву и дротики с ядом, получает приз — классную работу. 

Всем привет, это Макс Кравец. В 2021 году я написал серию статей о том, почему джуны никому не нужны и куда катится рынок зарплат разработчиков в IT. В них я посмотрел на вопросы со стороны нанимателя. Рассказал, почему джуны — это рисковая инвестиция. Дал общие советы, как новичку не застрять на начальном уровне, прокачать самостоятельно soft- и hard-скиллы и достигнуть желаемого роста в зарплате. Спустя полгода я решил дополнить эти материалы. 

Базово Yii2 из коробки предлагает нам архитектуру приложения по шаблону MVC (модель, представление, контроллер). Для более сложного приложения прибегаем к чистой архитектуре и в рамках неё необходимо отказаться от Active Record в шаблонах (представлениях), т.к. Active Record это часть слоя по работе с базой данных, о которой другим слоям знать не нужно. Предполагаем, что мы хотим продолжить использовать встроенные виджеты по отображению данных в представлениях: DeatilView, ListView и GridView. Последние два используют ActiveDataProvider, который в себе содержит Active Record модели - цель данной статьи избавиться от них и использовать только DTO.

Привет хабровцы и любители фронтенда!

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

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

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

Меня всегда очень интересовала довольно грустная ситуация с языком РНР. Из неказистого шаблонного движка для веб-страничек, к середине 2010-х он вырос в мощный, современный и аккуратный язык программирования… в то время как практически все обучающие материалы в сети выставляют его всё тем же неуклюжим уродцем, который с огромным трудом, не соблюдая никаких стандартов, позволяет разве что сделать примитивную веб-страничку с кучей уязвимостей. Что, разумеется, уже давно совершенно не так. Поэтому когда на форуме РНР клуба появился пост о наборе "наставников" на курс по РНР в HTML Academy, я не раздумывая подал заявку. Чтобы посмотреть как с обстоит с этим дело на платных курсах, а так же по возможности поделиться своим опытом в этой области.

Что вам сказать? "Если хотите, чтобы вам и дальше нравилась колбаса, не берите экскурсию на мясокомбинат"

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

То же самое происходит и в интернете. Блуждая по интернету в поисках необходимого, вы натыкаетесь на самый подходящий на первый взгляд сайт и заходите на него.

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

Это несерьёзная статья на серьёзную тему. Есть такое понятие, как JSDD - Job Safety (Security) Driven Development, мы часто видим его в крупных компаниях. От этого не избавлены и небольшие компании, особенно когда в штате всего несколько программистов. Разработчики пишут свой код столь изысканным способом, что, несмотря на очень низкую скорость разработки, их страшно уволить, потому что, кроме них, этот код никто понять не сможет. Давайте попробуем разобрать, почему и как такое происходит.

В свете исследования "Веб-разработчики пишут небезопасный код по умолчанию" мне подумалось, что именно так может звучать один из базовых вопросов на собеседовании с точки зрения проверки знания web-разработчика от уровня Junior до Senior.

Тема с одной стороны в общем-то простая, а с другой - многогранная. Можно сделать “на коленке”, а можно и “по-взрослому” -  зависит от знаний конкретного девелопера и технического задания. Ну и не привязывается к конкретному языку. Что nodejs, что .net, что PHP - на ответы это не влияет. Ну и отлично же! Давайте попробуем.

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

Как бы вы ответили на конкретный вопрос? Попробуйте проверить себя и потратить пару минут на обдумывание прежде чем читать ответ.

Восклицательным знаком ⚠ помечены вопросы, на которых можно "засыпаться" и оставить плохое впечатление о себе у интервьюера. Так же я позволил себе добавить еще пункты, которые подразумевают "Регистрацию", но по касательной. Многие ответы обрамил ссылками, которые помогут разобраться чуть глубже в конкретном вопросе, думаю будет полезно.

Итак, за вёсла!

Пролог

Живу я в не очень продвинутом ауле, что раскинулся в Карачаево-Черкесии, и точно не помню как вышел на издательскую площадку для html-игр Gamepix. То ли через знакомых чабанов, то ли от приблудившихся джейранов-шатунов. Редкий поисковик или геймерский телеграм-канал долетает до моего населенного пункта.

Регистрация и настройка

С регистрацией на дистрибьюторской площадке проблем не возникло. Всё как у всех: логин, пароль и, здрасти, дашборд. Так как я разрабатываю игры на Construct 3, то буду рассказывать всё в контексте этого движка. Думаю, адепты Unity и фанаты других движков тоже почерпнут для себя что-то полезное. Качаешь плагин, подключаешь штатными средствами констракта через Addon manager. Menu>View>Addon manager. Думаю, тут сложностей не возникнет.

Если вам нужен SSL-сертификат, но вы не являетесь специалистом в веб-технологиях, то эта заметка для вас. Описан простой способ выпуска базового SSL-сертификата Let’s Encrypt в ручном режиме, на локальном компьютере с Windows, с помощью приложения Certbot. Этот способ позволяет получить файлы SSL-сертификата в папку на своём локальном компьютере, после чего можно установить сертификат на свой хостинг.

Потребность в SSL-сертификатах возникла у меня в связи с тем, что срок старых истёк, а создать новые оказалось невозможным из-за возникших ограничений на доменные зоны RU и РФ. Если у вас такая же проблема или вам просто надоело искать веб-сервис для выпуска SSL-сертификатов, то эта заметка вам поможет.

Поскольку я пока не знаю наилучшего пути, то ниже просто опишу ту последовательность действий, которую сам выполнил и которая позволила мне создать SSL-сертификаты для десяти своих доменов (в том числе в зонах RU и РФ), а значит и вам этот способ может помочь.

Привет, Хабр. Меня зовут Мария, я работаю в вебе с начала нулевых, то есть с засилья статичных HTML-страниц. С тех пор я освоила много новых технологий и прошла массу собеседований. Сегодня хочу поделиться опытом: что спрашивают у JS-джунов и какие тестовые дают при приёме на работу.

Тени помогают сделать визуальную составляющую сайта интересной и эстетичной. В посте рассмотрим свойство CSS box-shadow и то, как его можно стилизовать.

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