Как стать автором
Поиск
Написать публикацию
Обновить
331.57

JavaScript *

Прототипно-ориентированный язык программирования

Сначала показывать
Порог рейтинга
Уровень сложности

Откройте для себя весь потенциал AbortController

Уровень сложностиСредний
Время на прочтение6 мин
Количество просмотров9K



В этой статье я расскажу об одном из стандартных API JavaScript, о котором, вы, возможно не слышали. Это AbortController.


❯ Что такое AbortController?


AbortController — это глобальный класс в JS, который можно использовать для прерывания любых асинхронных операций.


const controller = new AbortController()

controller.signal
controller.abort()
Читать дальше →

Что нас ждет в Next.js 15: обзор заявленных новинок

Уровень сложностиПростой
Время на прочтение7 мин
Количество просмотров6.4K

Привет, на связи Майя из Spectr. Сегодня я поделюсь обзором последней, пятнадцатой версии Next.js. В статье мы разберем интересные улучшения: React Compiler, улучшенные сообщения об ошибках гидрации в ‘use-client’, исправление поведения кэширования, Partial Prerendering (PPR), API next/after, обновленный дизайн create-next-app и оптимизацию бандлинга внешних пакетов.

Узнать о функциях Next.js 15

Веб-доступность. Бесконечная лента

Уровень сложностиСредний
Время на прочтение6 мин
Количество просмотров2.2K

Про то, что такое бесконечная лента (Infinity Scroll, Feed) - есть много статей, постов, гайдов по реализации самого функционала, и, кажется, рассказывать про то, как именно ее реализовать и что это такое - не идея этой статьи. Так же, как и рассказывать о плюсах и минусах этого подхода. Если Вы все же не знаете, что это за чудо инженерной мысли - можно ознакомиться тут.

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

Читать далее

Как я решил вернуться в алготрейдинг после 10 летнего перерыва

Уровень сложностиСредний
Время на прочтение9 мин
Количество просмотров6.4K

Самое главное, что никакого отношения к слову алко это не имеет.
В течении нескольких лет я торговал в связке программы технического анализа AmiBroker + торговый терминал QUIK через .tri и .trr файлы в основном на фьючерсах на срочном рынке.
Не могу сказать что это было неудачным опытом, но со временем я узнал про распределение активов (Asset allocation) и понял что очень сложно соревноваться с бенчмарком в виде фондового индекса.

В теории это означает что можно купить индекс и забыть об этом, заниматься своими делами, бизнесом, семьёй - а индекс растёт (ну или падает, смотря какое время) и для этого не нужно прикладывать никаких действий.
А за связкой AmiBroker + QUIK постоянно нужно было присматривать, следить не отвалился ли адаптер импорта через .tri файл. А ещё иметь несколько виртуальных машин с установленными копиями Windows на каждой виртуалке на одном физическом компьютере для разных брокеров. Ведь возможна была установка только одной пары AmiBroker + QUIK на одну винду.
Всё это мне не особо нравилось.

В 2024 году захотелось что-то лёгкое - без Windows и современное - через API интерфейс. Желательно бесплатное для пользователя. Несколько лет назад я уже пытался узнать появились ли у российских брокеров API для работы с ними, но так и не собрался. Этой осенью я стал активно искать информацию - какой брокер имеет АПИ для работы с физлицами. Не смог найти никакой сводной таблицы и нашёл только три варианта:

📍 ФИНАМ
📍 Алор
📍 Тинькофф Инвестиции
📍 (на полноту сведений не претендую и буду рад узнать ещё варианты брокеров с АПИ)

По субъективным причинам я выбрать работать с T‑Bank Invest API (это бывший Тинькофф) через среду выполнения JavaScript Node.JS.

В статье ссылка на GitHub с кодом робота.

Самые первые шаги 🤖

Vike — современный SSR-фреймворк

Уровень сложностиПростой
Время на прочтение8 мин
Количество просмотров7K

Всем привет. Я являюсь ведущим frontend-разработчиком компании 21Yard. Мы разрабатываем сервис для поиска строительных подрядчиков. На проект я пришел желторотым масленком, который мало смыслил в seo-продвижении продукта, но жизнь внесла свои коррективы, и сейчас я хочу рассказать, как я vike покорял.

Придя на проект, я с энтузиазмом взялся за дело. На момент старта моей работы у нас уже существовал интернет-портал, написанный на php. К сожалению, он был написан на устаревшем фреймворке, поэтому было принято решение переписать его с нуля на чем-то современном - выбор пал на React. Однако, параллельно кодингу шел и маркетинг. К работе был привлечен seo-специалист, по указаниям которого мне нужно было вносить микро-правки в старый портал. Тогда я узнал, что такое seo, и что для него нужен ssr...

Читать далее

Inertia 2.0: Новые возможности для разработчиков

Уровень сложностиСредний
Время на прочтение4 мин
Количество просмотров6.3K

На конференции Laracon Тэйлор Отвел, создатель популярного PHP-фреймворка Laravel, представил Inertia.js версии 2.0 — самое крупное обновление с момента запуска этого пакета. Новая версия приносит множество полезных функций, которые значительно упростят разработку приложений на Laravel и Inertia.js.

Читать далее

Эффективное использование фикстур в Playwright: полное руководство

Уровень сложностиСредний
Время на прочтение13 мин
Количество просмотров4.1K

Поддержание чистого, эффективного и масштабируемого тестового кода становится всё более сложной задачей по мере увеличения сложности веб-приложений. Playwright, мощный фреймворк для end-to-end тестирования, предлагает решение через свою систему фикстур. Это руководство проведет вас через продвинутые техники использования фикстур в Playwright для создания надёжной и поддерживаемой тестовой архитектуры.

Читать далее

Многопоточность в NextJS: как запустить и нужно ли?

Уровень сложностиСредний
Время на прочтение6 мин
Количество просмотров3.9K

На определённом этапе своей карьеры я задался вопросом: может ли Next.js работать в многопоточном режиме? Оказалось, что нет. Это побудило меня разобраться, как можно организовать многопоточную работу Next.js и насколько это оправдано для сайтов с высокой нагрузкой.

Читать далее

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

Время на прочтение7 мин
Количество просмотров1.2K

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

Читать далее

Что интересного в React 18

Время на прочтение10 мин
Количество просмотров6.2K

Привет! Я Дима, фронтенд-разработчик в Surf. Сегодня рассмотрим самую популярную библиотеку для фронтенда — React. Что было в React18? Давайте узнаем!

Читать дальше

Книга: «Паттерны проектирования JavaScript»

Время на прочтение10 мин
Количество просмотров8.3K
image Привет, Хаброжители!

Раскройте потенциал паттернов проектирования JavaScript. Найдите структурированные решения распространенных задач разработки, пригодные для многократного использования и повышающие масштабируемость, производительность и удобство сопровождения кода. Узнайте, как применение этих паттернов позволяет создавать более чистый и понятный код, способствует организации совместной работы в команде, сокращает количество ошибок и экономит время и силы.Автор дает исчерпывающее представление о паттернах проектирования в современном JavaScript (ES6+) и приводит практические примеры их применения. Сначала вы познакомитесь с порождающими, структурными и поведенческими паттернами проектирования в идиоматическом для JavaScript стиле, а затем переключитесь на архитектурные паттерны и паттерны пользовательского интерфейса. Вы узнаете, как применять паттерны, характерные для таких библиотек, как React, и распространять их на фронтенд и микрофронтенд. В последней части книги представлены и проиллюстрированы паттерны улучшения производительности и безопасности, включая обмен сообщениями, события и стратегии загрузки ресурсов, а также паттерны высокопроизводительных асинхронных вычислений. В издании приводятся примеры использования React и Next.js, а также JavaScript и Web API. Они помогут выбрать и внедрить проверенные паттерны проектирования в различных веб-экосистемах и изменить ваш подход к разработке.
Читать дальше →

Анонс VoidZero — следующее поколение инструментария для JavaScript

Время на прочтение5 мин
Количество просмотров8.8K

Сегодня было анонсировано следующее поколение инструментария для JavaScript от автора Vue и Vite. В рамках начального финансирования было привлечено $4.6 миллиона, при этом основными инвесторами стали Accel и Amplify. В свете этого анонса важно понять контекст, в котором он происходит, и значимость изменений, которые он приносит.

Пятнадцать лет назад JavaScript был в основном языком сценариев для браузеров. Сегодня он стал самым широко используемым языком, применяемым для создания веб-приложений, мобильных приложений, игр и даже Интернета вещей (IoT). Несмотря на развитие множества инструментов для решения все более сложных задач, экосистема JavaScript остаётся фрагментированной, что делает настройку совместной работы зависимостей одной из самых сложных задач. 

Эван Ю вложил значительные усилия в изучение стека инструментов JavaScript и разработку абстракций для упрощения работы разработчиков, что привело к созданию Vite в 2020 году. За четыре года Vite стал одним из ведущих инструментов для веб-разработки, поддерживаемым множеством мета-фреймворков и обладающим более чем 15 миллионами загрузок в неделю. Vite зарекомендовал себя как общий инфраструктурный слой для следующего поколения веб-фреймворков.

Читать далее

Создатель Vue Evan You поднимает $4.6 миллиона на новом проекте

Время на прочтение1 мин
Количество просмотров8.5K

Большая новость, о которой на прошлой неделе намекнул Evan You

Evan создал компанию Voidzero Inc, которая будет делать "an open-source, high-performance, and unified development toolchain for the JavaScript ecosystem" (примерно как сейчас bun или deno только без js движка), и в первом раунде привлек $4.6 млн. за нее (то есть продал инвесторам процентов 10-20 её акций за эту сумму)

Читать далее

Ближайшие события

Связываем форму сайта с Telegram-ботом на чистом JavaScript за 15 минут: Полная разработка и деплой

Время на прочтение15 мин
Количество просмотров16K

Сегодня я подготовил небольшую, расслабляющую статью, особенно в сравнении с предыдущими. Недавно я разрабатывал FullStack-приложение для небольшого лендинга, где одной из задач было привязать форму с сайта к Telegram-боту.

Суть задачи:

Пользователь вводит данные в форму на сайте, после чего эта информация отправляется заказчику через Telegram-бота. Данные отправляются в формате HTML, с полным набором информации. Всё это нужно было реализовать на чистом JavaScript + HTML + CSS. Из этой задачи родилась идея для данной статьи.

Чем мы займёмся?

Мы зарегистрируем Telegram-бота через BotFather, создадим приятную страницу с формой для сбора данных с использованием бесплатного сервиса WebSim.ai, а затем настроим отправку сообщений с формы в Telegram-бота, используя только JavaScript, HTML и CSS.

Читать далее

Что было, что стало: Путешествие в мир 3D-редактора на Three.js

Уровень сложностиСредний
Время на прочтение4 мин
Количество просмотров3.1K

Привет, друзья!
Сегодня я хочу поделиться с вами важной новостью: проект HyperCube Dream подходит к концу своей активной разработки, и я рад представить последнее обновление этого увлекательного инструмента для создания и анимации 3D фигур в браузере. Однако есть и хорошая новость — проект будет доступен в открытом исходном коде! Это значит, что каждый сможет использовать, модифицировать и развивать его, как пожелает.

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

Погрузиться в мир 3D

Система типов и настройки

Уровень сложностиСредний
Время на прочтение2 мин
Количество просмотров1.8K

В заметке рассмотрены несколько настроек ts, которые влияют на систему типов.

А так же особенность языка, которая не вызывает ошибок типизации, но может привести к ошибкам в коде.

Хотите знать больше?

Простой мини-чат на FastApi: Современный интерфейс, вебсокеты и SQLAlchemy с деплоем

Время на прочтение40 мин
Количество просмотров30K

Привет, друзья! Сегодня я подготовил для вас увлекательную практическую статью о создании мини-чата на FastApi. Мы погрузимся в мир вебсокетов, узнаем, зачем они нужны и как применяются в реальных приложениях. Также я продемонстрирую работу с асинхронной SQLAlchemy на примере взаимодействия с базой данных SQLite.

Для создания современного интерфейса мы обратимся к интересному и бесплатному сервису Websim.ai, который за пару минут сгенерирует нам интерфейс, включая страничку для входа/регистрации и страницу самого чата.

Чтобы наш чат мог обслуживать множество пользователей одновременно, мы выполним деплой нашего FastApi приложения. Для этого воспользуемся сервисом Amvera Cloud. Нам нужно будет подготовить файлы приложения, написать код, создать файл с настройками (можно сгенерировать на сайте или скопировать мой код), а затем доставить файлы на сервис. Для доставки можно использовать встроенный терминал или GIT, используя стандартные команды PUSH/PULL.

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

Читать далее

Как я научил бухгалтерию составлять договора дарения со скоростью 1 договор в 4 секунды

Уровень сложностиПростой
Время на прочтение7 мин
Количество просмотров6.1K

В статье разбираю конкретный пример - как при помощи Google Apps Script на основании шаблона, созданного в Гугл Документах массово создавать договора дарения из строк Гугл Таблицы.

Массово создавать типовые договора можно когда есть документ-шаблон с готовым форматированием и в нём промаркированы ключевые поля, которые идут под замену для каждой новой строчки таблицы. После автозамены копия заполненного шаблона сохраняется с установленным именем в виде Гугл Документа и может сразу автоматически преобразована в PDF или файл Microsoft Word.

Автоматизируем это 🤖

Как я создал тренажер для таблицы умножения: опыт разработки, сложности и MidJourney для UI

Время на прочтение4 мин
Количество просмотров3.4K

Пришло время дочке учить таблицу умножения, и я не смог найти нормальных тренажеров. В итоге, пара часов работы над программной частью и день работы над UI/UX вылились в полноценную игру для Яндекс.Игр.

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

Читать далее

Создание гиперкуба с помощью Three.js: как увидеть четвертое измерение?

Уровень сложностиСредний
Время на прочтение4 мин
Количество просмотров9.3K

Каждый раз, когда я сталкиваюсь с чем-то новым в разработке графики, я задаюсь вопросом: «А можно ли сделать что-то круче?» Создавать трёхмерные сцены в браузере — задача увлекательная, но уже привычная. Мы привыкли работать с кубами, сферами и прочими объектами в 3D-пространстве. Но что, если выйти за его пределы? А что, если ввести в игру четвёртое измерение? Именно эта мысль и привела меня к созданию интерактивного гиперкуба с помощью Three.js.

Взглянуть за пределы 3D

Вклад авторов