Создать игру за 24 часа и выжить

За 24 часа можно успеть очень много. Сегодня я решил рассказать, как всего за сутки мы с моими коллегами (шестью фронтендерами и одним бэкендером) создали настоящую мультиплеерную игру на JavaScript. Поехали!

https://habr.com/ru/post/684480/

👉 @frontend_1

React: полное руководство по повторному рендерингу

https://www.developerway.com/posts/react-re-renders-guide

✍️ @React_lib

Использование директивы NgOptimizedImage для реализации загрузки изображений в Angular

Директива NgOptimizedImage в Angular отвечает за реализацию загрузки изображений, сохраняя высокую производительность. Она доступна в Angular v14.2.0. Директива помечена как standalone и может быть импортирована в standalone компоненты и модули.

Eng https://netbasal.com/using-angular-ngoptimizedimage-to-implement-image-loading-best-practices-e20a69d71ea3

Rus https://habr.com/ru/post/685018/

👉 @frontend_1

Frontend meetup (Online)

1. Быть Senior Frontend Developer в 2023: Экспертиза, карьера и общество — Александр Гузенко, IT_ONE
В докладе попробуем систематизировать средние по палате необходимые требования к Senior Frontend Developer к 2023 году. Разберем, чем синьор отличается от мидла, посмотрим на хард скилы, софт скилы, точки роста для синьора.

2. CLI для фронтендеров. Делаем лучше, а не хуже — Алексей Попков, Толока
В докладе поговорим, как превратить скриптописательство в системный подход, какие есть основные критерии качества, и как сделать инструмент, которому будет рада вся команда.

3. Обзор полезных инструментов разработчика — Павел Теренин, Juniper Square
В моем докладе инструменты разделены на две секции: инструменты для отладки верстки и стилей, и инструменты для отладки кода и оптимизации быстродействия.

➖➖➖

🗓 15 марта, начало в 19:00 мск, Среда

🌐 ОНЛАЙН

✅ Регистрация на мероприятие

Wavy Color Cube

https://codepen.io/hexagoncircle/pen/MWwjpYY

Подпишись👉 @codepen_1

Advanced JavaScript Features

https://blog.nonstopio.com/advanced-javascript-features-2fe8108ab4d3

👉 @frontend_1

Митап VK Tech Talks для фронтед-разработчиков

Специалисты из VK ответят на ваши вопросы, а также расскажут:

❓Как специалистам удаётся поддерживать фронтенд-код ВКонтакте в порядке?

❓Как они ускоряли релиз лендингов на Юле?

❓Как удалось наладить работу с комьюнити на примере внедрения фронтенд-платформы?

Обо всем этом и не только узнаете уже 16 марта в 19:00. Регистрация на офлайн встречу и ссылка на трансляцию уже ждет вас здесь.

👉 @frontend_1

Как написать кроссбраузерное расширение

В один прекрасный день ко мне пришли менеджеры и сказали, что нужно написать браузерное расширение для внутреннего джобборда. Оно должно взаимодействовать с сайтами avito и hh, чтобы добавлять кандидатов в HR-систему, не скачивая и не вбивая вручную контакты из резюме на сайте.

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

https://habr.com/ru/company/sbermarket/blog/685866/

👉 @frontend_1

Преобразования типов JavaScript с пояснениями

Javascript является слабо типизированным языком, что означает, что различные типы данных для переменных и объектов не задаются явно, а делаются неявно движком Javascript во время компиляции. Если оставить эту важную задачу на усмотрение движка Javascript, то иногда в наших программах возникают проблемы, о которых мы даже не подозреваем. Вот почему важно знать, как работает преобразование типов в Javascript, которое является основным источником логических ошибок.

https://blog.openreplay.com/javascript-type-conversions-explained/

👉 @frontend_1

An ultimate guide to the Vue 3 Composition API

https://blog.openreplay.com/an-ultimate-guide-to-the-vue-3-composition-api

👉 @frontend_1

По домам: фронтенд – Андрей Ваганов

Шоу от сообщества инженеров Авито. В нашей команде работают совершенно разные люди: у каждого свой опыт, своё видение разработки и свои любимые фреймворки. Но нас объединяют любовь к фронтенду и работе в Авито.

00:00 Интро
00:46 Как попал в IT? Первая работа в IT?
01:50 Кем работаешь и чем занимаешься в Авито?
02:45 Какие технологии/библиотеки тебе нравятся?
04:25 Что хочешь изучить в 2022 году? / Что стоит изучить в 2022 году?
05:08 Расскажи, как ты учился?
06:09 Назови три лучших книги/ресурса/статьи.
07:07 Как писать стили, какой инструмент выбрать?
08:10 Опиши стэк для идеального приложения?
08:58 Задача мечты? / Проект мечты?
09:34 Почему ты работаешь в Авито?
10:37 Какие есть pet-проекты?
10:57 Последние 3 фичи, которые ты втащил?
11:51 Если не фронтенд, то ...

https://youtu.be/GKLmY8DerGc

👉 @frontend_1

API JavaScript, о которых вы не знаете

В этой статье Хуан Диего рассказывает о наименее известных, но чрезвычайно полезных API, таких как API видимости страницы, API совместного доступа к веб-страницам, API канала вещания и API интернационализации. Вместе мы узнаем, что они собой представляют, где их следует использовать и как их применять.

https://www.smashingmagazine.com/2022/09/javascript-api-guide/

👉 @frontend_1

Technical Writing for Developers

https://css-tricks.com/technical-writing-for-developers/

👉 @frontend_1

31 марта МТС собирает крупнейшую в России IT-конференцию TRUE TECH DAY. Почему сейчас? Потому что давно пора показать, что скрывают «под капотом» топовые продукты продвинутых технологичных компаний. Каждый участник конференции протестит на себе true-технологии и испытает новые впечатления, меняющие мир пользователей.

Что будет:
→ 7 треков: AI, Main Track, Big Data, Architecture, Cybersecurity, Leading Change, Product Manager.
→ 50+ мировых спикеров с топовыми темами без воды и лирики
→ 10 часов нетворкинга и обмена опытом в Москве, Дубае, Тбилиси и Астане
→ много интерактивных и цифровых зон
→ а после — грандиозная вечеринка со звездным лайн-апом

Все спикеры и темы уже на сайте.
Регистрируйся на True Tech Day по ссылке.
Участие бесплатно

TypeScript

Подробное Руководство
Книга и документация в одном (2022)

👉 @frontend_1

Паттерны проектирования JavaScript

https://stackblitz.com/@lydiahallie/collections/javascript-patterns

👉 @frontend_1

Webpack + CSS Modules + TS = Love

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

Представим, что мы разрабатываем компонент Button. Использовать "чистый" CSS опасно, потому что есть риск, что кто-то ещё в вашем проекте (или ещё хуже — в подключенной библиотеке) использует то же имя класса:

/* Button.css */

.button {
color: #f00;
padding: 10px;
font-size: 18px;
}

/* node_modules/some_lib/styles.css */

.button {
color: #0f0;
}

// Button.tsx

import { FC } from "react";
import "./Button.module.css";
import "some_lib/styles.css";

export const Button: FC = (props) => {
// Какого цвета будет кнопка остаётся только гадать
return <button {...props} className="button" />;
};


https://habr.com/ru/post/688844/

👉 @frontend_1