Обновить
256K+

JavaScript *

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

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

Внедрение E2E-тестирования с Puppeteer и Jest

Время на прочтение4 мин
Охват и читатели8.6K

Привет, Хабр!

Хотим поделиться краткой историей о том, как мы на одном из проектов «Рексофт» пришли к написанию автотестов, и почему сделали акцент именно на e2e-тестах.

Читать

Анонс Vite 2.0

Время на прочтение3 мин
Охват и читатели16K

Подумайте о предварительно сконфигурированном dev-сервере + сборщик, но более компактном и быстром. Он использует встроенную в браузер поддержку ES модулей и инструменты, такие как esbuild, для быстрого и современного опыта разработки.

Чтобы понять, насколько быстро работает Vite, вот видео сравнение загрузки приложения React на Repl.it с использованием Vite и create-react-app (CRA):

Читать далее

Шейдеры, Three.js и киберпанк. Как мы делали лендинг в неоново-античной стилистике

Время на прочтение6 мин
Охват и читатели21K

Привет, это блог «Технократии». Обычно мы занимаемся цифровой трансформацией бизнеса, но сегодня у нас для вас история, как при помощи библиотеки three.js и шейдеров мы сделали лендинг для нашей промо-кампании. Главный рассказчик — разработчик Артем Ибатуллин.

Читать далее

Как проходит собеседование Junior фронтенд-разработчика

Время на прочтение8 мин
Охват и читатели85K
Меня зовут Максим Чеченёв, я фронтенд-разработчик уже почти девять лет. Работаю в компании MessageBird в Амстердаме и наставником на курсе «Веб-разработчик» в Яндекс.Практикуме. Ещё я веду канал в телеграме «Сеньор Разработчик».

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


Из чего состоит собеседование


Собеседование фронтенд-разработчика на начальных этапах мало чем отличается от любого другого.

Обычно собеседование можно разбить на три части:

  • знакомство,
  • технические вопросы и/или задание,
  • ваши вопросы.

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

5 подходов к стилизации React-компонентов на примере одного приложения

Время на прочтение4 мин
Охват и читатели22K


Доброго времени суток, друзья!

Сегодня я хочу поговорить с вами о стилизации в React.

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

Когда дело касается разметки (HTML), то React предоставляет в наше распоряжение JSX (JavaScript и XML). JSX позволяет писать разметку в JS-файлах — данную технику можно назвать «HTML-в-JS».

Однако, когда речь идет о стилях, то React не предоставляет каких-либо специальных инструментов (JSC?). Поэтому каждый разработчик волен выбирать такие инструменты по своему вкусу.

Что выбрать: глобальные переменные или useThis?

Время на прочтение4 мин
Охват и читатели9.7K

Привет, Хабр!

Как вы знаете при переходе с компонентов классов на функциональные, у нас отняли такую полезную вещь как this, которая указывает на текущий экземпляр компонента. И конечно у нас возник вопрос: “а где же тогда хранить timeoutId?”. И я видел как люди по разному выкручивались из этой проблемы (Данная статья, является расшифровкой видео)

Read more

Мои рассуждения на тему Как учиться программировать на JavaScript

Время на прочтение8 мин
Охват и читатели22K

Дисклеймер: я ни в коем случае не хочу сказать, что именно так и надо учиться. Но за плечами 13 лет опыта и не один год активности в сообществах, так что рассуждения будут не на пустом месте. Но если вы уже состоялись как программист, скорее всего вам будет не интересна данная публикация.

Если вы новичок в JS, возможно, вам сюда.

Книга «Веб-разработка с применением Node и Express. Полноценное использование стека JavaScript. 2-е издание »

Время на прочтение9 мин
Охват и читатели8.4K
image Привет, Хаброжители! Создавайте динамические веб-приложения с применением Express — ключевого компонента из стека разработки Node/JavaScript. Итан Браун описывает работу с Express 5 на примере создания полноценного приложения. В книге рассматриваются все этапы и компоненты — от серверного рендеринга до разработки API для работы с одностраничными приложениями (SPA). Express является золотой серединой между устоявшимся фреймворком и отсутствием фреймворка вообще, поэтому он оставляет вам определенную свободу при архитектурном выборе. Эта книга предоставит лучшие решения для фронтенд- и бэкенд-разработчиков, использующих Express. Научитесь смотреть на веб-разработку под новым углом! — Создайте систему шаблонизации для отображения динамических данных. — Подробно изучите объекты запроса и отклика, промежуточное ПО и маршрутизацию URL-адресов. — Создайте симуляцию продакшен-среды и выполняйте в ней тестирование. — Научитесь долговременному хранению информации в документных базах данных с помощью MongoDB и в реляционных базах данных — с помощью PostgreSQL. — Открывайте другим программам доступ к вашим ресурсам благодаря API. — Создавайте защищенные приложения с применением аутентификации, авторизации и HTTPS. — Интегрируйтесь с социальными сетями, включайте геолокацию и многое другое. — Внедрите план по запуску и сопровождению вашего приложения. — Освойте критически важные навыки отладки.
Читать дальше →

Дайджест свежих материалов из мира фронтенда за последнюю неделю №454 (8 — 14 февраля 2021)

Время на прочтение3 мин
Охват и читатели9.2K
Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

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

TypeScript: Раскладываем tsconfig по полочкам. Часть 1

Время на прочтение10 мин
Охват и читатели120K

В данной статье я хочу предоставить переработанную и упорядоченную выжимку документации по настройке tsconfig.json, которая, я уверен, будет полезна тем, кто только начинает свой путь в мире TypeScript или тем, кто до этого момента не нашёл времени и сил, чтобы разобраться в деталях и теперь хочет закрыть этот пробел.

Читать далее

Пишем расширение-читалку для Habr

Время на прочтение9 мин
Охват и читатели7.3K

Теперь посты на Habr будут читаться за вас!

В данной статье я хочу показать, как можно совместить утренние сборы на работу с прочтением статей на Habr. Для этого мы напишем простое расширение для браузеров на базе chromium (в частности, Chrome и Opera), которое будет зачитывать для нас вслух открытый во вкладке пост на Habr.

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

Читать далее

Как реализовать drag&drop на чистом JavaScript

Время на прочтение9 мин
Охват и читатели61K

В этом туториале мы рассмотрим, как реализовать эффект drag & drop на ванильном JavaScript. Дословный перевод с английского — «потяни и брось» — отражает суть эффекта, это хорошо знакомое любому пользователю перетаскивание элементов интерфейса. Drag & drop может понадобиться при сортировке карточек в таск-трекере, переносе между списками или вообще при перетаскивании файлов в окно браузера.

Мы разберём drag & drop на примере сортировки. Для этого создадим интерактивный список задач.

Читать далее

Переиспользуемый компонент Svelte: чтобы никому не было больно

Время на прочтение9 мин
Охват и читатели6.9K

Переиспользуемый компонент Svelte: чтобы никому не было больно


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


За последние года полтора для фреймворка Svelte уже создано множество различных компонентов, которые можно найти на NPM, GitHub или официальном списке. К сожалению, не все из них правильно "приготовлены" и порой их использование раздует размер бандла приложения сильнее, чем должно быть. А бывает, что такие пакеты просто невозможно использовать, потому что его автор не силён в подготовке пакетов и упустил какие-то важные моменты.


В этой статье я расскажу как сделать и опубликовать npm-пакет со Svelte-компонентом так, чтобы им смогли воспользоваться все желающие, не получив при этом головной боли от неожиданных проблем.

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

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

Как получилось, что 0,1 + 0,2 = 0,30000000000000004?

Время на прочтение2 мин
Охват и читатели62K

С детства нас учили, что 0,1 + 0,2 равно 0,3. Однако в загадочном мире вычислений все работает по-другому. Недавно я начал писать код на JavaScript и, читая о типах данных, заметил странное поведение 0,1 + 0,2, не равного 0,3.

Читать далее

Как учить рекурсию разработчикам программного обеспечения

Время на прочтение11 мин
Охват и читатели10K

Пришло время переосмыслить обучение рекурсии с помощью реальных кейсов вместо элегантных математических уравнений




Для программистов, особенно программистов-самоучек, первое знакомство с миром «рекурсии» в основном связано с математикой. При упоминании рекурсии программисты сразу вспоминают некоторые из наших любимых слов на F – нет, не те самые слова на F, а:

Фибоначчи

function fibonacci(position) {
 if (position < 3) return 1;
 return fibonacci(position - 1) + fibonacci(position - 2);
}

Факториал

function factorial(num) {
 if (num === 1) return num;
 return num * factorial(num - 1);
}

Приятного чтения!

Перестаньте использовать Page Objects (РО) и начните использовать App Actions

Время на прочтение22 мин
Охват и читатели18K

Написание поддерживаемых сквозных тестов — это сложная задача. Часто тестировщики создают косвенный слой веб-страницы, называемый page objects, для выполнения общих действий. В этой статье я утверждаю, что page objects — это плохая практика, и предлагаю непосредственно обратить внимание на внутренний алгоритм работы приложения. Это отлично работает с современным test runner Cypress.io, который запускает тестовый код непосредственно вместе с кодом приложения.

Читать далее

Моё знакомство с виртуальными ассистентами Салют, а также с платформой SmartMarket и SmartApp

Время на прочтение9 мин
Охват и читатели11K

Знакомство с виртуальными ассистентами Салют, а также с платформой SmartMarket и SmartApp.

Путь от chat app до canvas app или как создать canvas app на платформе SmartMarket.

Читать далее

Пишем ИИ для игры Гомоку (5 в ряд)

Время на прочтение8 мин
Охват и читатели8K

Разрабатывая браузерную игру Гомоку (5 в ряд) на языке JavaScript, я столкнулся с необходимостью реализации компьютерного противника (ИИ). В данной статье кратко описаны основные компоненты ИИ, а также приведено сравнение алгоритмов поиска Negamax, NegaScout и MTD-F.

Основные компоненты ИИ: функция оценки состояния игры, генератор ходов, алгоритм поиска, алгоритм определения победы.

Читать далее

Решение забавной задачки на JavaScript

Время на прочтение9 мин
Охват и читатели18K
Наша история начинается с твита Томаша Лакомы, в котором он предлагает представить, что такой вопрос встретился вам на собеседовании.



Мне кажется, что реакция на такой вопрос на собеседовании зависит от того, в чём конкретно он заключается. Если вопрос действительно в том, каково значение tree, то код можно просто вставить в консоль и получить результат.

Однако если вопрос в том, как бы вы решили эту задачу, то всё становится достаточно любопытным и приводит к проверке знаний тонкостей работы JavaScript и компилятора. В этой статье я попробую разобрать всю эту неразбериху и получить интересные выводы.
Читать дальше →

Сага о типизации и тайпчекинге для JavaScript

Время на прочтение12 мин
Охват и читатели13K

Привет! Хочу поделиться своими мыслями по, казалось бы, простой теме — типизации. В частности, поговорить о тайпчекинге в JavaScript.

Часто люди воспринимают типизацию как эдакую серебряную пулю, которая защищает от всех проблем. Но это не так, часто ожидания от типизации неоправданны, а простота таких инструментов, как TypeScript, обманчива и слишком переоценена.

Это не типичная статья из серии «Изучаем TypeScript», а, как мне кажется, фундаментальная история. Мы начнем с основ, поговорим о данных, о способе их хранения, а затем перейдем к типизации и посмотрим, как она влияет на работу программы.

Читать далее