Web-разработка

Не стоит частить с if в JavaScript

Мне нравится воспринимать логику построения условий как хлеб и масло в среде разработки софта. Она позволяет разработчикам создавать интересные, полезные и веселые продукты. Самый распространенный...

Индексация строк в Rust и TypeScript в сравнениях

Сравнительный анализ обработки строк в Rust и TypeScript. Примеры и пища для размышлений гарантированы!

Раскройте возможности генераторов PHP

Как в PHP с версии 5.5 устраняется ошибка нехватки памяти? Пошагово рассмотрим применение генераторов, обратную отправку данных и возвращение значений. Приведем примеры практического использования.

7 моих любимых расширений VS Code

Расширения для VS Code Я, как и многие другие, люблю настраивать VS Code под себя. Я постоянно ищу новые плагины, настройки, темы, шрифты и рекомендации по...

7 инструментов для создания дизайн-систем в 2020 году

Легенда гласит, что первая дизайн-система была представлена НАСА в 1976 году. С тех пор дизайн-системы превратились в широко распространенную практику, используемую для стандартизации проектирования...

PHP: строки

Строки представляют собой последовательности символов, например "PHP supports string operations". Строки с одинарными кавычками обрабатываются почти буквально. Строки с двойными кавычками заменяют переменные на их значения, а также особым образом интерпретируют определенные последовательности символов.

Как улучшить работу с кодом на TypeScript с VSCode

Представьте, что вы бы использовали строго типизированный язык типа JAVA с такой мощной IDE (интегрированной средой разработки), как Eclipse, а затем попробовали бы JavaScript....

Установка Next.js с использованием клиентского сервера Express и TypeScript

В этом посте я проведу вас по пути создания приложения Next.js, обслуживаемого клиентским сервером Express c применением фреймворка Typescript. Полную версию проекта можно увидеть...

Чего я не знал о CSS, а стоило бы

Делать сайты я учился по-старомодному: открывал исходный код и пытался повторить то, что видел. А по тому, чего не видел (PHP/MySQL), прочёл какую-то случайно...

Как создать веб-приложение для преобразования речи в текст с Node.js

Предлагаем создать веб-приложение, которое преобразует аудиозаписи на разных языках в текст. Задача предполагает работу с моделью Whisper от OpenAI.

Применение пустого пространства в UI-дизайне

Хороший UI-дизайн — это продуманное применение пустого пространства во всех масштабах интерфейса: от элемента до страницы. Если пустое пространство правильно использовано, в результате получается...

Полное руководство по кэшированию Laravel

На примерах изучим cache:remember, самый применяемый в проектах метод кэша. Узнаем, как эффективно кэшировать данные, оптимизируя производительность и пользовательское взаимодействие, снижая нагрузку на базу данных и убыстряя отклик.

Как интегрировать уведомления в реальном времени с Laravel и Pusher

Добавим мгновенные обновления и интерактивный функционал в приложение Laravel. Следуя пошаговым инструкциям, настроим уведомления.

Репозитории GitHub в помощь каждому веб-разработчику

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

Завершаем настройку мощного API на Nodejs, GraphQL, MongoDB, Hapi, и Swagger. Часть 2

Это вторая часть в серии, где мы строим мощный API GraphQL. Пожалуйста, посмотрите первую часть нашей статьи,если вы до сих пор этого не сделали. Я знаю,...

Как очистить код с помощью SASS

Итак, давайте знакомиться с SASS SASS (Syntactically Awesome StyleSheets — Синтаксически потрясающие таблицы стилей) является препроцессорным скрипт-языком, код которого компилируется в CSS, чтобы быть понятым браузерам. У SASS...

UI/UX дизайн прайс-листа и таблицы тарифных планов

10 лучших советов по оформлению тарифной сетки: согласованность цен с характеристиками, легкость визуального сканирования и другие практики.

Избавляемся от рендеринга в Angular: только функциональность и никакого рендера

Я ежедневно работаю как с Angular, так и с React, а также большой поклонник Vue и Svelte и слежу за их развитием. В этой...

Да не нужен вам фреймворк JavaScript!

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

Псевдоклассы CSS, на которые стоит обратить внимание

Согласно определению из "CSS: The Definitive Guide" Эрика Майера (Eric Meyer) и Эстеля Вейля (Estelle Weyl): С помощью (псевдо) селекторов можно назначать стили так называемым...

Движки JavaScript. Часть 1: парсинг

Что такое интерпретация и компиляция? Какие инструменты для этого используются? Как происходит парсинг на движках JavaScript? Обо всем этом поговорим в сегодняшнем материале.

5 важных моментов из JavaScript, которые помогут избегать ошибок

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

Как работает маршрутизация Express

Как в приложении Node.js происходит обработка клиентских запросов? Какая функция помогает обрабатывать тот или иной запрос? Чтобы ответить на эти вопросы, заглянем в "закулисье" маршрутизации фреймворка Express.

9 убийственных приемов для JavaScript разработчиков в 2019 году

Пролетел еще один год, а JavaScript все продолжает меняться. Однако есть несколько советов по написанию чистого и эффективного кода, который будет масштабироваться даже (а...

Kubernetes: безопасное управление секретами с GitOps

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

Web Speech API в JavaScript: от текста к речи

Практическое руководство по работе с Web Speech API в JavaScript. Рассказываем, как создать веб-страницу, реализующую преобразование текста в речь.

22 CSS-свойства для позиционирования

В статье пойдет речь о нескольких редко упоминаемых в технической литературе свойствах CSS. Тем не менее их использование повлечет за собой повышение скорости и...

Будьте благодарны за массивы JavaScript: сравнение с языком C

Изучение того, как массивы и простые методы типа .push() работают в языках более низкого уровня, может значительно углубить понимание JavaScript и вызвать признательность за его чудо-массивы.

Темная сторона Javascript: избегайте данных трех функций

Оператор Void Вы, вероятно, уже сталкивались с этим оператором. Раньше при наличии ссылки, запускающей функцию JavaScript, нужно было добавлять href=”javascript:void(0)”, чтобы действие по умолчанию не...

Самый уродливый шаблон React

Как обновлять состояние при изменении свойства? Что предпочтительнее: рекомендованный шаблон из новой документации или хуки?

Супергеройский макет: комбинируем CSS-сетки и CSS-фигуры

Создадим нестандартный макет на основе страницы комикса, используя свойство clip-path для наложения изображений и придания им нужных форм.

Почему в React важен порядок вызова хуков?

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

3 чудо-приема JavaScript для ускорения разработки

Обзор трех эффективных приемов для JavaScript: создание асинхронного контекста, работа с именованными параметрами и обертывание блоков try/catch.

Топ-10 библиотек React для создания высокопроизводительных веб-приложений в 2023 году

Не все решения React предоставляются в готовом виде "из коробки". Поэтому приходится обращаться к дополнительным инструментам. Чтобы не тратить время на поиски подходящего фреймворка, воспользуйтесь обзором лучших библиотек React, помогающих эффективно решать различные проблемы.

Как настроить Next.js на TypeScript, чтобы получить оценку в 100% от Google Lighthouse и...

Создаем прогрессивное веб-приложение с помощью Next.js и пытаемся достичь 100-процентной оценки от Google Lighthouse и Vercel Analytics. Проходим весь путь оптимизации проекта Next.js, который будет написан на TypeScript.

Структура типизации в Ruby 3

Об авторе: Соутаро является ведущим разработчиком Ruby в Square, работающим над Steep и статической типизацией; вместе с Матцем и другими разработчиками ядра он работает...

Почему не стоит использовать localStorage

Все еще используете localStorage? Тогда ознакомьтесь с IndexedDB - разумной альтернативой localStorage. IndexedDB - оптимальный инструмент для постоянного хранения данных - облегчит вам жизнь, особенно при использовании библиотеки-обертки.

Асинхронный JavaScript ― Цикл обработки событий

В этой статье вы узнаете, как работает асинхронность в JavaScript JavaScript — однопоточный язык программирования. Движок JS единовременно может обрабатывать только одно выражение — в одном потоке. С одной стороны,...

React SPA SEO с Prerender.io

Как правильно настроить SEO для JavaScript-приложения? Рассказываем про Server Side Rendering, Client Side Rendering, Dynamic Rendering и Prerender.io.

PHP: типы циклов

Циклы в PHP используются для выполнения одного и того же блока кода определенное количество раз. Рассмотрим 4 типа циклов: for, while, do…while, foreach.

Полезные JavaScript-модули, на которые стоит обратить внимание

Эта статья представляет собой подборку наиболее полезных модулей и утилит для серверной и клиентской разработки на NodeJS и JavaScript, которые использует в своей работе...

Relay для Angular

Всем привет! Сегодня я представлю вашему вниманию relay-angular, молодую инновационную библиотеку, которая доказала свою стабильность в процессе создания библиотек react-relay-offline и relay-hooks. Признаюсь, что не...

Практичные Canary-релизы в Kubernetes с Argo Rollouts

Основанная на микросервисах инфраструктура Soluto, совмещенная со всеми инструментами CI/CD, позволяет осуществлять по несколько релизов в день, предоставляя пользователям новые возможности и внося исправления. При...

Оптимизация размера Angular bundle за 4 шага

Вам доводилось получать жалобы на слишком медленную загрузку веб-приложения или получать задачу “оптимизировать производительность” медленного приложения? Множество тем посвящено производительности приложений: отложенная загрузка, отслеживание...

8 репозиториев, которые используют продвинутые React-разработчики

Хотите узнать, какие репозитории пользуются популярностью у продвинутых IT-специалистов? В этом списке собраны лучшие платформы, к которым регулярно обращаются профессиональные программисты.

7 полезных методов объектов JavaScript

Предлагаем список важнейших методов объектов, которыми необходимо владеть при программировании на JavaScript. Эти методы значительно облегчат вашу работу с объектами.

Ускоренный запуск системы “Аутентификации + база данных” (React.js и Firebase)

Настройка интегрированной системы аутентификации и базы данных отнимает много времени у разработчиков полного цикла. Предлагаем руководство по ускоренному (и бесплатному) запуску системы React.js и Firebase (хотя оно подойдет и для разработки Next.js-приложений).

Веб-скрапинг с помощью Node.js — Часть 2

Предыдущие части: Часть 1 В предыдущей статье я рассказывал о том, как извлекать статические данные с помощью Node.js. В настоящее время сайты приобретают более динамический характер,...

Как получить все неуникальные значения в массиве JavaScript?

Иногда бывает нужно получить все повторяющиеся значения из массива JavaScript. В этой статье мы рассмотрим способы получения всех неуникальных значений в массиве JavaScript. Array.prototype.filter Один из таких...

Первые шаги в JavaScript: создание калькулятора

Начинаете осваивать JavaScript? Создание простого калькулятора позволит вам оценить его возможности. Вы получите базовое представление о синтаксисе JavaScript и о том, как использовать его для создания интерактивных веб-приложений.

React Single Page Application и React-Router для начинающих

Ваше первое React SPA с нуля: всё, что нужно знать про хуки UseParams, UseLocation и UseHistory, про маршрутизацию и панель навигации

Топ-10 бэкенд-фреймворков для веб-разработки в 2022 году

Предлагаем познакомиться с лучшими бэкенд-фреймворками для веб-разработки на Java, Ruby, Python, JavaScript, PHP, Scala и Golang на 2022 год.

Эта информация навсегда изменит ваше отношение к коду JavaScript

К концу этой статьи вы превратитесь из простого пользователя JavaScript в того, кто глубоко его понимает и кого не удивляют его уникальные возможности. Это открытие расширит ваши знания и навыки, а также позволит использовать такие "фишки" JS, которых нет в других популярных языках.

Проблема устаревших замыканий и способы ее решения в React. Часть 2

В этой части руководства вы узнаете, как не угодить в ловушку устаревших замыканий в распространенных скриптах React, таких как useCallback, React.memo, Ref.

Добавление личного домена в AWS WebSocket

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

Развертывание Flask приложения на Heroku и подключение к БД MySQL - JawsDB

Проблемы развертывания Новички часто устанавливают все пакеты на системном уровне из-за отсутствия опыта (например, с помощью pip). Получение зависимостей из requirements.txt для каждого проекта создаёт...

Веб-скрапинг для веб-разработчиков: краткие сведения

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

Реализация React Query в веб-приложении

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

Движки JavaScript. Часть 2: генерация кода и базовые оптимизации

В этой части продолжим разговор о том, как работают движки JavaScript. Поговорим о компиляторах, этапах создания кода и основных оптимизациях.

Перевод любого приложения Vue.js за час

Инструкция по полной автоматизации процесса перевода приложений на любое количество языков с помощью vue-i18n. Настраиваем инструменты, организуем их взаимодействие и получаем возможность мгновенного перевода через Google Translate.

ТОП 5 советов, как улучшить свои UI навыки

Однажды у меня произошел нервный срыв из-за моих UI знаний. В то время я работал над множеством проектов — в основном над стартапами. Я...

Микросервисы gRPC в NestJS: пошаговое руководство

Протокол gRPC (Remote Procedure Call) обеспечивает эффективное взаимодействие между микросервисами, способствуя повышению производительности и масштабируемости приложений NestJS. Рассмотрим возможности gRPC при обмене сообщениями между микросервисами, написанными на NestJS.

Поэтапное создание рабочей контактной формы в Next.js

Учимся создавать контактную форму для эффективного взаимодействия с пользователями. В этом важном деле нам помогут API-маршруты Next.js и API SendGrid.

Var, let и const в JavaScript

Пока я разбирался что к чему в основах JavaScript, я наткнулся на три способа объявления переменных, а именно var, let и const. В данной...

Почему я больше не пользуюсь D3.js

Когда я работаю над проектами с визуализацией, мои менеджеры обычно ужасаются, когда я говорю, что не использую D3. Почему они так переживают? Почему я...

Продвинутые техники PHP: от шаблонов проектирования до тестирования. Часть 1

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

Что значит быть креативным дизайнером

На главных страницах таких сайтов, как Dribbble или Behance, красуются яркие, уникальные и прекрасно выполненные работы. Несмотря на то, что эти сайты рекламируют себя...

Советы по созданию хорошего дизайна API

Систематизируем некоторые общие правила дизайна API в современную эпоху, которые избавят от базовых "подводных камней" при их разработке.

Как работает проверка доступности API в Swift

Мы постоянно применяем проверки на доступность API, чтобы обеспечить откаты ПО для пользователей, использующих старые версии iOS. А задавались ли вы вопросом, как эту...

Станут ли прогрессивные веб-приложения заменой нативным?

Когда Стив Джобс представил самый первый iPhone в 2007 году, он также высказал идею о том, что разработчики смогут создавать приложения для iPhone лишь...

Как создать простой API с помощью Express и MongoDB

Создадим API с помощью Express, а для хранения данных будем использовать MongoDB. Чтобы следовать руководству, рекомендуется иметь базовые знания о JavaScript, MongoDB и Node.JS.

Продвинутые React Hooks: подробный разбор useEffect

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

3 способа клонирования объектов в JavaScript

Поскольку объекты в #JavaScript являются ссылочными значениями, их нельзя просто скопировать с помощью =. Но не беспокойтесь, существует 3 способа клонирования объекта ?. const food...

Безопасность Node.js в продакшене: экспертные рекомендации для разработчиков

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

REST API CRUD в Laravel 11 с лучшими практиками

Поэтапно создадим приложение: модель с миграцией, интерфейс, классы и ресурс. Привяжем интерфейс к реализации, проверим запросы, подготовим репозиторий, файл с маршрутами Api и запустим проект.

Как реализуется пользовательское взаимодействие на страницах JavaScript?

Рассмотрим процесс регистрации на интернет-странице изнутри: что происходит при нажатии на кнопку регистрации, появлении формы, ее заполнении и отправке пользователем, а также при перенаправлении на страницу авторизации и получении полного доступа к странице. Узнаем, куда поступает эта информация и как страница распознает пользователя, когда он снова на нее заходит.

25 полезных сокращений в JavaScript для веб-разработчиков

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

Динамические заголовки страницы в Angular

Angular — это MVC-фреймворк для создания одностраничных приложений в Javascript. В этой статье мы узнаем, как установить заголовок браузера (страницы/документа) для всего приложения и как изменить заголовок...

Современный подход к разработке с использованием Next.js

Мощные современные инструменты Bit и Ripple CI внесли кардинальные улучшения в подход к разработке на Next.js. Они представляют современный и эффективный процесс создания композитных приложений. Рассмотрим подробнее преимущества Bit и Ripple CI и возможности их интеграции в Next.js.

5 способов уменьшения размера пакетов JavaScript

Громоздкие пакеты мешают продуктивности приложения? Решение есть. Сегодня вы узнаете 5 методов оптимизации приложения путем уменьшения размера пакетов JavaScript.

Где (и почему) следует использовать стрелочные функции ES6, а где не следует

Стрелочные функции (или «толстые стрелочные функции»), без сомнения, одна из самых популярных фич ES6. Это новый способ краткой записи функций. Так, выглядит синтаксис функции с...

12 генераторов CSS для работы в 2023 году

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

Избегайте 5 антипаттернов, работая с коллекциями в JavaScript

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

Загрузка файлов в хранилище Cloudflare R2: простое руководство

Разберемся с процессом загрузки файлов Go в Cloudflare R2. Пройдем его поэтапно, снабжая фрагменты кода пояснениями, весь код - в конце.

Создание пользовательских хуков React: полное руководство

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

Эмпирический анализ схем GraphQL. Часть 2

Часть 1, Часть 2 Напомним, что в части 1 мы дали немного вводной информации о языке запросов GraphQL, о преимуществах GraphQL API в сравнении с...

Основные различия между Flexbox и CSS Grid

Главное отличие Flexbox от CSS Grid определяется размерностью. По сути, Flexbox создавался для одноразмерных макетов, а CSS Grid можно было применять к двухмерным макетам....

Как масштабировать Angular без ограничений

Ограничения мешают успешному развитию продукта. Освободите свой разум от тормозящих стереотипов и приступайте к масштабированию проектов на Angular!

Мы забываем основы фронтенд-разработки

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

Введение в WebAssembly (WASM)

Хотите разрабатывать высокопроизводительные веб-приложения, выполняющие обработку видео, 3D-рендеринг, мультимедийные игры и криптографические вычисления? WebAssembly поможет легко справиться с этой задачей.

Библиотека Ethers.js: новичкам на заметку

Познакомимся с библиотекой ethers.js и узнаем, как именно она обеспечивает взаимодействие с виртуальной машиной Ethereum в Remix.

Как развернуть React-приложение в Netlify

Я научу вас развертке и хостингу React приложения с Netlify.Netlify — это сервис для автоматизации сборки, развертывания и управления сайтами. В настоящее время Netlify считается одним...

Основные принципы темного UI-дизайна

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

Сайты с модальными диалоговыми окнами без JavaScript

Сайты, которые используют JavaScript для большей части таких элементов, как модальные диалоговые окна, выпадающее меню, мобильные меню-«гамбургеры», зачастую демонстрируют полный провал в плане удобства...

Состояние микрофронтендов

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

10 трендов UI-дизайна в 2021 году

2020 год уже позади. Пора узнать, что готовит нам текущий. Вот небольшой гайд по трендам UI-дизайна этого года. 1. 3D-изображения 3D-изображения все еще актуальны. Особенно сейчас,...

Эти JavaScript-методы всего за несколько минут прокачают ваши навыки

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

JavaScript Essentials: Типы и структура данных

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

15 часто используемых методов массивов JavaScript

Массивы используются практически в каждом приложении, однако методы некоторых из них довольно запутаны. Эти 15 методов массивов стоит освоить, поскольку они часто применяются на практике.

Использование вебсокетов в промис-стиле

Уже не единожды на просторах интернетов обсуждались плюсы вебсокетов над xmlhttprequest(ajax) запросами. Из них основные — это скорость доставки(т.к. соединение всегда открыто) и экономия ресурсов (т.к....

1...789...12 Страница 8 из 12

Как избежать повторных обновлений представлений SwiftUI

Рассмотрим методы оптимизации: 1) применение оберток свойств с соответствием протоколу «DynamicProperty»; 2) стратегия сравнения экземпляров типов представлений, выбор параметров построения; 3) замыкания. Освоим заложенные в этих методах принципы, сформулируем рекомендации.

Все что касается web-разработки: Front end, Back end, Full stack; HTML, CSS, JavaScript, фреймворки, технологии, безопасность и многое другое!