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

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

Next.js встречает firebase и mobx | III

Next.js встречает firebase и mobx | III Эпизод 3 | правила проверки и чтение / запись данных Введение В последних двух эпизодах мы создали базовое приложение next.js и аутентифицировали наших пользователей через провайдеров firebase oauth. Это было довольно скучно, поскольку у нас даже нет данных в нашей базе данных: «(Так что давайте это изменим! Firebase полностью работает на стороне клиента, но, поскольку мы не можем доверять пользователям, мы должны определить правила..

Почему мы выбрали NextJS для нашего веб-сайта, и вы должны рассмотреть его и для следующего проекта

Около года назад мы решили изменить дизайн наших сайтов pracezarohem.cz и pracazarogiem.pl . Редизайн был слишком масштабным, поэтому мы решили изменить и веб-систему. Как команда мобильных разработчиков, мы обычно используем react-native и php для серверной части. Мы в основном используем php-фреймворк Symfony, но как мобильные разработчики мы не очень довольны php :) Поэтому мы начали искать альтернативу… и тут на помощь пришел NextJS. Я пишу это с точки зрения человека,..

Создание игры Typeracer с использованием ReactJS — Часть 2

Это продолжение Части 1 , которая раскрывает базовый функционал игры. Чтобы быстро освежить в памяти, вот что мы построили в части 1: Кажется довольно простым, не так ли? Есть некоторые улучшения, которые могут быть сделаны для улучшения нашего UX: Сделайте неправильное слово красным Сделайте правильное слово зеленым Сделать текущее слово подчеркиванием Сделать уже напечатанные слова зелеными После этого мы можем отобразить статистику, которая показывает количество..

Полное руководство по SEO с бессерверным приложением React в 2019 году

В этом посте мы рассмотрим многие варианты создания приложения React, которое будет правильно сканироваться поисковыми системами и сайтами социальных сетей. Это не полностью исчерпывающий список, но он фокусируется на бессерверных вариантах, поэтому вам не нужно управлять парком контейнеров EC2 или Docker. Часто упускаемый из виду аспект, когда вы начинаете создавать веб-приложения с полным стеком в React, — это SEO, потому что вам нужно создать так много других компонентов, чтобы..

Как использовать Tailwind CSS с Next.js

Как использовать Tailwind CSS с Next.js Tailwind CSS — это удобная CSS-инфраструктура для более быстрого и простого создания пользовательского пользовательского интерфейса. Tailwind CSS — низкоуровневый CSS-фреймворк с широкими возможностями настройки. Также читайте в 👉 Как использовать Tailwind CSS с Next.js | Тасним Зотдер Действия по добавлению Tailwind CSS в приложение Next.js. 1. Установите зависимости Tailwind. при использовании yarn yarn add -D..

Напишите чистый код React на стороне сервера с серверными компонентами более высокого порядка

React 18 открыл двери в область бэкенда, представив серверные компоненты. Однако в серверных компонентах у нас нет доступа ни к состоянию, ни к хукам. Очень легко получить связанный и повторяющийся код с серверными компонентами и всеми их ограничениями. Ваш код может легко стать неорганизованным во время выборки данных и распространения данных на потребительские компоненты. В одном подходе, если вы извлекаете данные на уровне страницы и распространяете данные ответа на соответствующие..

Стратегии рендеринга: CSR, SSR, SSG, ISR

Мы использовали внешние библиотеки/фреймворки, которые помогают создавать одностраничные приложения «из коробки», где приложение отображается на стороне клиента, и мы все хорошо знакомы с этим подходом. Есть еще несколько способов рендеринга приложений, которые мы рассмотрим в этой статье вместе с кратким обсуждением рендеринга на стороне клиента (CSR), просто чтобы увидеть, чем он отличается от предварительного рендеринга. Рендеринг на стороне клиента (CSR): В этой стратегии сервер..