JavaScript Ready | Программирование
8.16K subscribers
841 photos
48 videos
372 links
Авторский канал по разработке на JavaScript.
Ресурсы, обучения, задачи, шпаргалки.
Ежедневно информация пополняется!

Автор: @energy_it

Реклама на бирже:
https://telega.in/c/javascript_readyy
Download Telegram
👍 Нашел отличную статью на Хабре: «От Electron к Tauri: как я пересобрал архитектуру десктоп-приложения»!

В этой статье:
• Автор подробно рассказывает, как он пробовал разные архитектуры для десктоп-приложения;
• Показывает реальные проблемы производительности, безопасности и размера дистрибутива;
• Делится опытом перехода на Rust + Tauri, где фронтенд остаётся веб-UI, а ядро становится быстрым и безопасным;
• Объясняет архитектурные решения, которые позволили снизить размер сборки и улучшить UX;


🔊 Продолжайте читать на Habr!


📣 JS Ready | #статья
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥10👍7🤝63
📂 Напоминалка по API и SDK!

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

На картинке — наглядная шпаргалка по разнице между API и SDK: структура API-запроса (метод, endpoint, параметры, ключ доступа) и что обычно входит в SDK (библиотеки, API, модули и инструменты для разработки).

Сохрани, чтобы не забыть!

📣 JS Ready | #ресурс
Please open Telegram to view this post
VIEW IN TELEGRAM
👍13🔥7🤝7
📱 Создаём таймер обратного отсчёта — компактный и наглядный проект, который поможет лучше понять работу с датами и временем!

Задача: показать, сколько осталось дней, часов, минут и секунд до заданной даты прямо в консоли.

В этом посте:
Вычисляем разницу между датами

Переводим миллисекунды в читаемый формат

Обновляем таймер каждую секунду с помощью setInterval()


📣 JS Ready | #задача
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥12👍9🤝81
📂 Напоминалка для работы с JavaScript!

Например, let и const используются для корректного объявления переменных, map и forEach — для обработки массивов, а includes и split помогают при работе со строками.

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

Сохрани, чтобы не забыть!

📣 JS Ready | #ресурс
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥17👍97
Выполнение опциональных колбэков!

Очень частая ситуация: колбэк может быть передан, а может и нет.

Обычно код обрастает проверками:
if (typeof onClose === 'function') {
onClose();
}


В современном JS это решается одной операцией - optional chaining для вызова функций:
onClose?.();


То же самое работает с аргументами и вложенными объектами:
options.onError?.(err);


Если функции нет - ничего не происходит, без ошибок и лишнего кода.

Особенно хорошо читается в UI, хендлерах и SDK:
props.onSubmit?.(data);


🔥 ?.() - короткий и безопасный способ вызывать опциональные функции без проверок.

📣 JS Ready | #совет
Please open Telegram to view this post
VIEW IN TELEGRAM
11👍8🔥7
This media is not supported in your browser
VIEW IN TELEGRAM
❤️ Crockford — материалы человека, который сыграл ключевую роль в развитии JS!

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

📌 Оставляю ссылочку: crockford.com

📣 JS Ready | #ресурс
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥11👍7🤝7
📱 Рассмотрим ES Modules: статическая и динамическая загрузка кода!

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

📣 JS Ready | #шпора
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥14👍7🤝7
😕 Нашёл классную пошаговую статью на Хабре про создание Telegram‑бота на чистом JavaScript!

В этой статье:
• Использование библиотеки grammY для работы с Telegram‑ботом;
• Конфигурация проекта;
• Как настроить клавиатуры, context‑объект и обработку ошибок;
• Инструкция по деплою бота на сервер;


🔊 Продолжай читать на Habr!


📣JS Ready | #статья
Please open Telegram to view this post
VIEW IN TELEGRAM
👍15🔥87
Итерация по объекту как по массиву пар с Object.entries()!

for...in перебирает enumerable строковые ключи, включая унаследованные — такие итерации требуют фильтрации через Object.hasOwn() или hasOwnProperty().

Если нужны только собственные enumerable строковые ключи — удобнее сразу использовать Object.entries().

Object.entries() возвращает пары own enumerable string-keyed свойств (без Symbol, без non-enumerable):
const user = {
name: "Alex",
age: 30,
role: "developer"
};

for (const [key, value] of Object.entries(user)) {
console.log(`${key}: ${value}`);
}


Распространённый кейс — валидации перед запуском бизнес-логики (например, запретить undefined в значениях):
Object.entries(user).forEach(([k, v]) => {
if (v === undefined) {
throw new Error(`Значение "${k}" не должно быть undefined`);
}
});


Map оправдан, когда нужны частые set/delete, map.size, не-строковые ключи или словарная структура без ограничений объекта:
const userMap = new Map(Object.entries(user));
console.log(userMap.get("role"));


Нормализация объекта в массив DTO для API или записи в БД:
const dto = Object.entries(user).map(([field, value]) => ({
field,
value,
updatedAt: new Date().toISOString()
}));

console.log(dto);


🔥 Такой подход делает обработку объекта структурной и удобной для масштабирования логики.

📣 JS Ready | #практика
Please open Telegram to view this post
VIEW IN TELEGRAM
1👍12🤝7🔥61
🤓 Напоминалка для работы с Git

Если кто не знает, Git — это система контроля версий, которая помогает отслеживать историю изменений в файлах.

Например с помощью команды git pull, можно загружать удаленные репозитории к себе на ПК, чтобы вести разработку локально, не затрагивая продуктовую или dev ветку.

Сохрани в избранное, чтобы не забыть!

📣 JS Ready | #ресурс
Please open Telegram to view this post
VIEW IN TELEGRAM
👍11🤝8🔥73
Что же выведет консоль?
Anonymous Quiz
50%
A
29%
B
13%
C
8%
D
10👍9🔥6🤝3
📂 Напоминалка по объявлениям функций!

Например, Function Declaration поддерживает hoisting и доступна до места объявления, а Arrow Function предоставляет более компактный синтаксис и иной механизм работы с контекстом this.

На картинке — 4 основных способа объявления функций в JavaScript, которые необходимо уверенно понимать и применять в повседневной разработке.

Сохрани, чтобы не забыть!

📣 JS Ready | #ресурс
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥15🤝12👍10