This media is not supported in your browser
VIEW IN TELEGRAM
Minecraft в браузере при 120FPS?
Движок от первого лица с JavaScript и ThreeJS.
С открытым исходным кодом и очень простой в использовании: клик
👉 Гайды по JavaScript | дать буст
Движок от первого лица с JavaScript и ThreeJS.
С открытым исходным кодом и очень простой в использовании: клик
Please open Telegram to view this post
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
Наткнулся на интересную библиотеку — Shepherd JS
Это мощная библиотека JS, предназначенная для создания интерактивных пошаговых туров и руководств на веб-страницах
Она поддерживает интеграцию с различными фреймворками, такими как React, Ember, Angular, Vue.js, а также может использоваться с чистым JavaScript
А минималистичный стиль оформления позволяет настроить внешний вид под свой дизайн без лишних заморочек. Плюс, полная поддержка клавиатурной навигации и соответствие стандартам доступности
Для WordPress существует плагин Simple Tour Guide на основе Shepherd.js
Если вы хотите увидеть Shepherd.js в действии, рекомендую посмотреть следующее видео
👉 Гайды по JavaScript | дать буст
Это мощная библиотека JS, предназначенная для создания интерактивных пошаговых туров и руководств на веб-страницах
Она поддерживает интеграцию с различными фреймворками, такими как React, Ember, Angular, Vue.js, а также может использоваться с чистым JavaScript
А минималистичный стиль оформления позволяет настроить внешний вид под свой дизайн без лишних заморочек. Плюс, полная поддержка клавиатурной навигации и соответствие стандартам доступности
Для WordPress существует плагин Simple Tour Guide на основе Shepherd.js
Если вы хотите увидеть Shepherd.js в действии, рекомендую посмотреть следующее видео
Please open Telegram to view this post
VIEW IN TELEGRAM
👍3
Обработка ошибок JavaScript - часть 2
Этот код демонстрирует обработку ошибок в JavaScript с try-catch в async/await:
⏩
Делает fetch к API.
Если response.ok === false, выбрасывает ошибку.
В catch логирует ошибку, если запрос провалился.
⏩
Имитация развертывания с выбрасыванием ошибки.
В catch логируется ошибка.
finally выполняется всегда, логируя очистку ресурсов.
Это стандартный паттерн для безопасной работы с API, обработки ошибок и очистки после выполнения операций.
👉 Гайды по JavaScript | дать буст
Этот код демонстрирует обработку ошибок в JavaScript с try-catch в async/await:
fetchDeployment
Делает fetch к API.
Если response.ok === false, выбрасывает ошибку.
В catch логирует ошибку, если запрос провалился.
deployWithCleanup
Имитация развертывания с выбрасыванием ошибки.
В catch логируется ошибка.
finally выполняется всегда, логируя очистку ресурсов.
Это стандартный паттерн для безопасной работы с API, обработки ошибок и очистки после выполнения операций.
Please open Telegram to view this post
VIEW IN TELEGRAM
Шпаргалка по новым методам Set в JS
С недавнего времени все современные браузеры и Node.js поддерживают 7 новых методов Set, которые значительно упрощают сравнение массивов и наборов данных
👉 Гайды по JavaScript | дать буст
С недавнего времени все современные браузеры и Node.js поддерживают 7 новых методов Set, которые значительно упрощают сравнение массивов и наборов данных
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2
Если вы только начинаете изучать веб-разработку, этот курс для вас.
Вы создадите погодное приложение, которое будет отображать данные о погоде в реальном времени и прогноз на 7 дней.
Вы будете использовать фреймворк Next.js, Tailwind CSS для стилей и TypeScript для добавления сильной типизации.
⏩ Ссылка тут
👉 Гайды по JavaScript | дать буст
Вы создадите погодное приложение, которое будет отображать данные о погоде в реальном времени и прогноз на 7 дней.
Вы будете использовать фреймворк Next.js, Tailwind CSS для стилей и TypeScript для добавления сильной типизации.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤2
This media is not supported in your browser
VIEW IN TELEGRAM
Эффектный компонент React!
Лучший вход для ваших кодов одноразового использования (OTP)
Настраиваемый, доступный и очень приятный UX:
→
👉 Гайды по JavaScript | дать буст
Лучший вход для ваших кодов одноразового использования (OTP)
Настраиваемый, доступный и очень приятный UX:
→
npm install input-otp
Please open Telegram to view this post
VIEW IN TELEGRAM
Не используй зависимости для этого в JavaScript!
Создавай относительное время на любом языке с помощью
Передаёшь timestamp, и он говорит, сколько времени прошло:
"3 часа назад", "7 месяцев назад", "12 секунд назад"...
Менее чем в 30 строках кода
⏩ Здесь представлена рабочая демонстрация кода, чтобы вы могли опробовать его и легко скопировать:
https://bit.ly/3WHO5ZM
👉 Гайды по JavaScript | дать буст
Создавай относительное время на любом языке с помощью
Intl
.Передаёшь timestamp, и он говорит, сколько времени прошло:
"3 часа назад", "7 месяцев назад", "12 секунд назад"...
Менее чем в 30 строках кода
https://bit.ly/3WHO5ZM
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
Методы даты JavaScript
Если работаешь с датами в JS, вот основные методы, которые тебе пригодятся:
Получение даты и времени:
Изменение даты:
Форматирование:
Работа с временными метками:
👉 Гайды по JavaScript | дать буст
Если работаешь с датами в JS, вот основные методы, которые тебе пригодятся:
Получение даты и времени:
date.getFullYear()
– год (2024)date.getMonth()
– месяц (0-11, где 0 – январь)date.getDate()
– день месяца (1-31)date.getDay()
– день недели (0 – вс, 1 – пн)date.getTime()
– миллисекунды с 01.01.1970Изменение даты:
date.setFullYear(2025)
– изменить годdate.setMonth(11)
– поставить декабрьdate.setDate(31)
– установить последний день месяцаФорматирование:
date.toISOString()
– ISO формат (2024-08-26T08:23:34Z)date.toDateString()
– короткая дата (Mon Aug 26 2024)date.toLocaleDateString()
– локальный формат (8/26/2024)Работа с временными метками:
Date.now()
– текущий timestampDate.parse('2024-08-26')
– timestamp для датыDate.UTC(2024, 7, 26)
– UTC timestampPlease open Telegram to view this post
VIEW IN TELEGRAM
👍2
This media is not supported in your browser
VIEW IN TELEGRAM
Эта эволюция HTML заставит вас писать меньше JavaScript!
Атрибут "command" позволит вам вызывать методы HTML-элементов без написания кода.
А что думаете вы?🤔
👉 Гайды по JavaScript | дать буст
Атрибут "command" позволит вам вызывать методы HTML-элементов без написания кода.
А что думаете вы?
Please open Telegram to view this post
VIEW IN TELEGRAM
👍4❤2
JavaScript - LocalStorage против SessionStorage.
Разница между localStorage и sessionStorage заключается в продолжительности хранения данных и области их видимости:
Продолжительность хранения:
⏩
⏩
Область видимости:
⏩
⏩
👉 Гайды по JavaScript | дать буст
Разница между localStorage и sessionStorage заключается в продолжительности хранения данных и области их видимости:
Продолжительность хранения:
localStorage
: Данные сохраняются даже после закрытия браузера и могут быть доступны при последующих посещениях страницы. Они остаются до тех пор, пока не будут явно удалены через код или пользователь не очистит кеш браузера.sessionStorage
: Данные сохраняются только во время сессии браузера. Когда пользователь закрывает вкладку или браузер, данные удаляются.Область видимости:
localStorage
: Данные доступны для всех вкладок и окон, открытых на одном и том же домене.sessionStorage
: Данные доступны только в пределах одной вкладки или окна. Если пользователь открывает новую вкладку, даже на том же сайте, данные sessionStorage не будут доступны.Please open Telegram to view this post
VIEW IN TELEGRAM
Если вы хотите улучшить свои навыки работы с JavaScript и Angular, то этот курс для вас.
Вы будете использовать эти популярные инструменты для создания шахматной игры с искусственным интеллектом.
Вы также узнаете о динамике шахматной доски, игровой механике, интеграции ИИ и многом другом.
⏩ Ссылка
👉 Гайды по JavaScript | дать буст
Вы будете использовать эти популярные инструменты для создания шахматной игры с искусственным интеллектом.
Вы также узнаете о динамике шахматной доски, игровой механике, интеграции ИИ и многом другом.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Ищете календарь React, в котором есть все?
✓ Выбор дней, диапазонов и полная настройка.
✓ Локализация на любой язык и часовой пояс
✓ Легкая стилизация с помощью CSS
✓ Настраиваемые компоненты
>
👉 Гайды по JavaScript | дать буст
✓ Выбор дней, диапазонов и полная настройка.
✓ Локализация на любой язык и часовой пояс
✓ Легкая стилизация с помощью CSS
✓ Настраиваемые компоненты
>
npm install react-day-picker
Please open Telegram to view this post
VIEW IN TELEGRAM
❤3
This media is not supported in your browser
VIEW IN TELEGRAM
Создавай впечатляющие WEB-страницы с анимацией при прокрутке!
Эта библиотека JS поможет сделать это ЛЕГКО
✓ Индикаторы на полосе прокрутки
✓ Автоматические анимации секций
✓ Параллакс-эффекты на фоне
Всё легко кастомизируется через CSS или JS
🔜 http://revealjs.com
👉 Гайды по JavaScript | дать буст
Эта библиотека JS поможет сделать это ЛЕГКО
✓ Индикаторы на полосе прокрутки
✓ Автоматические анимации секций
✓ Параллакс-эффекты на фоне
Всё легко кастомизируется через CSS или JS
Please open Telegram to view this post
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
Продвинутая JavaScript отладка при помощи
Довольно аккуратно, правда?👍
Конечно table лучше всего работает с табличными данными. Если у всех объектов будут абсолютно разные поля — вы получите таблицу, в которой большинство ячеек —
👉 Гайды по JavaScript | дать буст
console.table()
Довольно аккуратно, правда?
Конечно table лучше всего работает с табличными данными. Если у всех объектов будут абсолютно разные поля — вы получите таблицу, в которой большинство ячеек —
undefined
. Но, не смотря на это, все будет выглядеть аккуратно, давая вам хороший общий обзорPlease open Telegram to view this post
VIEW IN TELEGRAM
👍2
React Js (1).pdf
34.1 MB
Этот файл — подробное руководство по React.js, которое охватывает как базовые, так и продвинутые темы. 🔥
Он подходит для разработчиков любого уровня подготовки и может использоваться как для обучения, так и в качестве справочника в повседневной работе.
👉 Гайды по JavaScript | дать буст
Он подходит для разработчиков любого уровня подготовки и может использоваться как для обучения, так и в качестве справочника в повседневной работе.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1
Свойства-символы остаются скрытыми при обычных переборах (Object.keys, for...in), но их можно достать через Object.getOwnPropertySymbols(). Используется для скрытых данных и внутренних API.
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍5🔥1
AllFrontend.pdf
58.6 MB
Держите огромную коллекцию разборов задач и вопросов с собеседований по фронтенду
👉 Гайды по JavaScript | дать буст
Please open Telegram to view this post
VIEW IN TELEGRAM
👍4