FrontLine
СтатистикаЧатик: https://t.me/+tKNCZtkU2aNmYjBi Блог: https://shiryaev.io/blog Заметки о Web-разработке, программировании и про фронтенд в целом. Пишите: @Alexshir1993
- Последний пост
- 2 июл.
- Последнее чтение
- 14:34
- Постов за неделю
- 0
- Всего постов
- 36
- Тип
- открытый
- Язык
- русский
- Категория
- Технологии
- В каталоге с
- 13 авг.
- 1/24сутки в ленте
- —
- 1/48двое суток
- —
- 1/72трое суток
- —
Оценка по просмотрам недавних постов: пост набирает почти всё за первые сутки.
Посты
Подсмотрел у коллеги по цеху классный сервис для мониторинга наличия бензина и очередей ⛽️ https://gdebenz.ru/
CSS shape-outside — плавучий текст 🏖️ Если тебе надо, чтобы текст обтекал по какой-то странной форме, которую задумал дизайнер, то сразу вспоминай про shape-outside. Он может так: shape-outside: circle(50%); shape-outside: ellipse(130px 140px at 20% 20%); shape-outside: polygon(10px 10px, 20px 20px, 30px 30px); shape-outside: linear-gradient(45deg, white 150px, red 150px); И даже так: shape-outside: url("image.png"); А в Chrome 149+ (пока в бете) вообще вот так (пример из видоса): shape-outside: shape(from 0px 0px, line to 100px 0px, curve to 150px 100px with 100px 40px / 150px 60px, curve to 100px 200px with 150px 140px / 100px 160px, curve to 50px 300px with 100px 240px / 50px 260px, curve to 100px 400px with 50px 340px / 100px 360px, line to 0px 400px, close); CodePen поигарться (Chrome 149+) MDN документация
Это одна из самых полезных AI-находок для ускорения исследования и изучения чужого кода! 🚀💻 https://deepwiki.com/ 🔗 Сервис сканирует публичные репозитории GitHub, предоставляет качественный AI-анализ архитектуры и связей, генерирует примеры кода и отвечает на вопросы по кодовой базе с пояснениями. 🤖🧠
Когда загрузил AI агентов и везёшь их на разработку нового проекта
Ситуация в найме ахтунг. Все и так все понимают. Но я хочу сделать очередное напоминание. Когда где-то возникает большой спрос, то скаммеры всегда найдутся. Случаи нередкие и происходят уже со знакомыми с определенной частотой Поэтому напоминание: НИЧЕГО не ставьте на комп связанное с работой до последнего. - ни для тестового задания! - ни для интервью! - ни для работы в первый день (если работаете неофициально)! Ни приложения, ни установки "пакетов содержащих апи" НИ ЧЕ ГО. Если вас вынуждают, то используйте: - дев окружения: CodeSandbox, Stackblitz и тп - если все же нужно со своего и хоть какое-то доверие есть, то используйте Dev Container или как самый минимум просто докер - для выхода на новой работе тоже лучше соблюсти меры предосторожности, особенно если никаких реальных документов вы не заключали. Докер, в идеале отдельная система и отдельный пользователь, чтобы даже в случае проблемы вы не потеряли доступ к устройству и данным. Также рассказали о новом виде скама с логином в iCloud. Со своего ПК не лезьте и не логиньтесь никуда. Если дают какой-то сервис, то лучше зайти с инкогнито + сгенерировать рандомный пароль (понимаю, что это базовая сейчас рекомендация по безопасности, но пароли многие все еще пишут руками по паттерну).
Type Predicates в TypeScript 🎯 Продолжаю познавать тонкости TS и делюсь с вами. Обычная функция проверки: function isString(value: unknown): boolean { return typeof value === 'string'; } // TS всё ещё не знает тип после проверки if (isString(x)) { x.toUpperCase(); // ❌ Ошибка: unknown } С type predicate: function isString(value: unknown): value is string { return typeof value === 'string'; } // TS сужает тип внутри if if (isString(x)) { x.toUpperCase(); // ✅ OK } Практический пример: type Cat = { meow: () => void }; type Dog = { bark: () => void }; function isCat(pet: Cat | Dog): pet is Cat { return 'meow' in pet; } function handlePet(pet: Cat | Dog) { if (isCat(pet)) { pet.meow(); // ✅ TS знает, что это Cat } else { pet.bark(); // ✅ Значит Dog } } Ключевое: value is T в return type говорит TypeScript — «если вернул true, значит value точно типа T».
видео или голосовое, без подписи
видео или голосовое, без подписи
В max на данный момент обнаружена потенциальная уязвимость Media File Jacking, где мессенджер в личных или в любых других чатах хранит медиа-файлы (фотографии) в публичных ссылках. Что это значит? Злоумышленник при наличии прямой ссылки на фотографию, получения…
В max на данный момент обнаружена потенциальная уязвимость Media File Jacking, где мессенджер в личных или в любых других чатах хранит медиа-файлы (фотографии) в публичных ссылках. Что это значит? Злоумышленник при наличии прямой ссылки на фотографию, получения методом грубого перебора или через вредоносное ПО или расширения в браузере потенциально может получить доступ к медиа из ваших чатов. Например эта фотография, которую я отправил в личный чат знакомому По аналогии в других популярных мессенджерах та же система работает по сквозному E2E шифрованию, где посмотреть медиа может только устройства отправителя и получателя и никто больше. #осторожно
видео или голосовое, без подписи
Веб готовят к эпохе AI-агентов WebMCP — это новый браузерный API для сайтов, которые хотят работать с агентами. Идея простая. Разработчик явно описывает функционал как инструменты. ИИ больше не нужно парсить DOM, угадывать селекторы и ломаться после каждого редизайна. Он получает готовый список методов и просто вызывает их. Например, есть add_to_cart с параметрами productId и quantity. Или search_flight с датой и направлением. Агент вызывает метод и выполняет действие в рамках вашей сессии. Это сильно проще, чем BrowserTools или Playwright. Там под каждый сайт пишется отдельный код. Любое обновление верстки и всё падает. Поддержка превращается в боль, а тут должна быть радость. ___
Кто все эти люди которые подписываются? Лучше подпишитесь сюда - https://t.me/gamepixelline В этом канале я пишу про разработку игр на C# и Unity
Мы в этом канале часто обсуждаем трудоустройство (как оформить резюме, как себя продать и тд) но при этом вроде еще ни разу не писал практические примеры. Нашел у себя в заметках -> 8 метрик для резюме, если у вас нет доступа к инфе о деньгах Примеры будут на английском (хз почему, не помню уже, видимо готовил для en версии) Считайте то, к чему есть доступ: 1. Сэкономленное время → Saved 10+ executive hours weekly by automating reports in Power BI. 2. Ключевые фичи → Developed 10 features to enhance domain business value, including system support tools. 3. Объем инфраструктуры → Designed and deployed a fault-tolerant IT infrastructure supporting 40 branch offices. 4. Проведенные мероприятия → Organized 5 marketing events for the promotion of the agency with 100+ participants. 5. Слушатели лекций и тренингов → Led a university course: 30 students, 32 academic hours yearly. → Organized participation and sponsorship in an online conference, joined by 300+ people. 6. Коммуникация со стейкхолдерами → Collaborated with over 100 stakeholders daily. 7. Управление командой → Led a team of 5 developers. 8. Интервью → Conducted 100+ user interviews. → Conducted 100+ interviews, becoming the top-2 frontend interviewer in the company. Если нет доступа к бизнес-результатам то ищите вклад в процесс, людей и масштаб. #resume
Цитата дня Технологии это инструмент, а не идентичность. Сеньор это тот, кто выбирает инструмент под задачу, а не под эго.
3 управленческие ошибоки которые превращают сильную команду в среднюю На бумаге все выглядит идеально: сильные специалисты, роли распределены, цели вменяемые, условия нормальные. Почему тогда результат стабильно ниже ожиданий? 1. Команда занята решением задач, а не проблем Идеально закрывать таски в трекере и при этом не влиять на результаты бизнеса. Когда связь между задачами и реальной проблемой не обсуждается регулярно, работа постепенно превращается в механическое закрывание тасок. Фокус смещается с зачем мы это делаем на что ещё осталось закрыть 2. Результат не ощущается как значимый Когда последствия работы размыты, команда быстро учится относиться к результату не серьезно. Нет чёткого ощущения ни выигрыша, ни проигрыша, а значит, и внутреннего напряжения тоже нет. Публичная фиксация достижений и разбор ошибок это не формальность, а способ вернуть вес тому, что делает команда. Иначе ответственность растворяется, даже если люди по отдельности очень сильные. 3. Решения принимаются "наверху" Ключевые решения принимаются людьми, максимально оторванными от реального процесса. Команда при этом выступает в роли исполнителя, а не участника мышления. В такой системе даже компетентные специалисты перестают думать шире своей зоны ответственности. Зачем, если итоговое решение всё равно прилетит сверху уже готовым? Вывод Сильная команда это важная основа, но сама по себе она ничего не гарантирует. Без ясного фокуса, права на ошибку, живой обратной связи и ощутимых последствий даже опытные специалисты постепенно снижают вовлечённость
В чем выгода, брат? Бэкенд программист может предложить бизнесу систему, которая будет приносить прибыль. DevOps может предложить бизнесу безопасную и надёжную инфраструктуру для стабильной работы его бизнеса. Аналитик данных может предложить бизнесу стратегию по максимизации прибыли на основе обработки и анализа данных. Что может предложить фронтенд разработчик бизнесу, красивые кнопки? Фронтенд разработчик предлагает бизнесу самый важный актив, это пользователи и их деньги 1. Конверсию (прямые деньги) Красивые кнопки это не про красоту, а про привлекательность (кликабельность) - UI/UX: Создает интуитивный и приятный путь пользователя от входа на сайт до целевого действия (покупка, регистрация, заявка) - Производительность: быстрая загрузка страниц (особенно на мобилках) напрямую влияет на отказы (bounce rate). Задержка в 1 секунду может снижать конверсию на 7% - Адаптивность и кроссплатформенность: гарантия, что бизнес не теряет клиентов с планшетов и смартфонов, которые составляют большую часть трафика - Микроинтеракции(маленькие, мгновенные анимации и эффекты в пользовательских интерфейсах) и обратную связь: Все, что ведет пользователя к цели и дает ему уверенность в действиях (анимация загрузки, подтверждение отправки формы, четкие состояния кнопок) Вывод для бизнеса: грамотный фронтенд превращает посетителя в покупателя. Это прямая максимизация прибыли 2. Лояльность и доверие (бренд и удержание) Сегодня фронтенд это цифровое лицо компании. Пользователь не видит мощный бэкенд или аналитический дашборд. Он видит только фронтенд интерфейс. - Надежность и стабильность: приложение, которое не лагает, не выдает странных ошибок и всегда предсказуемо всегда вызывает доверие - Современность и профессионализм: аккуратный, быстрый и современный интерфейс сигнализирует о том, что компания следит за трендами и заботится о клиенте Доступность (Accessibility): обеспечение возможности использования продукта для людей с ограниченными возможностями это не только юридическое требование, но и расширение аудитории и усиление позитивного имиджа бренда Вывод для бизнеса: лояльный клиент возвращается снова и советует вас другим. Это снижение стоимости привлечения клиента (CAC) и долгосрочная прибыль 3. Конкурентное преимущество На рынке, где у многих одинаковые услуги или товары, ключевым отличием часто становится качество пользовательского опыта. - Более удобный, быстрый и приятный интерфейс это то, за что пользователи готовы платить или оставаться с вами, даже если у конкурента цена немного ниже - Инновационные интерфейсные решения (например, как у Apple или Airbnb) могут создать новый стандарт в отрасли Аналогия со строительством: Бэкенд это фундамент: несущие стены, коммуникации (вода, электричество). Без этого здание рухнет. Девопс это служба эксплуатации: охрана и система пожаротушения. Без этого в здании опасно и нестабильно. Аналитик это служба аналитики: считает поток людей и знает, где сделать еще один вход или поставить рекламный стенд. Фронтенд это архитектор, дизайнер интерьеров и менеджер по клиентскому опыту в одном лице. Он делает так, чтобы по зданию было приятно ходить, чтобы все было интуитивно понятно, чтобы витрины манили купить, а на кассе не возникало очередей. Именно здесь происходит основной контакт с клиентом и совершаются покупки. В цифровую эпоху, где почти весь бизнес происходит через интерфейсы, это не "просто кнопки", а ключевой инструмент монетизации и роста
Рынок изменился, все это заметили, но думаю многие еще не до конца поняли как теперь все устроено. Если раньше нужно было знать стек, иметь опыт участия в крутых (технически сложных) проектах, а бизнес часто писал в вакансиях "ищем джедая разработчика", то сегодня бизнес выживает. Сегодня нужно продавать не свои технические компетенции, а свою способность приносить прибыль бизнесу (за счет сокращения издержек или за счет увеличения продаж, тем или иным образом) В следующем посте поразмышляю на тему, как фронтендеру продать себя бизнесу, в чем бизнес-ценность фронтендера?
Самый оригинальный способ найти работу Парень так устал искать работу в качестве бэкенд-разработчика, что пошёл на креативный ход — переименовался в Dota 2. Неизвестно, сработало или нет, но премию за креативность он точно заслужил.
Самый оригинальный способ найти работу Парень так устал искать работу в качестве бэкенд-разработчика, что пошёл на креативный ход — переименовался в Dota 2. Неизвестно, сработало или нет, но премию за креативность он точно заслужил.