Обновить
427.47

Веб-разработка *

Делаем веб лучше

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

Не бойтесь бросать свои пет-проекты

Уровень сложностиПростой
Время на прочтение6 мин
Охват и читатели12K


Веб-индустрия переполнена историями о пет-проектах, которые переросли в успешный бизнес. Вот и я нередко увлекаюсь какими-нибудь идеями после основной работы. И хотя это определённо заманчивая перспектива, работа над личным проектом не всегда столь лучезарна – порой они просто не выгорают. Если вы читаете эту статью, то есть вероятность, что вы недавно отказались (или подумываете отказаться) от своего пет-проекта. В таком положении находились многие из нас. Да что тут говорить, заброшенные личные проекты даже стали своего рода мемом в среде разработчиков.

Тем не менее ко мне часто обращаются начинающие программисты за советом, и в последнее время их всё чаще беспокоит то, что у них не получается реализовывать пет-проекты так быстро или так часто, как хотелось бы. И такая тревожность абсолютно понятна. Когда в среде разработки господствует культура сверхактивности и концепция «непрерывной поставки», а на технических собеседованиях кандидатов зачастую оценивают на основе результатов их «внештатного программирования» (имеются в виду хакатоны, клубы программистов и прочее, — прим. пер.), заброшенные пет-проекты перестают казаться чем-то забавным. И мне это не нравится.

Мы слышим столько историй об успешных личных проектах, но что, если более открыто говорить о тех, которые провалились? Многие из нас проводят ретроспективный анализ на работе, но не в отношении пет-проектов. А почему бы нам не пролить свет на всё то время, которое было вложено в начинания, которые так и не ожили? На заброшенное ПО, которое в своё время казалось хорошей идеей. По нашим средам разработки до сих пор скитаются духи захороненных каталогов node_modules.

И здесь я хочу рассказать о своём недавнем пет-проекте, который забросил в тот же день, в который запустил.
Читать дальше →

Мега-Учебник Flask Глава 4: База данных (издание 2024)

Уровень сложностиСредний
Время на прочтение23 мин
Охват и читатели45K

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

Начать изучение

Производительность Istio Ambient Mesh в одном Vs. нескольких неймспейсах Kubernetes

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

Привет, Хабр! Недавно я предложила вам перевод статьи о проблемах, связанных с использованием Service Mesh, и преимуществах Ambient Mesh. Сегодня я хочу привести несколько конкретных чисел в качестве дополнения. Представляю вашему вниманию перевод статьи "Istio Ambient Mesh Performance in Single vs Multiple Kubernetes Namespaces" автора Anupam Saha.

Читать далее

Включаем Telegram Instantview для блога глобально

Уровень сложностиПростой
Время на прочтение5 мин
Охват и читатели10K

Есть одна очень удобная для пользователей штука - Telegram Instantview. Она подгружает контент со ссылки прямо в приложении телеграма, показывая удобную для чтения версию и экономит трафик. Существует два официальных способа включить его для вашего сайта или блога: нерабочий (добавить ваш шаблон для домена, после чего просто ничего не произойдёт) и кривой (формировать уродливые ссылки руками вида t.me/iv?url=...&rhash=... ).

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

Читать далее

REST под сливочным соусом

Уровень сложностиПростой
Время на прочтение17 мин
Охват и читатели3.1K

Representational State Transfer или сокращенно REST – что это такое? В интернете полно статей на разных языках на эту тему. Но многие трактовки понятия REST противоречат друг другу. Как же докопаться до сути?

Простыми словами о сложном

Автоматизируем проверку орфографии: как написать спелл-чекер для сайта с документацией: bash, Python, контейнеры и *nix

Уровень сложностиСредний
Время на прочтение29 мин
Охват и читатели5.3K

У нас во «Фланте» инженеры работают еще и с технической документацией. При этом многие термины, например, относящиеся к Kubernetes, пишут по-разному: кто-то использует сленг, кто-то — латиницу, а кто-то — кириллицу. Чтобы навести порядок в терминологии, а заодно и исправлять опечатки, мы решили создать спелл-чекера и автоматизировать проверку орфографии.

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

Читать далее

Модули ES6: Rollup

Уровень сложностиПростой
Время на прочтение6 мин
Охват и читатели6.2K

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

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

Многие при первой встречи с такими проблемами пытались разделить код на отдельные файлы и подключать через тег <script>. Но такое решение было очень далеко от идеала. Потом были попытки использовать различные библиотеки и инструменты, такие как RequireJS или Browserify, но каждый из них имел свои недостатки и ограничения.

Все изменилось с приходом ES6, который ввел нативную поддержку модулей и один из этих модулей - Rollup. Сегодня мы его и рассмотрим в статье.

Читать далее

Путешествие в yarn

Уровень сложностиСредний
Время на прочтение14 мин
Охват и читатели15K

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

Наши бекендеры решили настроить резервную инфраструктуру на базе ресурсов «Яндекса». Мы, фронтендеры, задумались над альтернативой npm registry — источнику библиотек, фреймворков и других полезных в работе штук.

От нашей изначальной идеи — создания локального registry — мы пришли к yarn 2+. О том, как так получилось, и с чем мы столкнулись на этом тернистом пути, я сегодня и расскажу.

Читать далее

Convex — альтернатива Firebase и Supabase

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

Convex - это платформа для создания бэкенда. В нее входит: Server Functions, ACID Database, Vector Search, Scheduling and crons, File Storage

Все в Convex работает в режиме реального времени. Также написаны удобные интерфейсы для работы с Convex на React

Читать далее

Нативные подписки с роутером Cosmo

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

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

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

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

С роутером, совместимым с Federation V1/V2, который изначально поддерживает подписки, как WunderGraph Cosmo Router, это становится намного проще. Что более важно, с Cosmo вы можете делать это с использованием открытого программного обеспечения, совместимого с OSI, которое позволяет вам самостоятельно размещать и сохранять полную автономию над вашими данными.

Мы рассмотрим, что нового предлагает Cosmo Router в отношении подписок на федеративном GraphQL; но сначала мы расскажем о подписках на GraphQL.

Читать далее

Как мы интегрировались в казахстанский маркетплейс или история о нюансах

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

Привет! Меня зовут Ваня Крючков, я бэкенд-разработчик в Далее. Сегодня поделюсь опытом интеграции интернет-магазина Haier с маркетплейсом Kaspi. Это история о том, как, несмотря на ограничения и не самое удобное API, нам удалось интегрироваться с самым популярным маркетплейсом в Казахстане и увеличить продажи в 3 раза.

На Хабре про Kaspi в целом мало информации, в основном, про финансы и новости. Поэтому мне показалось логичным на своем опыте показать, какие подводные камни могут встретиться на пути к автоматизации продаж на Казахстанском маркетплейсе. 

Читать далее

Почему вам необходим React Query

Уровень сложностиСредний
Время на прочтение7 мин
Охват и читатели23K

Не секрет, что я ❤️ React Query за то, как он упрощает взаимодействие с асинхронным состоянием в приложениях React. И я знаю, что многие коллеги-разработчики согласятся с этим.

Однако иногда я встречаю сообщения, в которых утверждается, что он вам не нужен для чего-то столь «простого», как получение данных с сервера.

Читать далее

Неизвестно полезный CSS. Часть 2

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


Привет, Хабр. Я продолжаю рассказывать про неизвестные широкому кругу разработчиков CSS-фишки. Я отбираю их так, чтобы они были полезны в разного рода проектах. Неважно, верстаете ли вы сайт для малого бизнеса или создаёте супермодное React-приложение. Они поддерживаются большинством браузеров. Отдельно отмечу, что я не считаю IE11 современным браузером. По этой причине я не учитывал его.


Сегодня мы рассмотрим:

  • загрузку фоновых изображений для экранов с повышенной плотностью пикселя с помощью функции image-set();
  • как с помощью неё же ускорить загрузку страницы;
  • можно ли использовать нестандартный шрифт без его загрузки;
  • чем полезен псевдокласс :focus-within при вёрстке кастомных чекбоксов;
  • мой любимый лайфхак на основе пользовательских CSS-свойств.

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

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

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

Rolldown — новый сборщик на основе Rollup

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

Rollup - это лучший и наиболее полный сборщик на сегодняшний день. Он опередил свое время, став первопроходцем в таких ключевых концепциях, как tree shaking, и до сих пор ему нет равных в этом отношении. Когда Эван Ю представил Vite - Rollup был краеугольным камнем процесса сборки. Плагины Vite - это (по большей части) плагины Rollup.

Читать далее

Введение в Router Cosmo — потрясающе быстрый шлюз с открытым исходным кодом Federation V1/V2

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

Предприятия имеют разнообразные зависимости от данных — внутренние микросервисы со специализированными доменами данных, устаревшие системы с собственными форматами данных, а также сторонние API и приложения SaaS со своими уникальными моделями данных и конечными точками.

TL;DR: разные (и часто устаревшие) технологии, которые нужно как-то объединить.

Federated GraphQL выделился как главное решение для такого объединения в сфере предприятий, и Router (или Gateway) в Federation действует как ключевой элемент, который связывает все эти разрозненные источники данных вместе, делая их доступными через единственный, согласованный API, сохраняя при этом адаптивность. Это, на самом деле, ключ к тому, как Federated GraphQL позволяет создавать масштабируемые и модульные архитектуры.

Сегодня мы рассмотрим высокопроизводительный, открытый, совместимый с Federation V1/V2 Router от WunderGraph Cosmo. Мы расскажем, что он делает, почему он так важен для стека Cosmo, как вы можете разместить его самостоятельно, а также настроить и расширить его с помощью своего собственного кода на Go.

Читать далее

UI. Нюансы реализации маркера в редакторе блок-схем DGRM.net

Уровень сложностиПростой
Время на прочтение2 мин
Охват и читатели1.1K

Редактор схем DGRM.net

Задача маркера - комментирование скриншотов.

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

Читать далее

Как развернуть сайт c помощью Terraform

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


Привет, Хабр! В этой инструкции я покажу, как развернуть сайт в Kubernetes c помощью Terraform. Разберу интеграцию CRaaS с Managed Kubernetes, которая сократит ручную настройку и поможет публиковать образы контейнеров всего в несколько кликов.

Дисклеймер: мы не будем c нуля разбирать особенности работы с Terraform. Если вы не работали с этим инструментом, изучите сначала материал «Как развернуть свое приложение в Kubernetes».
Читать дальше →

Open Source GraphQL CDN / Edge Cache с Cloudflare, Fastly и Fly.io

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

Мы недавно объявили, что WunderGraph теперь полностью открыт в исходном коде. Сегодня мы хотели бы объяснить, как вы можете использовать нашу платформу для разработчиков API, чтобы добавить кэширование на уровне Edge в ваши GraphQL API, не привязывая себя к конкретному поставщику.

Читать далее

Мега-Учебник Flask Глава 3: Веб-формы (издание 2024)

Уровень сложностиСредний
Время на прочтение16 мин
Охват и читатели37K

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

Начать изучение

Как сделать из императивного компонента — декларативный React-компонент

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

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

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

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

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

Вперёд, какие там шаги?

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