Серия туториалов о создании веб приложений на Next.js, TypeScript и GraphQL

Ссылка на плейлист: https://www.youtube.com/watch?v=kfmh2mMf3fs&list=PLN3n1USn4xlkDk8vPVtgyGG3_1eXYPrW-

#jsvideo #graphql #webdev #frontend #nextjs #javascript #typescript #react

Полный гайд по аутентификации в Next.js

#nextjs #fullstack #javascript #backend #frontend #react #webdev

Создание JAMStack приложения с аутентификацией на Next.js, Airtable, Tailwind CSS и Auth0

#jsarticle #javascript #nextjs #react #fullstack #webdev #airtable #auth0 #tailwind

Сравнение скорости генераторов статических сайтов

Сравниваются 11ty, Gatsby, Hugo, Jekyll, Next.js и Nuxt.js

Вкратце:

- Hugo самый быстрый в независимости от количества файлов
- Next.js быстрее чем Jekyll при 32К файлах и быстрее чем Jekyll и 11ty при 64К файлах
- Gatsby оказался самым медленным

#jsarticle #javascript #11ty #gatsby #ssg #hugo #jekyll #nuxt #nextjs

Aleph - React фреймворк для Deno, вдохновлённый Next.js

Как и в Next.js, в Aleph поддерживаются:
- статическая генерация и серверный рендеринг
- файловый роутинг
- HMR и Fast Refresh
- встроенная поддержка CSS импортов

Помимо фич Next.js, у Aleph есть свои собственные:
- Полная поддержка ESM (т.к. в Deno ESM - стандартная система)
- ESM модули как в сервере, так и в браузере, в результате меньший чем в Next.js бандл
- Отказ от поддержки IE11 (поддерживаются Chrome 61+, Edge 16+, Firefox 60+, Safari 11+ и Opera 48+)

#jslib #deno #backend #frontend #fullstack #react #webdev #nextjs

Создание блога на Next.js + Notion

#notion #jsarticle #javascript #nextjs #frontend #webdev #react

Паттерны авторизации в Next.js

#jsarticle #javascript #nextjs #react #fullstack #frontend #webdev

Firebase авторизация для Next.js API

#jsarticle #nextjs #fullstack #webdev #react #firebase #backend

next-translate - Next.js плагин для лёгкой интернационализации сайтов с помощью i18n

- Поддерживает автоматическую оптимизацию страниц (встроенная фича Next.js)
- Плагин лёгок в использовании и настройке
- Загружает только необходимый язык для перевода страницы
- Весит всего 1KB, поддерживает tree shaking, не имеет зависимостей

#jslib #nextjs #javascript #frontend #webdev #react

Счётчик просмотра страниц на Next.js и Supabase

#jsarticle #nextjs #frontend #webdev #fullstack #supabase #javascript #webdev #react

Почему я избавился от getInitialProps в Next.js

#nextjs #jsarticle #javascript #webdev #react

​​next-sitemap — Sitemap генератор для Next.js

#jslib #javascript #nextjs #webdev #react

next-dark-mode — библиотека для добавления тёмного режима в Next.js приложения

#jslib #nextjs #react #frontend #webdev #javascript

Создание чата в реальном времени с SMS уведомлениями на Next.js, Prisma и GraphQL

#jsarticle #javascript #frontend #webdev #react #graphql #fullstack #prisma #nextjs

Вышел Next.js 10.1

- Ускоренный в 3 раза React Refresh
- Улучшено время установки (были заменены многие устаревшие модули)
- Оптимизация для next/image теперь происходит через WebAssembly (+ поддержка Apple Silicon)
- Новое св-во loader для next/image, позволяющее добавлять свою собственную CDN для картинок
- В Next.js Commerce появилась интеграция с Shopify
- Настраиваемая страница для серверных ошибок (500.js)
- Поддержка поля "extends" в tsconfig.json для проектов на TypeScript
- Теперь при навигации с помощью next/router страница прокручивается обратно вверх
- Улучшена документация

#jsrelease #nextjs #frontend #webdev #fullstack #react #javascript

Полноценный гайд по инкрементальной статической генерации в Next.js

#jsarticle #javascript #nextjs #frontend #webdev #react

next-api-decorators - коллекция TypeScript декораторов для API в Next.js

Позволяет создавать API эндпоинты в Next.js при помощи декораторов.

- Валидация запросов
- Декораторы для HTTP запросов, установки статус-кода, получения URL параметров, заголовков и содержимого запроса
- Трансформация разных типов для URL параметров и содержимого запроса (например парсинг строк в булевое значение)
- Исключения, можно создавать свои на основе HttpEexception класса

#jslib #javascript #nodejs #backend #nextjs #webdev

​​Портативные веб приложения с Next.js и Go

В недавних версиях Go было добавлено встраивание файлов внутрь бинарника

Автор статьи нашёл интересное применение этому функционалу — внедрение Next.js приложений в статический бинарник

Такой подход позволяет увеличить производительность и добавляет возможность использовать возможности языка Go

#jsarticle #nextjs #backend #webdev #javascript #nodejs #golang

Вышел Next.js 10.2

- prod сборка на 60% быстрее с помощью кэширования
- fast refresh ускорился на 0.1-0.2s
- запуск next dev на 24% быстрее
- улучшена доступность
- расширен функционал redirects / rewrites
- автоматическая оптимизация шрифтов

#jsrelease #nextjs #fullstack #frontend #webdev #react #javascript

Интеграция Notion и Next.js

#jsarticle #nodejs #nextjs #fullstack #notion #frontend #react #webdev #backend