javascriptv | Unsorted

Telegram-канал javascriptv - Javascript

18174

По всем вопросам - @workakkk @itchannels_telegram -🔥лучшие ИТ-каналы @ai_machinelearning_big_data - машинное обучение @JavaScript_testit- js тесты @pythonl - 🐍 @ArtificialIntelligencedl - AI @datascienceiot - ml 📚 РКН: № 5153160945

Subscribe to a channel

Javascript

📌Google добавит в Chrome песочницу для V8

⏩Google добавляет в Chrome песочницу V8, чтобы повысить устойчивость браузера перед проблемами памяти. Большинство таких проблем оказывались связаны с JavaScript-движком.

⏩Песочница для V8 изолирует память хипа, чтобы предотвратить повреждение других частей памяти процесса. Из-за отсутствия аппаратного обеспечения для этих целей Google выбрала программный подход.

⏩При атаках злоумышленники не смогут выйти из песочницы и добраться до других частей памяти процесса.

⏩Как отмечается, на песочницу V8 приходится лишь 1% потребления ресурсов при типичных рабочих нагрузках, а значит, она может быть включена по умолчанию на совместимых платформах. В течение последних двух недель песочница V8 была активна по умолчанию в 64-битных версиях Chrome для Android, ChromeOS, Linux, macOS и Windows для проверки стабильности и сбора статистики по производительности.

@javascriptv

Читать полностью…

Javascript

🖥 100 вопросов по React для подготовки к собеседованию

Держите отличную подборку вопросов, здесь покрываются основные темы React:

Основы React.
— JSX (JavaScript XML)
— Компоненты и их жизненный цикл.
— Пропсы (props) и состояние (state).
— События и обработчики событий.

Компоненты и их типы
— Функциональные компоненты.
— Классовые компоненты.
— Хук состояния (useState).
— Хук эффекта (useEffect).
— Хук контекста (useContext).

Роутинг
— React Router — библиотека для маршрутизации в React-приложениях.
— Создание маршрутов и навигация.
— Пропсы маршрутов и параметры URL.

Состояние приложения
— Redux — библиотека для управления состоянием приложения.
— Создание хранилища (store), действий (actions) и редукторов (reducers).
— Middleware и асинхронные действия.

Взаимодействие с API
— Fetch API для выполнения HTTP-запросов.
— Axios — библиотека для выполнения HTTP-запросов.
— Работа с асинхронными запросами и обработка ошибок.

...и остальные темы

📎 100 вопросов

@react_tg

Читать полностью…

Javascript

🖥 Google выпустила открытый инструментарий zx v8.0.0

6 апреля 2024 года Google выпустила новую мажорную версию открытого инструментария командной строки zx v8.0.0. Исходный код проекта опубликован на GitHub под лицензией Apache License 2.0. Предыдущая версия проекта zx v7.2.3 вышла в июле 2023 года.

📎 Подробнее

@javascriptv

Читать полностью…

Javascript

⚡️ Большая подборка вопросов с собеседований: Frontend, Javascript, React, Vue и многое другое.

Подборка актуальных задач и вопросов с собеседований поможет вам подготовиться как к практике, так и к теории и получить заветный оффер.

▪Front-end. Вопросы на собеседовании - Репозиторий видеокаста, содержит коллекцию вопросов, которые можно получить на техническом собеседовании на вакансию Junior/Middle Front-end разработчик.

▪Вопросы (с ответами) кандидату на должность frontend разработчика

▪Front End Interview Handbook - В отличие от типичных собеседований, в frontend собеседованиях меньше внимания уделяется алгоритмам и больше вопросов о сложных знаниях и экспертизе в предметной области - HTML, CSS, JavaScript. Этот репозиторий содержит все, что вам нужно знать для прохождения собеседований frontend собеседованиями.

▪ Полное собеседование React разработчика 2024🧑🏻‍💻

▪Front-end Developer Interview Questions
список полезных вопросов с собесов.

▪ Interview-questions наиболее часто задаваемые вопросы Frontend-разработчику.

▪Список тестовых заданий на позицию JS-разработчика

▪10 задач по промисам JavaScript


@javascriptv

Читать полностью…

Javascript

🖥 12 JavaScript-фреймворков, о которых стоит знать

⏩Next.js — это мощнейший фулстек-фреймворк JavaScript на основе React для веб-разработки быстрых и легко индексируемых сайтов. Он особенно хорош для тех, кто хочет создавать веб-страницы, которые быстро загружаются и легко находятся в поисковиках.

Одна из его ключевых особенностей — автоматическая оптимизация изображений и удобная система навигации по сайту. Это делает разработку страниц проще и улучшает пользовательский опыт. Next.js идеально подходит для создания современных веб-проектов, где важны скорость загрузки и удобство разработки.


⏩Vue.js часто рекомендуют в качестве старта для новичков в области JS-разработки благодаря его простоте в изучении. Он используется для создания пользовательских интерфейсов и одностраничных приложений.

Экосистема Vue включает в себя Vue Router для маршрутизации, Vuex для управления состоянием и Vue CLI для сборки проекта, что делает её комплексным решением для специалистов, ищущих баланс между производительностью, гибкостью и скоростью разработки.


⏩Svelte JS набирает популярность среди разработчиков, потому что предлагает революционный подход к созданию прогрессивных веб-приложений.

В отличие от Vue или React, Svelte JS минимизирует необходимость в активных обновлениях DOM во время выполнения приложения, так как большая часть работы проходит на этапе компиляции. Также к преимуществам отнесём то, что готовый продукт не требует высокой вычислительной мощности от клиентского устройства.

Про остальные фреймворки можно почитать тут
📎 Статья

@javascriptv

Читать полностью…

Javascript

Как программисту успешно проходить собеседования?

Я Андрей Шопинский — Frontend-разработчик из крупного Российского банка.

⚠️ 5 апреля в 18:30 по МСК я проведу бесплатный эфир в своём Telegram-канале про Frontend-разработку!

На трансляции будут раскрыты следующие темы:
— Как представить себя и говорить о своих достижениях?
— Какие бывают красные флаги у работодателя?
— Как получить сочный оффер на хороший прайс?

🔥 Ты сможешь задать свои вопросы в прямом ЭФИРЕ!🔥

Подписывайся на канал, чтобы не пропустить!

Реклама. ИП Малев С.И. ИНН: 667101819072. erid: 2VtzqxXYTki

Читать полностью…

Javascript

🖥 Microsoft представила инструмент для веб-разработки Babylon.js 7.0 с новыми опциями процедурной геометрии

⏩Microsoft представила инструмент для веб-разработки Babylon.js 7.0 с новыми опциями процедурной геометрии для создания сложных веб-игр.

⏩В своем блоге Microsoft объявила, что одним из крупнейших нововведений Babylon.js 7.0 является поддержка процедурной геометрии (Procedural Geometry) под названием Node Geometry, которая должна помочь создавать сложные игровые миры без необходимости создания огромных файлов для 3D-иллюстрации игры. Microsoft заявила, что эта опция позволяет локальному ПК создавать сложный графический контент.

⏩Microsoft открыла доступ к описанию Node Geometry Editor, демо работы Node Geometry и инструментарию новой опции.

⏩Пользователи, которые пытаются загрузить и поиграть в веб-игру с поддержкой Node Geometry, могут просто «загрузить данные Node Geometry объемом в несколько КБ и позволить своему собственному ПК или мобильному устройству создать геометрию». Очевидно, это означает более быструю загрузку сложной веб-игры и повышение общей производительности проекта.

⏩В Babylon.js 7.0 добавлена ещё одна опция, которая широко распространена в стандартных компьютерных и консольных играх. Это поддержка физики рэгдолла (Ragdoll Physics) для анимации тела персонажей. Microsoft заявляет, что эта опция позволит «любому скелетному ассету проявлять значительные изменения одним нажатием кнопки».

📎 Подробнее

@javascriptv

Читать полностью…

Javascript

🔥 Совсем недавно был выпущен бенчмарк Speedometer 3.0 от Mozilla, Google, Microsoft и Apple для измерения скорости отклика веб-приложений.

Speedometer 3.0, созданный совместными усилиями разработчиков из Mozilla, Google, Microsoft и Apple, представляет собой инструмент для оценки скорости отклика веб-приложений в различных браузерах. В новой версии Speedometer 3.0 были использованы новейшие версии фреймворков Angular, Backbone, jQuery, Lit, Preact, React, React+Redux, Svelte и Vue. Также были применены современные шаблоны проектирования сайтов и веб-приложений, такие как Webpack, Web Components и новые методы работы с DOM.

В бенчмарк добавлены тесты для оценки производительности отрисовки при помощи элемента Canvas, генерации SVG, обработки сложных CSS, работы с очень большими деревьями DOM, а также использования методов, применяемых при редактировании контента в режиме WYSIWYG и работе с новостными сайтами.

▪Github

@javascriptv

Читать полностью…

Javascript

🖥 DOM3D.js

Кодеры, ловите абсолютно безумный проект: разработчик написал инструмент для просмотра HTML/DOM, который позволяет оценить ваш сайт в 3D.

🖥 GitHub

@javascriptv

Читать полностью…

Javascript

🚀 fetch-event-stream` 🥳

Крошечная утилита (745b) для обработки событий, отправляемых сервером через API "fetch" и/или WebStreams

🔹 Поддерживает все среды выполнения JS
🔸 Позволяет использовать WebWorker / ServiceWorker
🔹 Принимает AbortController для потоков, которые можно отменить

GitHub: https://github.com/lukeed/fetch-event-stream

@javascriptv

Читать полностью…

Javascript

🖥 Хорошо ли ты знаешь JavaScript? Проверь себя

Кто-то думает, что JavaScript — это простой язык для несложных скриптов на странице. Но на самом деле современный JS умеет куда больше, чем это было раньше.
Проверь себя, насколько ты знаешь возможности JavaScript.

📎 Ссылка на тест

@javascriptv

Читать полностью…

Javascript

🖥 Сравнение Bun.js и Node.js

Держите полезную статью, в которой сравнивается Bun.js и Node.js
А перед этим давайте немного поговорим о Bun.js

⏩Вот основные преимущества Bun.js:
— Почти полная совместимость с Node.js/Deno.
— В десятки раз быстрее Node.js и Deno.
— Нативная поддержка JavaScript.
— Богатый набор встроенных Web API.
— Самый эффективный менеджер пакетов.
— Встроенный dev-сервер.
— Встроенный раннер тестов.
— Встроенный бандлер.
— Возможность почти моментального перехода с Node на Bun.

⏩Откуда такая скорость? В первую очередь это современные технологии и тонны большого труда при профилировке и оптимизации.

⏩За счет чего достигается эффект Blazingly Fast, которым так известен Bun.js сегодня?
— Bun написан на языке Zig. Это альтернатива C++ и Rust. Zig предоставляет низкоуровневые возможности для ручной работы с памятью, за счет чего появляется возможность оптимизировать вообще все элементы платформы. К слову, это и было сделано: более 80% составных частей Bun, которые так или иначе уже были реализованы в Node, были переписаны на Zig с максимальной оптимизацией обращений к памяти.

— Bun использует движок JSCore. Конечно, напрямую на производительность это не влияет, поскольку многие бенчмарки вам скажут, что JSC почти идентичен по скорости V8. Однако в данном случае дело вовсе не в производительности. JSCore предоставляет более открытую и удобную платформу для выполнения JS-кода, в отличие от V8, который изолирует этот процесс, поэтому накладные расходы на многие процессы снижаются.

📎 Статья

@javascriptv

Читать полностью…

Javascript

🖥 Создание приложения Node.js с TypeScript

⏩Полезная статья о том, как настроить TypeScript для создания приложений Node.js с pnpm, Node.js, TypeScript и ES Modules для удобной разработки.

План статьи
Понимание инструментов
Добавление файлов конфигурации
— package.json
— "type": "module" в package.json
— Зависимости
— Конфигурация TypeScript
— .gitignore
— Каталог src
Добавление скриптов
— Скрипт build
— Скрипт start
— Скрипт dev
—— tsc --watch
—— node --watch
—— run "/dev:/"

📎 Статья

@javascriptv

Читать полностью…

Javascript

🖥 Понимание среды выполнения JavaScript

Хорошая статья, описывающая, как JavaScript работает под капотом. Описывается, как во всём этом процессе участвует куча, стек вызовов, цикл событий и т.д.
Особенно это актуально освежить перед собеседованием, скорее всего пригодится.

Некоторые факты из статьи:

⏩JavaScript имеет уникальную модель выполнения, основанную на движке.

⏩В среде выполнения JavaScript есть два основных компонента: куча (Heap) и стек вызовов (Call Stack).

⏩Куча предоставляет место для хранения переменных и экземпляров, создаваемых программой.

⏩Стек вызовов играет важную роль в выполнении кода, записывая точку в программе, где выполняются операции.

⏩JavaScript использует асинхронную модель для выполнения операций, которые могут занять непредсказуемое количество времени.

⏩Web API, Очередь Обратных Вызовов и Цикл Событий обеспечивают неблокирующее поведение JavaScript.

📎 Статья

@javascriptv

Читать полностью…

Javascript

📌Годный контент по CSS и какие в нём появились нововведения

О чём говорится в статье:
🔘В CSS появились новые единицы измерения области просмотра, такие как vh, vw, vmin и vmax.

🔘Эти единицы не всегда учитывают особенности мобильных устройств, что приводит к проблемам с адаптивным дизайном.

🔘Были определены новые состояния: большой экран просмотра и малый экран просмотра, и введены новые единицы: svh и svw.

🔘Тригонометрические функции стали доступны прямо в CSS, что упрощает управление функциями трансформации и генерацию случайных значений.

🔘Трансформации теперь можно разделять и применять по отдельности, что делает код более компактным.

🔘Продвинутый синтаксис nth-child позволяет выбирать дочерние элементы по порядковому номеру и добавлять класс элемента.

🔘Ключевое слово @scope позволяет создавать пространства имён и задавать стили с ограниченной областью видимости.

📎 Статья

Enjoy)

@javascriptv

Читать полностью…

Javascript

🖥 Новая версия vue-ray для VueJS

⏩ Состоялся выпуск второй мажорной версии инструментария vue-ray.
Предыдущая стабильная версия проекта vue-ray v1.17.4 вышла в мае 2023 года.

⏩Проект vue-ray позволяет проводить отладку кода Vue с помощью Ray, чтобы быстрее устранять проблемы. Установите этот пакет в любой проект Vue 3, чтобы отправлять сообщения в приложение Ray.

🖥 Исходный код проекта опубликован на GitHub под лицензией MIT.

@javascriptv

Читать полностью…

Javascript

🖥 Как построить REST API с помощью JS, Node.js и Express.js

Держите отличную очень практикоориентированную статью.

В рамках статьи создаётся REST API для тренировочного приложения CrossFit.
В этом приложении будет создаваться, считываться, обновляться и удаляться WOD (Workouts of the Day). Что поможет пользователям (владельцам тренажерных залов) составлять планы тренировок и вести свои собственные тренировки в рамках одного приложения. Кроме того, они смогут добавлять важные советы по каждой тренировке.

📎 Статья

@javascriptv

Читать полностью…

Javascript

🖥 Самые полезные библиотеки JS для красивых анимаций

⏩Держите отличную подборку библиотек, возможно что-то из этого списка идеально закроет ваши кейсы.
В статье речь идёт про:
├╼ Three.js
├╼ Mo.js
├╼ AniJS
├╼ Typed.js
├╼ Lottie
├╼ Anime.js
├╼ Popmotion
╰╼ и ещё некоторые другие
Enjoy)

📎 Статья

@javascriptv

Читать полностью…

Javascript

⚡️ Ouroborus — CSS only

Крутая анимированная сцена, выполненная с помощью Pug и SCSS, без использования JavaScript.

https://codepen.io/graphilla/pen/GRxqzLj

@javascriptv

Читать полностью…

Javascript

🖥 Q-OTP - двухфакторная аутентификация на VueJS

Поддерживается темная тема, валидация, хинты, вставка через буфер обмена, дополнительные слоты, выбор числа блоков и стилизация.

Компонент подключается как Quasar App Extension:

quasar ext add q-otp


Пример подключения:
<template>
<QOtp
field-classes="q-ml-xs q-mr-xs"
@complete="(code) => alert(code)"
/>
</template>
<script lang="ts" setup>
import QOtp from 'quasar-app-extension-q-otp'
</script>


🖥 Исходный код доступен на GitHub под лицензией MIT

@javascriptv

Читать полностью…

Javascript

🖥 Основные тенденции развития JavaScript

Каковы основные тренды в JavaScript? На какие технологии и инструменты стоит обратить пристальное внимание?
Держите годный список от руководителя обучения JavaScript в EPAM Андрея Гордийчука — вот они, актуальные тренды:

⏩Переход к новым фреймворкам фронтенда
Одностраничные приложения (SPAs) и соответствующие фреймворки JavaScript, такие как React, Angular и Vue.js, все еще остаются популярными. Существует четкая тенденция перехода приложений с обработки на стороне клиента (CSR) на отрисовку на стороне сервера (SSR). Это требует от инженеров изучения новых фреймворков, таких как Svelte, Solid.js и Qwik.

⏩Производительность и рендеринг
Серверный рендеринг (SSR) и генерация статических сайтов (SSG) конкурируют в улучшении производительности и SEO. Последние несколько лет шаблоны рендеринга были относительно простыми, однако все более популярными становятся новые подходы, такие как Partial Hydration, Progressive Hydration и Island Architectures (Astro).

⏩Дизайн-фреймворки и дизайн-системы
Тенденции в дизайне пользовательского интерфейса (UI) включают:
— Minimal flat design и инструменты;
— Neo-brutalism on UI (контрастные цвета, мультяшная графика);
— Motion design.
Со стороны разработчиков такие инструменты, как Tailwindcss (API для вашей системы проектирования), PureCSS и Primer становятся популярнее, чем Bootstrap.

⏩Создание инструментов и монорепозиториев
На основе вышеупомянутых результатов, автоматизация процессов сборки, тестирования и развертывания приложений также будет претерпевать изменения. У Webpack более устоявшаяся экосистема и широкий спектр доступных плагинов, что делает его подходящим для более сложных проектов, но новые инструменты Vite и Turbopack становятся чрезвычайно востребованными благодаря своему более быстрому подходу встроенного модуля-скрипта и более простой конфигурации (что делает их более удобными в использовании), мгновенным обновлениям без полной пересборки, меньшим размером пакета.

📎 Читать подробнее

@javascriptv

Читать полностью…

Javascript

Устроиться фронтендером в Яндекс за выходные

18–19 мая устраиваем Weekend Offer Frontend. До 15 мая решите одну задачу в Контесте, 18-го пройдите два собеседования, а 19 мая познакомьтесь с командами и получите офер.

В мероприятии участвуют 13 команд: Поиск, E-com Поиска, Реклама, Бизнес, Cloud, 360, Игры, Умный дом, Путешествия, Аренда, Недвижимость, Авто.ру и Авто.ру Бизнес. Вы сможете пообщаться с менеджерами и выбрать проект, который покажется самым интересным.

Нанимаем в офисы по всей России, помогаем релоцироваться внутри страны.

Узнать подробности и зарегистрироваться можно здесь.

Реклама. ООО "Яндекс". ИНН 7736207543

Читать полностью…

Javascript

🖥 Список тестовых заданий на позицию JS-разработчика

⏩ Тестовое задание на позицию стажера-бекендера в юнит Авто (archived)

⏩ Тестовое задание для Javascript разработчика (JS, jQuery)

⏩ Тестовое задание на позицию cтажер-разработчик javascript HTML, CSS, JS)

⏩ JavaScript Developer (JS, Vue.js)

⏩ Frontend Developer (TypeScript/JavaScript, Angular/React/Vue)

Отличный вариант вспомнить основы перед собеседованием, пользуйтесь)

@javascriptv

Читать полностью…

Javascript

🖥 Какие темы освещаются в статье?

⏩Вы же знаете про HTMX?
HTMX — это небольшая, свободная от зависимостей библиотека JavaScript, позволяющая создавать передовые пользовательские интерфейсы с лёгкостью языка разметки. Она предоставляет доступ к AJAX, CSS Transitions, WebSockets и Server Sent Events напрямую в HTML с помощью атрибутов. Это стало переломным моментом для разработчиков, поскольку позволяет им добиться интерактивности (которую даёт JS), но непосредственно из HTML разметки.

И вот как раз о HTMX и идёт речь в этой статье

⏩Вот темы, которые освещаются:
• Установка HTMX
• Ajax-запросы с помощью HTMX
• Триггер запроса
• Модификаторы триггеров
• Фильтры триггеров
• Логирование и события в HTMX
• и ещё много всего

📎 Статья

P.S: Как думаете, какие перспективы у этой технологии? Из каких сфер HTMX может полностью вытеснить JS?

@javascriptv

Читать полностью…

Javascript

🖥 Асинхронность в JS

Хорошая статья о том, как реализована асинхронность в JavaScript, когда и для чего её использовать

Содержание статьи:
⏩Синхронный код и его проблемы
⏩Асинхронный код
⏩Стек вызовов
⏩Цикл событий
⏩Колбэки
⏩Промисы (Promise)
⏩Асинхронные функции
— Связка async/await
— Плюсы async/await

Пару фактов из статьи:
⏩Асинхронный код включает функции обратного вызова (колбэки), которые вызываются в ответ на события.

⏩Ад колбэков — проблема, связанная с использованием большого количества обратных вызовов в асинхронном коде.

⏩Промисы — объект-обёртка для асинхронного кода, который содержит состояние и работает аналогично колбэкам.

⏩Асинхронные функции — функции, которые возвращают промисы и могут быть вызваны с помощью ключевого слова await.

⏩Связка async/await позволяет писать более чистый и короткий код, а также обрабатывать ошибки с try-catch.

⏩В Node.js и некоторых браузерах есть setImmediate(), который выполняет почти то же, что и setTimeout() с нулевым таймером.

⏩Promise.all() и Promise.race() используются для ожидания выполнения всех запросов или ожидания выполнения первого запроса из списка.

⏩Для обхода асинхронных итерируемых сущностей можно использовать for await...of.

📎 Статья

@javascriptv

Читать полностью…

Javascript

Исследуешь айтишную тему, но пока нет большого опыта? Соревнуйся с равными и будь на код впереди в «Цифровом марафоне» Сбера и «Школы 21»! Три счастливчика отправятся отдыхать на премиум-курорты и прокачивать знания в СберУниверситете.

Конкурс проводят по всей России, а минимальный возраст для участия — от 18 лет. Отличная возможность оценить свои навыки и получить советы для дальнейшего развития. А главное — лучшие в своих категориях отправятся на очный финал в Москву с церемонией награждения.

Для успеха нужно пройти онлайн-игру на проверку логики и памяти, тестирование в соответствии с твоим уровнем подготовки и цифровой диктант. Здесь ты выбираешь язык, на котором будешь писать код. Заработай как можно больше очков, чтобы попасть в суперфинал, расправиться с более сложными задачами и выиграть главные призы!

Хочу участвовать!

Читать полностью…

Javascript

Объект URL в JavaScript: полный разбор

⏩Итак, создать объект URL можно 2 способами:

— Конструктор URL():

const url = new URL("https://www.example.com/path?query=123#hash");


— Использование window.location:
const currentUrl = new URL(window.location.href);



⏩Из чего состоит URL
Вот некоторые составляющие URL :
— href: полный URL.
— protocol: протокол, например https:.
— host: хост (доменное имя и порт).
— hostname: только доменное имя.
— port: только порт.
— pathname: путь после доменного имени и порта.
— search: строка запроса, начинающаяся с ?.
— hash: якорь, начинающийся с #.
— origin: протокол + домен + порт.

⏩Допустим, у нас есть такой URL, включающий все эти части:
https://www.example.com:8080/path/page.html?query=123#section


⏩Тогда объект URL для него будет выглядеть так:
const url = new URL("https://www.example.com:8080/path/page.html?query=123#section");


⏩А если мы попытаемся вывести значения разных свойств, получим следующее:
console.log(url.href);     // https://www.example.com:8080/path/page.html?query=123#section
console.log(url.protocol); // https:
console.log(url.host); // www.example.com:8080
console.log(url.hostname); // www.example.com
console.log(url.port); // 8080
console.log(url.pathname); // /path/page.html
console.log(url.search); // ?query=123
console.log(url.hash); // #section
console.log(url.origin); // https://www.example.com:8080


⏩Ещё вы можете изменить любую часть URL, изменяя соответствующее свойство.
url.search = "?newquery=456";
console.log(url.href);
// https://www.example.com:8080/path/page.html?newquery=456#section


⏩Объект URLSearchParams в сочетании с объектом URL упрощает работу с параметрами запроса.
const params = new URLSearchParams(url.search);
params.set("newparam", "value");
url.search = params.toString();
console.log(url.href);
// https://www.example.com:8080/path/page.html?newquery=456&amp;newparam=value


@javascriptv

Читать полностью…

Javascript

🔥 Monolith - это инструмент CLI для сохранения полных веб-страниц в виде отдельных HTML-файлов. Он объединяет все ресурсы в один файл, обеспечивая автономный доступ и простое архивирование.

▪ Github

@javascriptv

Читать полностью…

Javascript

🖥 Полезная статья о функциях высшего порядка в Javascript

Функция высшего порядка — это просто функция, которая либо принимает одну или несколько функций в качестве аргументов, либо возвращает функцию в качестве результата. В этой статье мы рассмотрим, что такое функции высшего порядка, почему они полезны и как использовать их в своём коде.

Абстрагируясь от общих шаблонов и операций, функции высшего порядка облегчают написание чистого и многократно используемого кода.

Функции высшего порядка полезны по нескольким причинам:

⏩Абстракция: Инкапсулируя общие паттерны и операции, функции высшего порядка позволяют писать более абстрактный и многократно используемый код. Это облегчает сопровождение кодовой базы, а также рассуждения о ней.

⏩Композиция: Функции высшего порядка позволяют создавать сложные операции путём объединения простых функций. Это делает ваш код более модульным, гибким и лёгким для понимания.

⏩Лаконичность: Функции высшего порядка могут сделать код более лаконичным и выразительным, сократив объем кода, который вам нужно написать. Это облегчает написание и понимание сложной логики, а также отладку кода.

📎 Статья

@javascriptv

Читать полностью…

Javascript

🖥 Несколько супер-полезных однострочников на JS

⏩Проверить, является ли путь относительным

const isRelative = (path) => !/^([a-z]+:)?[\\/]/i.test(path);

isRelative('/foo/bar/baz'); // false
isRelative('C:\\foo\\bar\\baz'); // false
isRelative('foo/bar/baz.txt'); // true
isRelative('foo.md'); // true



⏩Проверить, является ли строка шестнадцатеричным цветом
const isHexColor = (color) => /^#([0-9A-F]{3}|[0-9A-F]{4}|[0-9A-F]{6}|[0-9A-F]{8})$/i.test(color);

isHexColor('#012'); // true
isHexColor('#A1B2C3'); // true
isHexColor('012'); // false
isHexColor('#GHIJKL'); // false



⏩Подсчитать количество разных дней между двумя датами
const diffDays = (date, otherDate) => Math.ceil(Math.abs(date - otherDate) / (1000 * 60 * 60 * 24));

diffDays(new Date('2014-12-19'), new Date('2020-01-01')); // 1839



⏩Скопировать в буфер обмена
const copyToClipboard = (text) => navigator.clipboard.writeText(text);

copyToClipboard("Hello World");


@javascriptv

Читать полностью…
Subscribe to a channel