Skill Blog: Веб-разработка
رفتن به کانال در Telegram
Полезный материал по веб-разработке. Админ: @cyberwatermelon
نمایش بیشتر605
مشترکین
اطلاعاتی وجود ندارد24 ساعت
-17 روز
-1130 روز
در حال بارگیری داده...
کانالهای مشابه
هیچ دادهای
مشکلی وجود دارد؟ لطفاً صفحه را تازه کنید یا با مدیر پشتیبانی ما تماس بگیرید.
ابر برچسبها
اشارات ورودی و خروجی
---
---
---
---
---
---
جذب مشترکین
آوریل '25
آوریل '25
+2
در 0 کانالها
مارس '25
+5
در 0 کانالها
Get PRO
فوریه '25
+11
در 0 کانالها
Get PRO
ژانویه '25
+23
در 0 کانالها
Get PRO
دسامبر '24
+16
در 0 کانالها
Get PRO
نوامبر '24
+14
در 0 کانالها
Get PRO
اکتبر '24
+12
در 0 کانالها
Get PRO
سپتامبر '24
+20
در 0 کانالها
Get PRO
اوت '24
+29
در 0 کانالها
Get PRO
ژوئیه '24
+20
در 0 کانالها
Get PRO
ژوئن '24
+26
در 0 کانالها
Get PRO
مه '24
+16
در 0 کانالها
Get PRO
آوریل '24
+39
در 0 کانالها
Get PRO
مارس '24
+49
در 0 کانالها
Get PRO
فوریه '24
+69
در 0 کانالها
Get PRO
ژانویه '24
+13
در 0 کانالها
Get PRO
دسامبر '23
+11
در 0 کانالها
Get PRO
نوامبر '23
+15
در 0 کانالها
Get PRO
اکتبر '23
+15
در 0 کانالها
Get PRO
سپتامبر '23
+27
در 0 کانالها
Get PRO
اوت '23
+31
در 0 کانالها
Get PRO
ژوئیه '23
+28
در 0 کانالها
Get PRO
ژوئن '23
+34
در 0 کانالها
Get PRO
مه '23
+53
در 0 کانالها
Get PRO
آوریل '23
+36
در 0 کانالها
Get PRO
مارس '23
+20
در 0 کانالها
Get PRO
فوریه '23
+20
در 0 کانالها
Get PRO
ژانویه '23
+17
در 0 کانالها
Get PRO
دسامبر '22
+19
در 0 کانالها
Get PRO
نوامبر '22
+20
در 0 کانالها
Get PRO
اکتبر '22
+25
در 0 کانالها
Get PRO
سپتامبر '22
+214
در 0 کانالها
| تاریخ | رشد مشترکین | اشارات | کانالها | |
| 02 آوریل | +1 | |||
| 01 آوریل | +1 |
پستهای کانال
👩💻 JS Трюк: Для одновременного перебора индексов и значений массива
🟡 Конечно, существует метод .forEach(), но этот трюк предназначен для тех случаев, когда приходится использовать классический цикл for
Метод .entries() возвращает двумерный массив, где первый элемент в каждом подмассиве - это индекс, а второй - само значение. Мы можем использовать деструктурирующее присваивание, чтобы получить эти значения в двух переменных
| 2 |  +1👩💻 Событие beforeunload
Это событие позволяет веб-странице вызвать диалоговое окно подтверждения, спрашивающее пользователя, действительно ли он хочет покинуть страницу
Событие происходит перед событием выгрузки страницы unload
Обработка через определение onbeforeunload на объекте window:
window.onbeforeunload = () => false
Подробнее:
🟡MDN
🟡Doka | 184 |
| 3 | ![Метод для возврата элемента массива по указанному индексу Он действует почти как скобочная запись array[index], за исключение](data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAoACQDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDSdip4B/75zSbm/wAqaHCkgtnPsTTNkY/v/wDfRqhkqtnjBz9MU6oNkf8Atf8AfRpybI/u559STQBLRSbvaiiwDSB0Jo2rzyeKcSB1IFJvXpnrTATYM4yaa21eeTUmRn9KCAeoBouAgAIBz1op1FIAooooAKKKKACiiigD/9k=){kind=small} Метод для возврата элемента массива по указанному индексу
Он действует почти как скобочная запись array[index], за исключением того, что индекс может быть отрицательным | 219 |
| 4 |  Единица turn
Позволяет определять угол в оборотах. 1turn, соответственно, равен одному обороту или 360 градусам.
Удобно использовать в анимации и трансформации элементов, когда требуется повернуть элемент на один или несколько оборотов | 202 |
| 5 |  overAPI - этот ресурс содержит огромное количество различных шпаргалок по самым популярным технологиям
⛓ Ссылка: тут | 202 |
| 6 |  +7CSS Container Queries: Современный подход к адаптиву
Контейнерные Запросы - это передовая функция CSS, поддерживаемая 91.65% браузеров
Они позволяют нам применять стили к элементам на основе условий, касающихся размеров контейнера. Это делается с помощью правила @container, которое работает аналогично медиазапросам, но ориентировано на размеры контейнера, а не окна просмотра | 286 |
| 7 |  Web Developer Checklist - интересный сервис для веб-разработчика, который поможет по пунктам проверить готовность проекта к запуску
Доступен в виде сайта и расширения
Ссылка: тут | 254 |
| 8 |  +5Notifications API в JS
Используется для настройки и отображения уведомлений на рабочий стол пользователя
Поскольку API уведомлений легко злоупотребить, по умолчанию он строго применяет две функции безопасности:
— Во-первых, пользователи должны явно согласиться получать уведомления для каждого источника
— Во-вторых, отправлять уведомления может только код, работающий в безопасном контексте (HTTPS) | 286 |
| 9 |  Простой эффект зума с помощью CSS
Здесь мы создаем обертку над реальным изображением, отключаем переполнение(overflow) на обертке и масштабируем изображения для достижения этого эффекта | 235 |
| 10 |  +5Пять интересных API на JavaScript для создания веб-сайтов, о которых вы (скорее всего) не знали | 210 |
| 11 |  CSS Click Chart - с помощью этого инструмента можно посмотреть, как реализуется то или иное действие на CSS. Также отображается поддержка браузерами
Ссылка: тут | 209 |
| 12 |  +1В типографике маленькие прописные буквы - это стиль или вариант шрифта, который похож на прописные, но имеет уменьшенную высоту, как у строчных букв. Такой способ изменения символов называется капителью
Как правило, он используется для создания акцента на участке текста
В CSS это можно включить с помощью свойства font-variant-caps, установив для него значение
✅ small-caps — включает капитель для строчных букв
✅ all-small-caps — включает капитель для строчных и прописных букв | 192 |
| 13 |  typescript-plugin-css-modules
Из коробки CSS Modules не поддерживают типизацию для классов, определенных в CSS-файлах. Но можно подключить этот плагин, который автоматически сгенерирует TypeScript типы на основе имен классов
В VS Code убедитесь, что используете версию TypeScript, которая установлена в вашем проекте, а не глобальную(Нажмите на версию TypeScript в правом нижнем углу и выберите "Use Workspace Version")
Ссылка: тут | 175 |
| 14 |  101 совет про React
Нашёл для вас полезную статью с советами и подсказками по React
Отличная вещь, которая пригодится при изучении React или для подготовки к собеседованию
Читать: ссылка | 167 |
| 15 |  Держите коллекцию советов профессионалов CSS
Нашел интересный репозиторий с полезными советами по CSS. Есть очевидные и не очень, нашел кое что новое и для себя. Например, не знал что можно сбросить все свойства элмента всего одной командой all: unset; Буду теперь знать)
Ссылка: GitHub | 224 |
| 16 |  Швейцарский нож для работы с массивами. Метод reduce()
Метод reduce сворачивает массив к одному значению (редуцирует) е с помощью переданной функции-колбэка и начального значения. Функция-колбэк будет вызвана для каждого элемента массива, и всегда должна возвращать результат | 181 |
| 17 |  +1Использование CSS-градиента для затемнения картинки
Одним из способов затемнения изображений с помощью CSS является использование градиентов. Этот метод позволяет более гибко настроить эффект, а также добавить различные переходы и цветовые комбинации
СSS:
background: linear-gradient(
to right,
rgb(0 0 0 / 0.5),
rgb(0 0 0 / 0)
), url("img.jpg") 100%/cover no-repeat; | 164 |
| 18 |  +4Подборка интересных трюков в VS Code
Советы, которые недостаточно велики для отдельного поста, но иногда очень могут пригодится | 169 |
| 19 |  +2Подборка 3-х суперполезных функциий в CSS
- Функция calc() позволяет производить математические вычисления прямо в CSS
- Функция clamp() позволяет ограничивать диапазон изменения некоего значения, задавая его нижний и верхний пределы
- CSS-свойство filter добавляет визуальные эффекты к элементам на странице и использует в качестве значений функции | 146 |
| 20 |  Логические свойства в CSS
Логические свойства привязаны не к сторонам экрана, а к направлению письма. Они задают отступы, рамки и позиционирование, опираясь на инлайновую (inline) и блочную (block) оси.
Инлайновая ось проходит в направлении, в котором пишется текст. Например, в тексте, написанном на русском или английском, инлайновая ось пройдёт слева направо, в тексте на арабском — справа налево, а в тексте на японском — сверху вниз.
Блочная ось идёт перпендикулярно инлайновой и имеет своё направление. Например, в тексте, написанном на японском — справа налево, а в монгольском — слева направо
Подробнее | 140 |
