Вёрстка сайтов | HTML, CSS, JS

Атрибуты hreflang и alternate

Читать 👨‍💻

#html | #теория

Атрибут accept

Читать 👨‍💻

#html | #теория

URL в javascript

Читать 👨‍💻

#js | #теория

Исследование про доступность

Читать 👨‍💻

#полезности

Подборка лучших постов за прошлую неделю

Лучшие статьи @free_html_lessons:
1. Специальные символы в HTML
2. Отправление уведомлений js
3. Hack Frontend

Лучшие фронтенд вакансии @job_webdev:
1. HTML-верстальщик
2. Fullstack JavaScript разработчик
3. HTML-верстальщик

Лучшие дизайн вакансии @job_webdesign:
1. Web-дизайнер
2. Моушeн-дизайнер
3. Web Designer (Иллюстратор)

#лучшеезанеделю

LRU-кэш на замыканиях

Реализовать LRU-кэш как функцию-конструктор:

const cache = createLRUCache(3);
cache.set('a', 1);
cache.set('b', 2);
cache.set('c', 3);
cache.get('a'); // делает 'a' самым недавно использованным
cache.set('d', 4); // должен выкинуть ключ, который дольше всего не использовали

Требования:
- Хранить не более capacity элементов.
- get(key):
Возвращает значение или undefined.
Перемещает элемент в «верх» как самый свежий.
- set(key, value):
Обновляет значение, если ключ существует.
Если кэш переполнен — удаляет самый «старый» по использованию ключ.

#домашка

Макет для тренировки (Место кладовки)

Перейти к макету 🧑‍💻

#практика | #макет

Hack Frontend – платформа, для подготовки к собеседованиям на позицию Frontend Developer

На сайте есть:
- База знаний
- База задач
- Квизы

Платформа бесплатная

Посмотреть 🧑‍💻

#полезности

Как управлять растяжением textarea?

Для этого есть css свойство resize. Значения:
- resize: none – полностью запрещает растягивание элемента.
- resize: vertical – разрешает менять только высоту элемента.
- resize: horizontal – позволяет менять только ширину элемента.
- resize: both – позволяет менять ширину и высоту элемента.

Растягивание также можно ограничить указав минимальные и максимальные значения высоты и ширины.

Например - есть форма шириной 400px с текстовым полем внутри. Чтобы поле нельзя было растянуть шире формы, просто указываем максимальную ширину в 100% или любой другой необходимый вам размер.

<form>
  <textarea></textarea>
</form>

form {
  width: 200px;
}
textarea {
  width: 100%;
  max-width: 100%;
}

#полезности

Отправление уведомлений js

Читать 👨‍💻

#js | #полезности

Специальные символы в HTML

Читать 👨‍💻

#html | #полезности

Подборка лучших постов за прошлую неделю

Лучшие статьи @free_html_lessons:
1. Стоит ли использовать pug?
2. Dom javascript
3. CSS sibling-index() примеры

Лучшие фронтенд вакансии @job_webdev:
1. HTML-верстальщик
2. Frontend-разработчик React
3. HTML-верстальщик

Лучшие дизайн вакансии @job_webdesign:
1. Web-дизайнер
2. Web-дизайнер
3. Дизайнер коммуникаций

#лучшеезанеделю

Планировщик с ограничением параллелизма

Есть массив асинхронных задач (функций, которые возвращают промис). Нужно написать функцию runWithLimit(tasks, limit), которая:

Запускает не более limit задач одновременно.

Возвращает промис, который резолвится, когда завершатся все задачи.

Сохраняет порядок результатов в соответствии с исходным массивом.

Пример:
runWithLimit([task1, task2, task3, task4], 2) — в любой момент времени выполняется не более 2 задач.

#домашка

Макет для тренировки (КНИТУ)

Перейти к макету 🧑‍💻

#практика | #макет

CSS sibling-index() примеры

Смотреть на codepen 🧑‍💻

#пратика

Dom javascript

Читать 👨‍💻

#js | #теория

Стоит ли использовать pug?

Читать 👨‍💻

#полезнаястатья

Подборка лучших постов за прошлую неделю

Лучшие статьи @free_html_lessons:
1. Тег <base>
2. Советы по Улучшению UX/UI веб-сайта
3. Customizable Select

Лучшие фронтенд вакансии @job_webdev:
1. HTML-верстальщик
2. Frontend developer intern
3. HTML-верстальщик

Лучшие дизайн вакансии @job_webdesign:
1. Web-дизайнер
2. UI\UX дизайнер
3. UX/UI дизайнер

Глубокое сравнение объектов

Написать функцию deepEqual(a, b), которая:

Возвращает true, если объекты эквивалентны по структуре и значениям.

Учитывает:
- Вложенные объекты и массивы.
- Порядок элементов в массивах.
- Разные типы (число 1 и строка '1' считаются неравными).

Доп. усложнение:
- Научить функцию работать с циклами ссылок (использовать WeakMap для отслеживания посещённых узлов).

#домашка