es
Feedback
Senior Frontend - javascript, html, css

Senior Frontend - javascript, html, css

Ir al canal en Telegram

Senior Front - канал для frontend программистов, практические задачки, проверки знаний, интересные статьи Админ, сотрудничество, реклама:@seniorFrontPromo, @maria_seniorfront Канал в реестре РКН https://rknn.link/bsU

Mostrar más
2025 año en númerossnowflakes fon
card fon
26 752
Suscriptores
-1424 horas
-927 días
-29630 días
Archivo de publicaciones
00:14
Video unavailableShow in Telegram
Crossy Road Игра создана и анимирована при помощи библиотеки Three.js. 👉 @seniorFront
Mostrar todo...
2025-05-08 13-25-51.mp43.72 MB
👍 4 1
CodePen
Photo unavailableShow in Telegram
Принимаете платежи в криптовалюте? Если нет — то ваш ежегодный объем недополученной выручки может составлять до 15% от оборота Если да – вы продолжаете переплачить 1.5-3% на комиссиях Мы помогаем компаниям принимать оплату в USDT с минимальными комиссиями без посредников. CoinCrossPay — выгоднее, чем у конкурентов! ✅ Комиссия 0,02–0,09% — дешевле не бывает! – для любого бизнеса ✅ Крипта — напрямую вам. Без посредников. Полный контроль. ✅ Персональная платежная страница = больше продаж! ✅ Простая интеграция и поддержка 24/7 Кому подойдет? E-commerce, SaaS, freelancers, и т.д Подключите ❤️CoinCrossPay уже сегодня и увеличивайте продажи без лишних затрат! Оставь заявку на сайте: ➡️ CoinCrossPay.space Или напиши нам напрямую (предварительно расскажи нам о продукте): @CoinCross_manager
Mostrar todo...
Photo unavailableShow in Telegram
Чтение на выходные: «Иконы графического дизайна» Джона Клиффорда Нам нравятся книги про дизайн и мы периодически приносим их вам в ленту. Сегодня берем с полки достаточно известную работу практикующего графического дизайнера Джона Клиффорда об иконах индустрии разных времен. Эту книгу называют энциклопедией, однако так ли это и какие аргументы есть за и против, обсудим в нашем материале. 👉 @seniorFront
Mostrar todo...
3
Статья
Photo unavailableShow in Telegram
ООП — это скам На хабре и в остальном интернете хватает статей с критикой ООП. Кто-то ругает эту концепцию за излишнюю многословность, кто-то рассуждает о плохих аспектах ООП, кто-то сравнивает реализации ООП в разных языках. После прочтения большинства этих статей и нескольких лет кодинга на C# я заявляю: «ООП - это один большой обман. Никто не понимает, что это такое. Люди просто говорят какие-то умные термины, их собеседники с умным видом кивают, хотя на деле трактуют эти же термины совершенно по-разному». И вот почему: 👉 @seniorFront
Mostrar todo...
👎 6👍 1
Статья
00:03
Video unavailableShow in Telegram
👩‍💻 Всем программистам посвящается! Вот 17 авторских обучающих IT каналов по самым востребованным областям программирования: Выбирай своё направление: 👩‍💻 Frontend — t.me/frontend_ready 📱 JavaScript — t.me/javascript_ready 👩‍💻 Backend — t.me/backend_ready 📱 GitHub — t.me/github_ready 👩‍💻 Python — t.me/python_ready 👩‍💻 Java — t.me/java_ready 👩‍💻 Всё IT — t.me/it_ready 🖥 Базы Данных & SQL — t.me/sql_ready 👩‍💻 C/C++ — https://t.me/cpp_ready 👩‍💻 C# & Unity — t.me/csharp_ready 🖼️ DevOpst.me/devops_ready 🤔 Хакинг & ИБ — t.me/hacking_ready 👩‍💻 Linux — t.me/linux_ready 👩‍💻 Bash & Shell — t.me/bash_ready 👩‍💻 Нейросетиt.me/neuro_ready 📖 IT Книги — t.me/books_ready 🖥 Design — t.me/design_ready 📌 Гайды, шпаргалки, задачи, ресурсы и фишки для каждого языка программирования!
Mostrar todo...
vtaaEtW7B5w.mp42.10 MB
2👍 1
00:06
Video unavailableShow in Telegram
Circular Animations Set Подборка анимаций, реализованных на canvas и чистом JS. 👉 @seniorFront
Mostrar todo...
2025-05-08 13-25-39.mp42.56 MB
👍 3
CodePen
Какие структуры данных есть в JS? Существует несколько основных структур данных, которые используются для хранения и управления данными. Рассмотрим их подробнее: 1. Массивы (Arrays) - Что это: Упорядоченные списки элементов. - Зачем нужны: Для хранения коллекций данных, которые можно обрабатывать по индексу. - Как использовать:
 let fruits = ["Apple", "Banana", "Cherry"];
 console.log(fruits[0]); // Apple
    
- Пример использования: Хранение списка товаров в корзине интернет-магазина. 2. Объекты (Objects) - Что это: Наборы пар "ключ-значение". - Зачем нужны: Для хранения данных в виде ассоциативных массивов, где ключами могут быть строки или символы. - Как использовать:
let person = {
  name: "John",
  age: 30
};
console.log(person.name); // John
     
- Пример использования: Хранение информации о пользователе. 3. Map (Карты) - Что это: Коллекции пар "ключ-значение", где ключи могут быть любого типа. - Зачем нужны: Для хранения данных с уникальными ключами, с более гибкими возможностями по сравнению с объектами. - Как использовать:
let map = new Map();
map.set('name', 'John');
map.set(1, 'one');
console.log(map.get('name')); // John
     
- Пример использования: Хранение настроек с ключами различного типа. 4. Set (Множества) - Что это: Коллекции уникальных значений. - Зачем нужны: Для хранения множества значений, где каждое значение уникально. - Как использовать:
let set = new Set();
set.add(1);
set.add(1); // Значение не добавится, так как оно уже существует
console.log(set.size); // 1
     
- Пример использования: Хранение уникальных тегов из списка статей. 5. WeakMap (Слабые карты) - Что это: Коллекции пар "ключ-значение", где ключи являются объектами и имеют слабые ссылки. - Зачем нужны: Для хранения данных с автоматическим удалением неиспользуемых объектов. - Как использовать:
let weakMap = new WeakMap();
let obj = {};
weakMap.set(obj, 'value');
obj = null; // Теперь объект может быть удалён из памяти
     
- Пример использования: Хранение метаданных объектов без риска утечек памяти. 6. WeakSet (Слабые множества) - Что это: Коллекции объектов, где каждое значение может быть удалено автоматически, если больше не используется. - Зачем нужны: Для хранения уникальных объектов с возможностью автоматического удаления. - Как использовать:
let weakSet = new WeakSet();
let obj = {};
weakSet.add(obj);
obj = null; // Теперь объект может быть удалён из памяти
     
- Пример использования: Отслеживание объектов без риска утечек памяти. 7. String (Строки) - Что это: Последовательности символов. - Зачем нужны: Для хранения и обработки текстовых данных. - Как использовать:
let greeting = "Hello, world!";
console.log(greeting.length); // 13
     
- Пример использования: Хранение и манипулирование текстовой информацией, такой как имена пользователей или сообщения. 8. Typed Arrays (Типизированные массивы) - Что это: Массивы, которые предоставляют массивы с фиксированной длиной для различных типов данных. - Зачем нужны: Для работы с бинарными данными и оптимизации производительности. - Как использовать:
let buffer = new ArrayBuffer(16);
let int32View = new Int32Array(buffer);
int32View[0] = 42;
console.log(int32View[0]); // 42
     
- Пример использования: Обработка данных в WebGL или манипулирование бинарными данными. 👉 @seniorFront
Mostrar todo...
👍 11 1
Документация
Photo unavailableShow in Telegram
Чемпионат для подростков по 12 направлениям от «Алабуга Политех»☺️ Программирование и Битва роботов, Экономика и Юриспруденция, 3D моделирование и Английский язык и многое другое, чтобы каждый нашел свою дисциплину. Для участия тебе нужно☺️ ☺️Оставь заявку на сайте😀 ☺️Пройди заочный этап на HR-платформе: Business Cats до 1,0 по «Общению» и «Аналитике» для оплаты дороги туда и обратно😀 ☺️Приезжай на чемпионат😀 Мы предлагаем тебе☺️ ☺️Общий призовой фонд турнира составляет 1 000 000 рублей😀 ☺️Проживание и дорога бесплатно😀 ☺️Возможность поступить в «Алабуга Политех»😀 Участвуй в турнире от образовательного центра мирового уровня и получай призы и преимущество в поступлении☺️
Mostrar todo...
👎 5 1🔥 1
Photo unavailableShow in Telegram
Почему одни шрифты читаются быстрее других и почему Comic Sans ненавидят Вы когда-нибудь замечали, что одни тексты «проглатываете» за минуты, а другие читаете словно через силу или просто кидаете в закладки и забываете, даже если тема интересна? Дело не только в содержании — иногда главную роль играет шрифт. Одни буквы мозг расшифровывает мгновенно, а на других спотыкается и тормозит. Давайте разберемся, какие шрифты ускоряют усвоение информации, а какие годятся только для художественных заголовков — и как это используют в UX, издательском деле и digital-рекламе. Спойлер: Comic Sans не просто так всех раздражает. Так что, если вы до сих пор тыкаете в Fonts Google наугад — готовьтесь к легаси-проблемам с юзабилити. 👉 @seniorFront
Mostrar todo...
1
Статья
Photo unavailableShow in Telegram
Подсчет количества дубликатов Напишите функцию, которая будет возвращать количество различных алфавитных символов и цифровых цифр, встречающихся во входной строке более одного раза без учета регистра. Предполагается, что входная строка содержит только алфавиты (как прописные, так и строчные) и цифровые цифры. Пример:
"abcde" -> 0 # no characters repeats more than once
"aabbcde" -> 2 # 'a' and 'b'
"aabBcde" -> 2 # 'a' occurs twice and 'b' twice (`b` and `B`)
"indivisibility" -> 1 # 'i' occurs six times
"Indivisibilities" -> 2 # 'i' occurs seven times and 's' occurs twice
"aA11" -> 2 # 'a' and '1'
"ABBA" -> 2 # 'A' and 'B' each occur twice
👉 @seniorFront
Mostrar todo...
CodeWars
00:08
Video unavailableShow in Telegram
Butterflies Оригинальная карточка, созданная и анимированная на HTML и CSS. 👉 @seniorFront
Mostrar todo...
2025-05-01 18-45-23.mp48.86 KB
5👍 4🔥 2
CodePen
04:53
Video unavailableShow in Telegram
Blinking Stars Animation В этом видео создается анимация звездного фона на JS и CSS. 👉 @seniorFront
Mostrar todo...
Blinking Stars Animation CSS & Javascript.mp429.23 MB
👍 2
Оригинальное видео
Какой React хук обычно используется для работы с неконтролируемыми компонентами?Anonymous voting
  • useState
  • useEffect
  • useRef
  • useContext
0 votes
👍 3 2
00:09
Video unavailableShow in Telegram
Card Glow | Bioluminescence Светящиеся элементы - это SVG картинки, появляющиеся при наведении. 👉 @seniorFront
Mostrar todo...
2025-05-01 18-44-35.mp41.32 MB
👍 1🔥 1
CodePen
Photo unavailableShow in Telegram
Формошлёп — сотни хаков для фронтендеров в одном месте Никакой скучной теории, воды и прочей шляпы, только практические примеры, которые работают. 👉 Подписывайся на @frontbox — стань тем, кто знает, как решить проблему, пока остальные ищут ответ на Stack Overflow.
Mostrar todo...
👍 4
Photo unavailableShow in Telegram
Я не гуру продакшена – я такой же новичок, как и ты Но вместе мы можем прокачаться быстрее! ✨ Основы продакшена ✨ Разборы треков ✨ Вдохновение и мысли Подписаться #реклама 16+ О рекламодателе
Mostrar todo...
👍 1
00:11
Video unavailableShow in Telegram
Cards on a Carousel Логика работы карусели реализована JS. Анимировано библиотекой gsap. 👉 @seniorFront
Mostrar todo...
2025-05-01 18-45-00.mp44.92 MB
👍 8 2👎 1
CodePen
00:09
Video unavailableShow in Telegram
А ты уже едешь за город на шашлыки. 👉 @seniorFront
Mostrar todo...
IMG_9560.MP41.61 MB
🔥 5👎 1
08:29
Video unavailableShow in Telegram
Stunning Bleeding Button В этом видео создается оригинальная кнопка с эффектом при наведении с использованием SVG и JS. 👉 @seniorFront
Mostrar todo...
Create_Stunning_Bleeding_Button_Hover_Effects_with_SVG_&_JavaScript.mp451.61 MB
👍 2 1🔥 1🤔 1
Оригинальное видео
Photo unavailableShow in Telegram
Не знаешь на кого пойти учиться ?💥 🛑Пройди бесплатные онлайн-курсы 🛑Узнай о самых востребованных профессиях 🛑Получи уникальную возможность поступить в «Алабуга Политех» после 9 или 11 класса ПРОЙДИ КУРС ПРЯМО СЕЙЧАС!
Mostrar todo...
👍 3 3🔥 3👎 2