Я набрал около 30 баллов в рейтинге PageSpeed, переключив свой блог с WordPress на Gatsby.js + Netlify.

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

Войдите в JAMStack

На мой взгляд, только за последние несколько лет такие инструменты, как Gatsby.js и Next.js, развились до такой степени, что они могут стать заменой WordPress. Сочетание React, Markdown и Webpack делает его достаточно хорошим, чтобы конкурировать, если вы готовы немного запачкать руки. Но после того, как вы проделали всю работу по преобразованию, это почти меньше работы, чем поддержание актуальности, безопасности и производительности WordPress. Преимуществ перехода к статическому экспорту много, в том числе возможность разместить свой блог бесплатно!

В начале прошлого года хостинг-сервис Lithium Hosting, которым я пользовался более десяти лет (реферальная ссылка), наконец-то увеличил мою ежемесячную подписку с 10 до 15 долларов в месяц. Очевидно, я не жалуюсь на увеличение на 5 долларов после всех этих лет, но это дало мне последний импульс мотивации, который мне был нужен, чтобы закончить создание статической экспортируемой версии моего веб-сайта на основе JavaScript с открытым исходным кодом.

Я пытался восстановить свой блог с помощью Next.js и Gatsby.js; на сегодняшний день я не думаю, что вы можете ошибиться с любым выбором.

  • Если ваш веб-сайт в основном представляет собой блог, я считаю, что Gatsby настраивается немного быстрее, с экосистемой плагинов для выполнения всех распространенных задач.
  • Однако, если вам действительно нужно настроить свои настройки, особенно когда речь идет о маршрутизации или чем-то еще, то Next.js может подойти лучше. Я выбрал Gatsby.js и до сих пор был очень доволен.

Моими основными целями конверсии были:

  • управление локальным контентом (больше нет риска безопасности от общедоступного администратора)
  • писать сообщения в блоге в Markdown с контролем версий
  • 100% статический экспорт, который можно бесплатно разместить на Netlify (или на страницах GitHub)
  • значительно улучшить скорость страницы

Вот основные инструменты, которые я использовал для преобразования WordPress в Gatsby.js:

Преобразование контента блога из WordPress в Gatsby

Общий процесс конвертации был таким:

  1. Настройте блог в Gatsby, изменив существующую тему
  2. Экспортировать мои сообщения из WordPress (используя инструмент в админке)
  3. Конвертируйте мои сообщения из WordPress HTML в Markdown с помощью этого инструмента
  4. Вручную очистите все, что сломалось во время преобразования

После перехода с WordPress на Gatsby.js моя оценка PageSpeed ​​Insights выросла с 50 до около 80. Мои оценки производительности веб-страницы изменились с три пятерки до все пятерки.

В итоге я очень доволен заменой. Вероятно, я потратил слишком много времени на настройку цветов ссылок (до сих пор они мне не нравятся). Однако возможность писать сообщения с помощью Markdown, в VS Code и отправлять изменения через GitHub — это просто потрясающе! Я действительно не скучаю ни по одной из головных болей WordPress, и приятно иметь возможность экономить 15 долларов в месяц.

Напишите мне в Твиттере, если у вас есть комментарии/вопросы по настройке блога с Gatsby.js.

Первоначально опубликовано на simpixelated.com. Перейдите туда, если вам понравился этот пост и вы хотите прочитать другие, похожие на него.