Как улучшить SEO с помощью Next.js
Next.js - это бесплатный открытый JavaScript-фреймворк, созданный поверх React, и работает он по принципу SSR.
В подходе SPA всё отрисовывается на стороне клиента, поэтому код подгружается, когда пользователь заходит на страницу. Но поисковый робот может просмотреть только изначальный код страницы, ещё не обработанный React’ом. И тут на помощь приходит технология SSR, которая позволяет запускать код на сервере и улучшать таким образом SEO.
~~~~~~~~~
🇺🇸🇷🇺 #nextjs #seo #ssr #tutorial #react #en #ru
@react_it
Next.js - это бесплатный открытый JavaScript-фреймворк, созданный поверх React, и работает он по принципу SSR.
В подходе SPA всё отрисовывается на стороне клиента, поэтому код подгружается, когда пользователь заходит на страницу. Но поисковый робот может просмотреть только изначальный код страницы, ещё не обработанный React’ом. И тут на помощь приходит технология SSR, которая позволяет запускать код на сервере и улучшать таким образом SEO.
~~~~~~~~~
🇺🇸🇷🇺 #nextjs #seo #ssr #tutorial #react #en #ru
@react_it
How to change the port of a Next.js application
По умолчанию сервер Next.js работает на порту 3000, что хорошо, но иногда вы хотите запустить сервер на другом порту, возможно потому, что у вас уже есть служба, работающая на нем, или, может быть, это не ваш любимый порт (что в моем случае 8080). Итак, давайте посмотрим, как мы можем это изменить.
[Статья]: blog.umesh.wtf/how-to-change-the-port-of-a-nextjs-application
~~~~~~~~~~
🇺🇸 #tutorial #nextjs #lib #react #en
@react_it
По умолчанию сервер Next.js работает на порту 3000, что хорошо, но иногда вы хотите запустить сервер на другом порту, возможно потому, что у вас уже есть служба, работающая на нем, или, может быть, это не ваш любимый порт (что в моем случае 8080). Итак, давайте посмотрим, как мы можем это изменить.
[Статья]: blog.umesh.wtf/how-to-change-the-port-of-a-nextjs-application
~~~~~~~~~~
🇺🇸 #tutorial #nextjs #lib #react #en
@react_it
Create React App vs Next.js vs Gatsby
В этом кратком видео приводится общее сравнение некоторых ведущих соперников, поэтому вы можете сделать правильный выбор между Create React App, Next.js и Gatsby.
https://www.youtube.com/watch?v=kFXQRONQqGA
~~~~~~~~~~
🇺🇸 #tutorial #nextjs #gatsby #react #en
@react_it
В этом кратком видео приводится общее сравнение некоторых ведущих соперников, поэтому вы можете сделать правильный выбор между Create React App, Next.js и Gatsby.
https://www.youtube.com/watch?v=kFXQRONQqGA
~~~~~~~~~~
🇺🇸 #tutorial #nextjs #gatsby #react #en
@react_it
YouTube
Create React App vs Next.js vs Gatsby
There are lots of options when building React applications so where do you start? Create React App is probably the most common starting point, but have you looked at Next.js and Gatsby? They are two frameworks built on top of React that bring features like…
Вышел Next.js 10
Основные нововведения:
- Новый встроенный компонент для оптимизации изображений
- Интернационализация в роутинге
- Аналитика
- Next.js Commerce
- поддержка React 17
- Поддержка Fast Refresh для MDX
- Импорт CSS для сторонних компонентов
- Автоматический резолв href для ссылок (атрибут as больше не требуется)
- CLI кодмоды для автоматического обновления версии фреймворка
- блокирующий фоллбек для getStaticPath
[Статья]: nextjs.org/blog/next-10
~~~~~~~~~~
🇺🇸 #release #react #nextjs #en
@react_it
Основные нововведения:
- Новый встроенный компонент для оптимизации изображений
- Интернационализация в роутинге
- Аналитика
- Next.js Commerce
- поддержка React 17
- Поддержка Fast Refresh для MDX
- Импорт CSS для сторонних компонентов
- Автоматический резолв href для ссылок (атрибут as больше не требуется)
- CLI кодмоды для автоматического обновления версии фреймворка
- блокирующий фоллбек для getStaticPath
[Статья]: nextjs.org/blog/next-10
~~~~~~~~~~
🇺🇸 #release #react #nextjs #en
@react_it
Getting Started With Next.js
Начало работы с Next.js. Next.js - это фреймворк React, который обязательно упростит вашу жизнь как разработчику React, абстрагируя общие и избыточные задачи (например, маршрутизацию) в относительно более простые и мощные API. Таким образом, вы можете сосредоточиться на написании своих приложений вместо того, чтобы изобретать колесо.
[Статья]: www.smashingmagazine.com/2020/10/getting-started-with-next-js
~~~~~~~~~~
🇺🇸 #tutorial #nextjs #react #en
@react_it
Начало работы с Next.js. Next.js - это фреймворк React, который обязательно упростит вашу жизнь как разработчику React, абстрагируя общие и избыточные задачи (например, маршрутизацию) в относительно более простые и мощные API. Таким образом, вы можете сосредоточиться на написании своих приложений вместо того, чтобы изобретать колесо.
[Статья]: www.smashingmagazine.com/2020/10/getting-started-with-next-js
~~~~~~~~~~
🇺🇸 #tutorial #nextjs #react #en
@react_it