Публикации по теме 'nextjs'


Как эффективно использовать SEO-функции приложения Next.js
Что нужно знать разработчику при создании SEO-оптимизированного приложения. Мы все любим React за его скорость и производительность. Поскольку он использует подход одностраничного приложения, все кажется быстрым и мгновенным. Но за это приходится платить: такой подход вредит поисковой оптимизации приложений React. Очень сложно сделать приложение React оптимизированным для SEO. Однако есть несколько способов сделать это. 3 простых способа решить..

Я создал бессерверное приложение для живого чата с помощью Next.js, Fauna и WunderGraph для интерактивных запросов GraphQL
Пошаговое руководство по созданию масштабируемого приложения для чата в реальном времени с использованием бессерверных технологий с небольшой помощью NextAuth.js для входа в GitHub. Кому нужны WebSockets, когда у вас есть Live Queries? Если вы создаете приложения, которые работают с данными в реальном времени, вы, вероятно, используете WebSockets. Они позволяют веб-браузеру и веб-серверу обмениваться данными в режиме реального времени, сохраняя постоянное соединение между ними..

Как использовать Relay с Next.js и TypeScript
Эта проблема Если у вас есть такой код реле: import { Suspense } from "react"; import { graphql } from "relay-runtime"; import { useLazyLoadQuery } from "react-relay"; const RelayTestQuery = graphql` query RelayTestQuery { viewer { id } } `; function RelayTestInner() { const data = useLazyLoadQuery(RelayTestQuery, { variables: {}, }); return <div>hi</div>; } export default function RelayTest() { return (..

Мой шаблон Next.js + Tailwind
Введение Недавно начал работать с Next.js, и это изменило мою игру. Изначально я перешел с Vue на React, но, посмотрев пару видео о Next, решил перейти на него next (каламбур 😂). Вот мой шаблонный код, который я использую для каждого проекта. Настройка Next.js Во-первых, нам нужно настроить наше приложение Next.js. npx create-next-app <project-name> Как только он будет создан, cd в проект cd <project-name> Настройка CSS попутного ветра Теперь нам нужно..

Создание динамических веб-сайтов с помощью Next.js и Sanity CMS
Создание динамических веб-сайтов с помощью Next.js и Sanity CMS Введение В этой статье мы рассмотрим, как интегрировать Next.js, популярную платформу React, с Sanity CMS для создания динамичных и насыщенных контентом веб-сайтов. Мы воспользуемся мощью Next.js для рендеринга на стороне сервера (SSR) и объединим его с гибкими возможностями управления контентом Sanity CMS. Предварительные условия Прежде чем мы начнем, убедитесь, что у вас выполнены следующие предварительные условия:..

Мои приключения в выяснении SSR против SPA и всего вышеперечисленного!
На сервере Discord, которым управляют мои друзья, проводился конкурс на лучшее слайд-шоу; Вместо этого я решил сделать сайт для себя. Я не особо планировал проект, я просто думал о том, какой будет базовая структура, и работал с ней. Что касается выбора моего технического стека, я решил использовать NextJS в основном потому, что вокруг него так много шумихи, и я действительно хочу получить некоторый опыт его использования. Я также использовал TailwindCSS для стилизации, так как недавно..

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