Впервые за весь свой опыт работы frontend разработчиком я столкнулся с задачей определения города (решение применимо не только для города, но и страны, улицы и т.д.) текущего пользователя и, порыскав в интернете, находил лишь кусочки того, что мне нужно, поэтому, чтобы сэкономить время тех, кто столкнулся с похожей задачей решил опубликовать данную статью.Прежде чем писать код, хотелось бы отметить, что моё решение не претендует на "чистое" и единственно-верное, поэтому если есть более …
Недавно мне посчастливилось развернуть Next.js на сервере с помощью PM2. Этот способ я не нашел в документации фреймворка, хотя считаю его довольно удобным, при этом гайдов по теме оказалось очень мало. Рассказываю, как всё сделать, и привожу рабочие примеры.Заманчивое предложениеВ конце весны в команде появилась задача на разработку веб-приложения с игровыми механиками для одного крупного клиента. К тому моменту давно хотел попробовать Next.js, но руки всё никак не доходили. В этот раз появилс…
Angular, один из самых популярных фреймворков для разработки одностраничных приложений (SPA), постоянно развивается, добавляя новые возможности и улучшая существующие. Одной из таких новых возможностей стали Standalone компоненты, представленные в Angular 14.Что такое Standalone компоненты?Standalone компоненты — это компоненты, которые могут использоваться без необходимости добавления их в модуль. Традиционно, в Angular каждый компонент должен быть объявлен в модуле (например, AppModule), чтоб…
Всем привет! Сегодня мы рассмотрим один из вариантов интеграции svg иконок в наш фронтенд проект используя веб-компоненты. Основная идея компонента заключается в том, чтобы лениво подгружать в SVG спрайт иконки и переиспользовать уже загруженные иконки при необходимости. Сами иконки будем вставлять в разметке в виде <svg-icon name="arrow-angle-down"> нам понадобится всего сотня строк кода! Кому интересна реализация, прошу под кат!Для тех, кому лень читать и хочется сразу посмотрет…
Привет, Хаброжители! TypeScript — популярная надстройка над JavaScript с поддержкой статической типизации, которая наверняка покажется знакомой программистам на C# или Java. TypeScript поможет вам сократить количество ошибок и повысить общее качество кода на JavaScript. «Основы TypeScript» — это полностью обновленное третье издание классического бестселлера Адама Фримена. В нем освещены все возможности TypeScript 5, включая новые, такие как декораторы. Сначала вы узнаете, зачем и почему был …
WordPress Interactivity - это относительно новый API, который позволяет создавать декларативный фронтенд в WordPress нативно. Декларативный? Да, да, он использует тот же принцип, что React и Vue. Только тут под капотом Preact и собственные директивы. И конечно куда же без SSR, который здесь идет из коробки. Звучит интересно? Давайте разбираться вместе.СодержаниеКогда появился и зачем нужен WP Interactivity APIОпределение WordPress Interactivity APIКлючевые аспекты WP Interactivity APISSR в Inte…
Релиз начинается с идеи. Когда в потоке мозгового штурма приходит та самая идея, которая понравится всем пользователям и привлечёт новых клиентов. Идея презентуется команде менеджеров, маркетологов и безоговорочно поддерживается всеми.Прорабатывается ТЗ и задача отдаётся разработчикам. Те ворчат, просят сделать излишнее ТЗ, ставят явно завышенные сроки, но по итогу делают задачу. Задача тестируется и уходит конечным пользователям. На этом жизненный цикл идеи завершён. Теперь остаётся дождаться …
В прошлой части я рассказывал как появилась идея стартапа, как найти потребности пользователей, как спроектировать продуктовые требования. Также я рассказал как сделал проектирование и разработку дизайна. Напомню что я разрабатываю приложение для sass платформы ecwid, платформа позволяет создать интернет-магазин в один клик. Я создаю приложение которое расширяет функционал платформы ecwid и приложение работает за месячную подписку ($11). Приложение делает публикации на страницу Instagram магаз…
ИнтроОдним из недостатков промисов является отмена, точнее ее отсутствие. Соответственно цепочка промисов или асинхронных функций будет выполняться до самого концаasync function getData() { const response = await fetch('/url'); const json = await response.json(); console.log(json.data); }Исключение: промис, который никогда не зарезолвится (к этому мы еще вернемся)const neverResolve = new Promise(resolve => { // resolve(value); }) async function test() { try { await neverRe…