Ваш интерфейс по-прежнему работает на jQuery, старых классовых компонентах или устаревшей настройке Next.js, и каждое изменение занимает больше времени, чем должно. Я переношу его на современный React или Next.js в TypeScript по одной странице за раз, пока продукт продолжает работать.
Я перенесу ваш интерфейс jQuery или устаревший React на современный React или Next.js, страницу за страницей
План миграции для вашего фронтенда и одна небольшая страница, перенесенная в качестве примера.
- План и одна страница-образец
- Письменный план миграции
- Исходный код
До 3 страниц перенесено на React или Next.js, работающих рядом со старым кодом.
- До 3 страниц перенесено
- Письменный план миграции
- Исходный код
До 8 страниц, общие компоненты, типы TypeScript и тесты.
- До 8 страниц, компоненты, тесты
- Письменный план миграции
- Исходный код
Запросить индивидуальное предложение
Войдите, чтобы запросить пользовательское предложение
Создайте бесплатный аккаунт или войдите, чтобы запросить персонализированное предложение от этого Zinner.
Войти / ЗарегистрироватьсяЗадать вопрос перед покупкой
Войдите, чтобы задать вопрос
Чтобы снизить спам на платформе, сообщения перед продажей могут отправлять только авторизованные пользователи.
Создайте бесплатный аккаунт или войдите, чтобы написать сообщение этому Zinner напрямую.
Войти / ЗарегистрироватьсяТребуется вход
Создайте бесплатный аккаунт или войдите, чтобы написать сообщение этому Zinner.
Войти / ЗарегистрироватьсяТребуется вход
Создайте бесплатный аккаунт или войдите, чтобы запросить персонализированное предложение.
Войти / ЗарегистрироватьсяС первого взгляда
Ключевые детали об этой услуге, которые помогут вам решить. Создано Zinn Hub, не продавцом.
Позиция по стоимости
Подход к миграции
Технологический стек
Что остается нетронутым
Поддержка после доставки
Что вы получите
Полное описание
Некоторые продукты работают и приносят деньги, но их фронтенд стало трудно изменять: jQuery, разбросанный по шаблонам, классовые компоненты React многолетней давности или приложение Next.js, все еще использующее Pages Router. Полная переработка замораживает продукт на месяцы. Я делаю по-другому: старый и новый код работают бок о бок, и страницы переносятся по одной, так что для ваших пользователей никогда не наступает большой день переключения.
Я делал именно это в прошлом проекте под NDA: фронтенд jQuery переносился на React страница за страницей, пока продукт оставался в рабочем состоянии.
Стартовый пакет дает вам план: я читаю старый фронтенд, отображаю его страницы и общие части, перечисляю риски и переношу одну небольшую страницу в качестве рабочего примера подхода. Стандартный пакет переносит до трех страниц или экранов. Расширенный пакет переносит до восьми, создает необходимые общие компоненты и покрывает их типами TypeScript для их данных и тестами для основных потоков.
Что остается: ваш бэкенд, ваши URL-адреса и поведение, знакомое пользователям. Что меняется: организация кода, чтобы следующая функция была написана один раз, в одном месте. В течение 14 дней после доставки я бесплатно исправляю все, что не работает так, как мы договорились.
Порядок страниц и план согласовываются в чате заказа, без звонков. Каждая перенесенная страница отправляется отдельно, и вы получаете письменное уведомление о статусе каждый рабочий день.
Шаги для завершения вашего проекта
1. Составление карты старого фронтенда — я просматриваю шаблоны, скрипты и компоненты, а также перечисляю страницы, общие части и все рискованные элементы, такие как глобальное состояние или встроенные скрипты.
2. Согласование порядка — вы получаете письменный план: какая страница идет первой, что переносится вместе с ней и как старый и новый код совместно используют продукт, пока оба существуют.
3. Мост — новый код React или Next.js настраивается рядом со старым кодом, с маршрутизацией, которая отправляет каждую страницу той стороне, которой она принадлежит.
4. Перенос страниц по одной — каждая страница перестраивается, сравнивается со старой версией и переключается самостоятельно, так что проблема затрагивает одну страницу, а не продукт.
5. Передача — перенесенные страницы, обновленный план того, что осталось, и краткая заметка о шаблонах, которым нужно следовать для следующих страниц.
Гарантия качества Zinner
Каждый Zinner проверяется и одобряется перед присоединением к платформе.
Все услуги поддерживаются нашим обязательством по гарантии качества.
Ваш платёж защищён до тех пор, пока вы не одобрите выполненную работу.
Сравнить пакеты
| Функция | Начинающий | Стандарт | Продвинутый |
|---|---|---|---|
| Время доставки | 4 дней | 10 дней | 21 дней |
| Правки | 1 | 2 | 3 |
| Объём работ | План и одна страница-образец | До 3 страниц перенесено | До 8 страниц, компоненты, тесты |
| Письменный план миграции | ✓ | ✓ | ✓ |
| Исходный код | ✓ | ✓ | ✓ |
Портфолио
Примеры работ продавца, связанных с этим Zinn.
Formline: магазин Next.js со Stripe
Витрина магазина, по которой можно кликать: 16 плакатов в 4 коллекциях, фильтры и поиск, которые остаются в URL, корзина, светлая и темная темы, а также оформление заказа, которое заканчивается демонстрационным заказом или реальной сессией Stripe Checkout в тестовом режиме. Я создал его как статический экспорт Next.js на TypeScript с Tailwind CSS. Платежи по картам проходят через Cloudflare Worker, который пересчитывает корзину на сервере и проверяет подпись веб-хука Stripe.
Двуязычный личный сайт на Next.js
Одностраничный личный сайт на английском и русском языках, с разделом услуг и ссылками на мои демонстрационные проекты. Я разработал и создал его с помощью Next.js, React и TypeScript как статический экспорт, стилизованный с помощью обычных CSS-модулей и без фреймворка UI. Он имеет светлую и темную темы, а изображение предварительного просмотра для социальных сетей для каждого языка генерируется во время сборки. GitHub Actions собирает и развертывает его на Bunny CDN, который добавляет заголовки безопасности и перенаправляет www и обычный HTTP на основной HTTPS-адрес.
Детали услуги
Часто задаваемые вопросы
Потому что продукт стоял бы на месте месяцами, и весь риск лег бы на один день релиза. Страница за страницей, каждый шаг мал, тестируем и легко откатывается.
Страницы сохраняют свои адреса. С Next.js новые страницы достигают браузера в виде готового HTML, отрендеренного на сервере или во время сборки, поэтому поисковые системы видят контент как раньше. React с Vite рендерится в браузере, поэтому для страниц, приносящих поисковый трафик, я рекомендую Next.js.
Да. Перенесенные страницы написаны на TypeScript, а старый код продолжает работать на JavaScript до своей очереди.
Нет. Миграция затрагивает только фронтенд. Если ваш бэкенд уже имеет конечные точки для данных, необходимых странице, новая страница использует их. Если эти данные сегодня существуют только в виде HTML, отрендеренного PHP, план перечисляет небольшие конечные точки JSON, необходимые странице, и мы договариваемся, кто добавит их до переноса этой страницы.
Отзывы клиентов
Узнайте, что наши клиенты говорят об этом Zinn
Категории
Политика Zinner
Похожие Zinns
сделать php, css, javascript, html, prestashop, mailchimp, rest, json, xml, joomla
