JavaScript заметки
8.68K subscribers
2.69K photos
4 videos
1.24K links
Регулярные заметки по практическому JavaScript. Обучащию посты позволят прокачать навыки во Frontend-разработке.

Можно почитать пока компилируется проект :)

Сотрудничество: @noname_media

Канал на бирже: telega.in/channels/notesjs/card?r=Wj7h1mbl
加入频道
Парадокс Монти Холла глазами JavaScript

Я хочу посвятить эту статью известной задаче в математике, относящейся к теории вероятности. Так же мы попытаемся решить эту задачу на JavaScript. Я сразу приступлю к условию задачи.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
Работа с формами и их валидация

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

#полезное
👍6
Смерть third-party cookies. Что ждет нас в 2024?

Похоже, что в череде всевозможных инициатив по борьбе со «сторонними» куками начал проглядываться конец. Давайте разберемся, что происходит и зачем все это нужно.
Куки — браузерный механизм, который позволяет хранить данные по пользователю с привязкой к домену и затем передавать эти данные при запросах. Куку можно установить как со стороны сервера через специальный заголовок Set‑Cookie, так и в браузере прямо на странице через javascript. После этого кука будет передаваться при каждом запросе из браузера к домену.
Куки позволяют воплощать в жизнь множество как полезных, так и сомнительных механик. Из неприятных — возможность отслеживания пользователя сторонними сайтами или увеличение риска CSRF.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
2
Работа с условными операторами

Условные операторы позволяют выполнить различные блоки кода в зависимости от заданных условий.

#полезное
👍2
Какие методы используются для сбора данных о твоем браузере? Как собирают информацию о пользователях?

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

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
Работа с REST API с использованием Fetch

Fetch API используется для выполнения HTTP-запросов и обработки ответов.

#полезное
👍3
Интересные трюки HTML. Экстремальный минимализм

Мы уже много говорили про оптимизацию сайтов до минимального размера, преимущества статичного HTML, а также упаковку сайта (и веб-сервера) в портативный формат одного исполняемого файла, который нативно исполняется под любой ОС.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
Использование Object Destructuring

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

#полезное
👍1
Как сгенерировать безопасный, типизированный Node.js API с использованием Prisma, TypeGraphQL и graphql-query-purifier

Создание эффективного Node.js API, обеспечивающего безопасность данных и типобезопасность, может быть сложной задачей. Это руководство демонстрирует процесс с использованием Prisma, TypeGraphQL и graphql-query-purifier.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
👍1
Использование Event Delegation для обработки событий

Event Delegation позволяет обрабатывать события на родительском элементе, вместо назначения обработчиков на каждый дочерний элемент отдельно.

#полезное
👍2
Удобные формы для Vue 3

Механизм реактивности VueJS и нововведение в направлении provide/inject позволяют разработчикам экспериментировать и реализовывать новые интересные решения. В этой статье я расскажу о жизненном цикле разработки системы для работы с формами, которую я запихнул в отдельную библиотеку.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
Использование метода bind() для установки контекста функции

Метод bind() используется для создания новой функции с определенным контекстом выполнения.

#полезное
👍1
Кулинарный гид по Vue.js: всё о props

В этой статье разберемся, как frontend-разработчику готовить на «кухне» props. Выбирайте подходящий уровень сложности: джуны-поварята смогут лучше разобраться в работе и применении props на фреймворке Vue.js, а еще мы затронем тему валидации. Для мидлов и более опытных специалистов — настоящих шеф-поваров мы приготовили продвинутые кулинарные техники props, где можно освежить в памяти некоторые детали или решить проектную проблему, если замылился глаз. 

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
1
Использование sessionStorage для временного хранения данных на клиенте

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

#полезное
👍1
React + Three.js. Создаём собственный 3D шутер

В современной веб-разработке границы между классическими и веб-приложениями стираются с каждым днём. Сегодня мы можем создавать не только интерактивные сайты, но и полноценные игры прямо в браузере. Одним из инструментов, который делает это возможным, является библиотека React Three Fiber - мощное средство для создания 3D-графики на основе Three.js с использованием технологии React.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
Манипуляция с элементами страницы: создание, удаление и изменение HTML-элементов

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

В данном примере мы создаем новый элемент div с текстом "Новый элемент" и классом "my-class". Затем мы добавляем этот элемент в конец body документа с помощью метода appendChild(). Мы также изменяем содержимое элемента с помощью свойства textContent и стилизуем его, устанавливая значение свойства backgroundColor.

Через 3 секунды мы удаляем элемент с помощью метода remove(). Это демонстрирует возможность удаления элементов из документа.

Таким образом, манипуляция с элементами страницы позволяет нам динамически создавать, изменять и удалять HTML-элементы, что открывает широкие возможности для создания интерактивных и динамических веб-приложений.

#полезное
👍1
Увеличиваем свою производительность в WebStorm / PhpStorm c помощью шаблонов

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

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
Асинхронные запросы с использованием fetch()

fetch() используется для отправки асинхронных HTTP-запросов. В примере мы отправляем запрос к удаленному серверу, ожидаем ответ в формате JSON и выводим данные или обрабатываем ошибку.

#полезное
👍2
8 продвинутых вопросов для собеседования по JavaScript

Хотите стать JS-специалистом? Тогда стоит детально разобрать ключевые вопросы для собеседования по JavaScript. Это поможет вам усвоить основные понятия и успешно ответить на другие вопросы.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
3
Сортировка массивов объектов

В примере мы создаем массив объектов products, содержащий информацию о различных продуктах. Затем мы используем метод sort() для сортировки этого массива по полю price в порядке возрастания, используя функцию sortByPriceAscending в качестве функции сравнения. Вы можете создать аналогичные функции для сортировки в порядке убывания или для сортировки по другим полям объектов.

#полезное
👍1