zhub.link is one of the many independent Mastodon servers you can use to participate in the fediverse.

Administered by:

Server stats:

28
active users

#nextjs

1 post1 participant0 posts today

Разворачиваем микрофронты на Next.js

Привет, Хабр! Меня зовут Дэниз, в этой статье я расскажу о микрофронтах — что это такое, какие у них плюсы и минусы, и как их можно реализовать. Пройдемся от того, зачем моей компании они понадобились, разберем реализацию, плюсы-минусы, и сделаем выводы.

habr.com/ru/articles/889202/

ХабрРазворачиваем микрофронты на Next.jsПривет, Хабр! Меня зовут Дэниз, я фронтенд-разработчик в крупнейшем телеком-операторе Казахстана. Сегодня расскажу о микрофронтах — что это такое, какие у них плюсы и минусы, и как их можно...

Инструменты для анализа производительности сайта

В этой статье речь пойдет об инструментах, с помощью которых можно проанализировать качество спроектированного front-end разработчиком сайта. В качестве наглядного материала используется проект, реализованный на базе Next.js 14-й версии с app router.

habr.com/ru/articles/888008/

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

Next.js 15 в Hikasami: Глубокая оптимизация рендеринга, загрузки данных и производительности

В эпоху цифрового контента каждая миллисекунда загрузки страницы может существенно повлиять на пользовательский опыт. В Hikasami, платформе, предоставляющей потоковое аниме и азиатские медиа для пользователей СНГ, наша цель — обеспечить мгновенную загрузку страниц, минимизировать задержки, а также гарантировать актуальность данных. Для этого мы внедрили Next.js 15 , который открыл перед нами возможности глубокой оптимизации:

habr.com/ru/companies/hikasami

ХабрNext.js 15 в Hikasami: Глубокая оптимизация рендеринга, загрузки данных и производительностиВведение В эпоху цифрового контента каждая миллисекунда загрузки страницы может существенно повлиять на пользовательский опыт. В Hikasami, платформе, предоставляющей потоковое аниме и...

I've added a new card to the landing page of flathub.org yesterday, focused on games.

We have been trying to do this for quiet some time and I know that the results (as in what is in which category) are not perfect, but putting this out there hopefully helps us move things.

Как из каши импортов сделать сортированный список Frontend

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

habr.com/ru/articles/878638/

ХабрКак из каши импортов сделать сортированный список FrontendВсем привет! Меня зовут Владимир и работаю джуниор фронтенд разработчиком в одной из лучших компаний:) Сегодня хочу вам рассказать, как можно немного причесать ваш проект чтобы он выглядел более...

Как из каши импортов сделать сортированный список Frontend

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

habr.com/ru/articles/878636/

ХабрКак из каши импортов сделать сортированный список FrontendВсем привет! Меня зовут Владимир и работаю джуниор фронтенд разработчиком в одной из лучших компаний:) Сегодня хочу вам рассказать, как можно немного причесать ваш проект чтобы он выглядел более...

Архитектура для средненагруженных приложений: делюсь опытом и ищу ваши советы

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

habr.com/ru/articles/874414/

ХабрАрхитектура для средненагруженных приложений: делюсь опытом и ищу ваши советыПривет, коллеги! Меня зовут Санжар, я бэкенд-разработчик с опытом в настройке серверной инфраструктуры и контейнеризации для средних проектов. Сегодня хочу поделиться схемой архитектуры, которую я...

Исследование: победители awwwards и их performance в Lighthouse

Все дизайнеры обожают сайт awwwards – площадку с платной публикацией, где собраны самые классные работы в сфере веб-дизайна. А поскольку мы душнилы по части performance, мы собрали почти 5000 сайтов, определили их фреймворк и проверили производительность в Lighthouse. Также собрали статистику по их авторам. И вот что получилось.

habr.com/ru/articles/874094/

ХабрИсследование: победители awwwards и их performance в LighthouseВсе дизайнеры обожают сайт awwwards – площадку с платной публикацией, где собраны самые классные работы в сфере веб-дизайна. А поскольку мы душнилы по части performance, мы собрали почти 5000 сайтов,...

Локализуем React (NextJS, TypeScript) сайт на несколько языков с помощью i18next

У меня появилась задача в проекте: перевести личный кабинет пользователя на русский и английский языки (в перспективе и на другие языки). При этом, определять язык пользователя при первом заходе в ЛК и запоминать язык при перезагрузке страницы. Разумеется, всё это с типизацией файлов с переводами (чтобы нельзя было забыть добавить любое из полей). Как я это делал — расскажу в статье.

habr.com/ru/articles/873984/

ХабрЛокализуем React (NextJS, TypeScript) сайт на несколько языков с помощью i18nextУ меня появилась задача в проекте: Перевести личный кабинет пользователя на русский и английский (в перспективе и на другие языки). При этом, определять язык пользователя при первом заходе в ЛК и...
#react#nextjs#i18n

Руководство по Convex. Часть 3

Привет, друзья! В этой серии статей я рассказываю о Convex — новом открытом и бесплатном решении BaaS (Backend as a Service — бэкенд как услуга), которое выглядит очень многообещающе и быстро набирает популярность среди разработчиков. На сегодняшний день Convex предоставляет реактивную базу данных смешанного типа, механизм аутентификации/авторизации, файловое хранилище, планировщик задач и средство интеллектуального поиска. Эта третья и завершающая часть серии, в которой мы поговорим о планировании задач, хранилище файлов и поиске. В конце мы также рассмотрим расширенный пример использования Convex для разработки полноценного веб-приложения. Первая часть Вторая часть

habr.com/ru/companies/timeweb/

ХабрРуководство по Convex. Часть 3Привет, друзья! В этой серии статей я рассказываю о Convex — новом открытом и бесплатном решении BaaS (Backend as a Service — бэкенд как услуга), которое выглядит очень многообещающе и быстро набирает...

Как я разрабатываю конвертер в 2024 (Frontend часть)

Всем привет! Меня зовут Руслан и я fullstack разработчик, я работаю над заказами и разрабатываю свои digital продукты. На данный момент я разрабатываю конвертер файлов, например картинок, png в webp, jpg в png и так далее. Итак, я решил поделиться этапами своей разработки, рассказать о своем опыте и показать, как шаг за шагом создаются собственные продукты. Именно в данной статье я буду писать только про frontend часть, так как, к разработке бэкенда еще не приступил.

habr.com/ru/articles/869474/

ХабрКак я разрабатываю конвертер в 2024 (Frontend часть)Всем привет! Меня зовут Руслан и я fullstack разработчик, я работаю над заказами и разрабатываю свои digital продукты. На данный момент я разрабатываю конвертер файлов, например картинок, png в webp,...

Как устроен Next.js: разбираем ключевые особенности фреймворка на примере небольшого pet-проекта

На майской конференции React Conf 2024 команда React не только презентовала версию библиотеки React 19, но и рекомендовала использовать для старта новых JavaScript-проектов один из четырех фреймворков: Next.js, Remix, RedwoodJs или Expo. Позже аналогичная рекомендация появилась в официальной документации по React. Из этих фреймворков Next.js может похвастаться самым большим комьюнити, документацией и удобством. Если вы до сих пор его не освоили, то мы идем к вам! Привет, Хабр! В этой статье расскажем, что такое Next.js, и покажем вам на примере небольшого pet-проекта его базовые возможности.

habr.com/ru/companies/ibs/arti

ХабрКак устроен Next.js: разбираем ключевые особенности фреймворка на примере небольшого pet-проектаНа майской конференции React Conf 2024 команда React не только презентовала версию библиотеки React 19, но и рекомендовала использовать для старта новых JavaScript-проектов один из четырех...

Руководство по Convex. Часть 2

Привет, друзья! В этой серии статей я рассказываю о Convex — новом открытом и бесплатном решении BaaS (Backend as a Service — бэкенд как услуга), которое выглядит очень многообещающе и быстро набирает популярность среди разработчиков. На сегодняшний день Convex предоставляет реактивную базу данных смешанного типа, механизм аутентификации/авторизации, файловое хранилище, планировщик задач и инструменты интеллектуального поиска. Эта вторая часть серии, в которой мы поговорим об аутентификации и авторизации. Первая часть

habr.com/ru/companies/timeweb/

ХабрРуководство по Convex. Часть 2Привет, друзья! В этой серии статей я рассказываю о Convex — новом открытом и бесплатном решении BaaS (Backend as a Service — бэкенд как услуга), которое выглядит очень многообещающе и быстро набирает...

Разворачиваем приложение Next.js с базой данных PostgreSQL и задачей Cron на облачном сервере Ubuntu Linux

Привет, друзья! Предположим, что у нас есть приложение Next.js , данные которого хранятся в Postgres , и мы хотим запустить его в продакшн, но не хотим использовать готовую инфраструктуру Vercel . Что делать? Создать собственную инфраструктуру. К счастью, сделать это не так уж и сложно. Основные элементы нашей системы: приложение, демонстрирующее несколько мощных возможностей Next.js 15 база данных Postgres для хранения списка задач, создаваемых/удаляемых в приложении задача Cron для удаления из БД всех задач каждые 10 мин приложение, БД и задача Cron функционируют в контейнерах Docker контейнеры запускаются с помощью Docker Compose на облачном сервере Ubuntu сервер Nginx для перенаправления запросов HTTP (обратного проксирования) домен, привязанный к серверу Certbot для получения сертификата SSL из Let's Encrypt и его установки для домена Демо приложения. Интересно? Тогда прошу под кат.

habr.com/ru/companies/timeweb/

ХабрРазворачиваем приложение Next.js с базой данных PostgreSQL и задачей Cron на облачном сервере Ubuntu LinuxПривет, друзья! Предположим, что у нас есть приложение Next.js , данные которого хранятся в Postgres , и мы хотим запустить его в продакшн, но не хотим использовать готовую инфраструктуру Vercel . Что...

Как сделать интерактивную панель для отправки SMS

Сегодня разработаем панель, через которую сможем отправлять SMS сразу нескольким адресатам, получать их ответы и видеть статистику по отправленным сообщениям через календарь и график. Будем использовать Next.js, Shadcn для интерфейса и

habr.com/ru/companies/exolve/a

/ui

ХабрКак сделать интерактивную панель для отправки SMSСегодня разработаем панель, через которую сможем отправлять SMS сразу нескольким адресатам, получать их ответы и видеть статистику по отправленным сообщениям через календарь и график. Будем...

Outstatic CMS для персонального блога на Next.js: Легко и Быстро

Решил сделать небольшой проект для веб-студии, чтобы удобно хранить наши наработки и получать дополнительный доход с продаж готовых решений. Для разработки я выбрал Next.js , создал структуру проекта и пошел думать над тем, как мне будет проще и удобнее публиковать и редактировать статьи. В итоге нашел новую и легковесную CMS — Outstatic , разработанную для управления контентом с использованием Markdown. О ней и пойдет речь в этой статье.

habr.com/ru/articles/857278/

ХабрOutstatic CMS для персонального блога на Next.js: Легко и БыстроРешил сделать небольшой проект для веб-студии, чтобы удобно хранить наши наработки и получать дополнительный доход с продаж готовых решений. Для разработки я выбрал Next.js , создал структуру проекта...

Next.js v15 — Работа над Ошибками

Привет! Это ставшая уже регулярной рубрика о релизах next.js ( читайте релизы по v11 , v12 , v13 , v14 ). Каждый релиз - набор нового, интересного и спорного. Новая версия не станет исключением. Но всё же новая версия интересна не столько новым функционалом, сколько изменением приоритетов и организации в next.js. И да, как вы уже догадались из названия, в значительной части релиз ценен проработкой ошибок и доработками. В данной статье я не буду останавливаться на том что такое App Router или серверные компоненты - про это подробно расписано в предыдущих статьях. Только про новую версию и только про новые изменения. Примечание: в статье отражены самые интересные изменения с призмы автора. Презентация новой версии состоится 25 ноября. О ней будет выпущена дополнительная статья.

habr.com/ru/articles/852352/

ХабрNext.js v15 — Работа над ОшибкамиПривет! Это ставшая уже регулярной рубрика о релизах next.js ( читайте релизы по v11 , v12 , v13 , v14 ). Каждый релиз - набор нового, интересного и спорного. Новая версия не станет исключением. Но...

Как сделать React Server Components в Electron с помощью Next.js и без открытых портов

Статья про то как заставить работать React Server Components внутри Electron приложения с помощью Next.js при этом не запуская локальный сервер и не открывая порты. С возможностью публикации стандартными инструментами. А также исследование зачем все это надо.

habr.com/ru/articles/852384/

ХабрКак сделать React Server Components в Electron с помощью Next.js и без открытых портовС появлением React Server Components и Server Actions разработка веб-приложений стала проще, чем когда-либо. Удобно когда у разработчика есть все серверные API прямо внутри веб-приложения, нативно, с...

Создание простой CRM на Next.js и Prisma для B2B

Мой опыт работы в продажах в различных компаниях многому меня научил. Одним из ключевых инструментов, без которого невозможен эффективный процесс продаж, является CRM-система. Для руководителей и менеджеров по продажам она должна решать множество задач и отвечать на целый ряд вопросов. Но об этом чуть позже. На рынке представлено не так много распространённых CRM-систем для управления продажами, и в большинстве компаний мне приходилось работать именно с ними. В некоторых случаях я сталкивался с кастомными решениями, которые значительно упрощали жизнь пользователю благодаря удобному интерфейсу и гибкости. Поэтому на собеседованиях я часто задавал вопрос о CRM-системе компании. Разочарование наступало, когда выяснялось, что в компании используют "шаблонные" решения, которые не всегда соответствовали требованиям пользователей. Ещё до того, как я начал заниматься разработкой, мне пришла идея поучаствовать в создании собственной CRM-системы и глубже погрузиться в процесс её разработки. Спустя несколько лет я начал заниматься веб-разработкой, и в какой-то момент понял, что даже небольшому бизнесу, где я работал, нужна CRM. Я пробовал использовать таблицы в Google Docs, тестировал триальные версии популярных CRM, но они были перегружены ненужной информацией и казались неудобными. Так что я решил создать что-то простое, что будет удобно мне и, возможно, другим. В своей CRM я использую Next.js . Эта система не претендует на то, чтобы обслуживать тысячи пользователей, но она точно может решить задачи 1-2 небольших отделов продаж. У меня есть репозиторий на GitHub, и если кому-то это решение покажется интересным, его можно взять и доработать под свои задачи. В этой статье я постараюсь кратко описать текущий функционал, с какими трудностями я столкнулся и что удалось внедрить в качестве новых гипотез.

habr.com/ru/articles/851282/

ХабрСоздание простой CRM на Next.js и Prisma для B2Bинтерфейс "дела" Введение Мой опыт работы в продажах в различных компаниях многому меня научил. Одним из ключевых инструментов, без которого невозможен эффективный процесс продаж, является...

Руководство по Convex. Часть 1

Привет, друзья! В этой серии статей я рассказываю о Convex — новом открытом и бесплатном решении BaaS (Backend as a Service — бэкенд как услуга), которое выглядит очень многообещающе и быстро набирает популярность среди разработчиков. На сегодняшний день Convex предоставляет реактивную базу данных смешанного типа, механизм аутентификации/авторизации, файловое хранилище, планировщик задач и инструменты интеллектуального поиска. Эта первая часть серии, в которой мы поговорим о функциях и базе данных Convex.

habr.com/ru/companies/timeweb/

ХабрРуководство по Convex. Часть 1Привет, друзья! В этой серии статей я рассказываю о Convex — новом открытом и бесплатном решении BaaS (Backend as a Service — бэкенд как услуга), которое выглядит очень многообещающе и быстро набирает...