Изучайте JavaScript бесплатно в 2025 году:

1. http://javascript.info

2. http://javascriptquiz.com

3. http://eloquentjavascript.net

4. http://learn-js.org

5. http://javascript30.com

👉 Гайды по JavaScript | дать буст

Эта библиотека JavaScript позволяет добавить потрясающие эффекты курсора, которые выглядят плавно, футуристично и безумно круто.

Подготовьтесь заставить пользователей сказать WOWWW ✌️

https://cursify.vercel.app/

👉 Гайды по JavaScript | дать буст

Методы объектов JavaScript - часть 1

Object.keys() – получение всех ключей объекта.
Object.values() – получение всех значений объекта.
Object.entries() – преобразование объекта в массив пар [ключ, значение].
Object.assign() – объединение объектов.
Object.freeze() – предотвращение изменения объекта.

👉 Гайды по JavaScript | дать буст

Элока́нтный JavaScript от Марийна Хавербеке

Эта высоко оцененная книга идеально подходит как для начинающих, так и для опытных программистов, которые хотят углубить свои знания. И она БЕСПЛАТНАЯ!

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

⏩Ссылка: https://eloquentjavascript.net

👉 Гайды по JavaScript | дать буст

Знали ли вы, что можно редактировать любой сайт с помощью простого трюка на JavaScript?

Этот способ позволяет временно изменять содержимое веб-страницы прямо в браузере без изменения исходного кода сайта.

🔸Нажмите F12, чтобы открыть DevTools
🔸Перейдите на вкладку Console
🔸Введите в консоли JS:

document.designMode = "on"

Закройте DevTools и редактируйте страницу как обычный текст!

👉 Гайды по JavaScript | дать буст

❌Избегайте монолитных компонентов, которые объединяют рендеринг, управление состоянием и конфигурацию (например, ID, refs) в одном блоке — это усложняет поддержку, тестирование и повторное использование.

☑ Вместо этого разделяйте функциональность на композиционные компоненты и используйте контекст для передачи конфигурации и состояния.

👉 Гайды по JavaScript | дать буст

Методы объектов JavaScript - часть 2

Object.seal(obj) – можно менять свойства, но нельзя добавлять/удалять.
Object.hasOwnProperty(key) – проверка, есть ли ключ в объекте.
Object.fromEntries(entries) – превращает массив пар ключ-значение обратно в объект.
Object.getOwnPropertyDescriptors(obj) – показывает, какие свойства у объекта и их флаги.
Object.create(proto) – создаёт новый объект с указанным прототипом.

Полезно, если работаешь с данными, конфигами или хочешь лучше понимать объекты в JS!

👉 Гайды по JavaScript | дать буст

Научись создавать видеоигру с нуля!

С помощью JavaScript и ThreeJS ты создашь Crossy Road.

Полный учебник со всеми шагами: ссылка

👉 Гайды по JavaScript | дать буст

Обработка ошибок в Javascript - часть 1

В коде используются конструкции try-catch для обработки ошибок при разборе JSON и при развертывании сервиса. Также определён пользовательский класс DeploymentError, который расширяет Error и используется для генерации ошибок при неправильном выборе сервиса.

👉 Гайды по JavaScript | дать буст

Minecraft в браузере при 120FPS?

Движок от первого лица с JavaScript и ThreeJS.

С открытым исходным кодом и очень простой в использовании: клик

👉 Гайды по JavaScript | дать буст

Наткнулся на интересную библиотеку — Shepherd JS

Это мощная библиотека JS, предназначенная для создания интерактивных пошаговых туров и руководств на веб-страницах

Она поддерживает интеграцию с различными фреймворками, такими как React, Ember, Angular, Vue.js, а также может использоваться с чистым JavaScript

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

Для WordPress существует плагин Simple Tour Guide на основе Shepherd.js

Если вы хотите увидеть Shepherd.js в действии, рекомендую посмотреть следующее видео

👉 Гайды по JavaScript | дать буст

Обработка ошибок JavaScript - часть 2

Этот код демонстрирует обработку ошибок в JavaScript с try-catch в async/await:

⏩fetchDeployment
Делает fetch к API.
Если response.ok === false, выбрасывает ошибку.
В catch логирует ошибку, если запрос провалился.

⏩deployWithCleanup
Имитация развертывания с выбрасыванием ошибки.
В catch логируется ошибка.
finally выполняется всегда, логируя очистку ресурсов.

Это стандартный паттерн для безопасной работы с API, обработки ошибок и очистки после выполнения операций.

👉 Гайды по JavaScript | дать буст

Шпаргалка по новым методам Set в JS

С недавнего времени все современные браузеры и Node.js поддерживают 7 новых методов Set, которые значительно упрощают сравнение массивов и наборов данных

👉 Гайды по JavaScript | дать буст

Если вы только начинаете изучать веб-разработку, этот курс для вас.

Вы создадите погодное приложение, которое будет отображать данные о погоде в реальном времени и прогноз на 7 дней.

Вы будете использовать фреймворк Next.js, Tailwind CSS для стилей и TypeScript для добавления сильной типизации.

⏩Ссылка тут

👉 Гайды по JavaScript | дать буст

Эффектный компонент React!

Лучший вход для ваших кодов одноразового использования (OTP)

Настраиваемый, доступный и очень приятный UX:
→ npm install input-otp

👉 Гайды по JavaScript | дать буст

Методы даты 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() – текущий timestamp
Date.parse('2024-08-26') – timestamp для даты
Date.UTC(2024, 7, 26) – UTC timestamp

👉 Гайды по JavaScript | дать буст

Эта эволюция HTML заставит вас писать меньше JavaScript!

Атрибут "command" позволит вам вызывать методы HTML-элементов без написания кода.

А что думаете вы? 🤔

👉 Гайды по JavaScript | дать буст

JavaScript - LocalStorage против SessionStorage.

Разница между localStorage и sessionStorage заключается в продолжительности хранения данных и области их видимости:

Продолжительность хранения:

⏩localStorage: Данные сохраняются даже после закрытия браузера и могут быть доступны при последующих посещениях страницы. Они остаются до тех пор, пока не будут явно удалены через код или пользователь не очистит кеш браузера.

⏩sessionStorage: Данные сохраняются только во время сессии браузера. Когда пользователь закрывает вкладку или браузер, данные удаляются.

Область видимости:

⏩localStorage: Данные доступны для всех вкладок и окон, открытых на одном и том же домене.

⏩sessionStorage: Данные доступны только в пределах одной вкладки или окна. Если пользователь открывает новую вкладку, даже на том же сайте, данные sessionStorage не будут доступны.

👉 Гайды по JavaScript | дать буст