Lemon CoursesВыбрать курс
курсы разработки

Создание приложений

Две линейки курсов по Next.js, Django и AI с учебными проектами. От интерфейса до API, SEO и платежей.

Смотреть курсы Читать статьи

ПРОГРАММЫ ОБУЧЕНИЯ

Выберите свою траекторию

Линейка 01 / AI + Django

От интерфейса AI-чата к микро-SaaS

01Stepik

AI на Django и Next I

Фронтенд AI-чата: Next.js, компоненты, состояние, локализация и интерфейс

К курсу AI-Chat UI ↗
02Stepik

AI на Django и Next II

Django REST Framework, API, авторизация и подключение AI-сервисов к фронтенду

К курсу AI-Chat ↗
03Stepik

LLM-Chat + Mermaid + ЮKassa

Практическая связка фронтенда, Django API, платежей и ограничений доступа

К курсу Микро-SaaS ↗
Линейка 02 / Next.js

От App Router до SEO и сложной архитектуры

JavaScript, TypeScript, индексация и локализованные маршруты на реальных учебных проектах.

РАЗБОРЫ И ПРАКТИКА

Статьи

Все статьи ↗
01Схема технической индексации в Next.jsSEO в Next.js App Router: sitemap, robots, canonical и языковые URL↗02Запрос, сериализатор, ответ и граница между Next.js и DjangoDjango REST Framework + Next.js, как связать фронтенд с API↗03Как подключить бесплатную нейросеть к своему приложениюПервый запрос к бесплатной LLM через OpenRouter, серверный код на Python и ограничения бесплатного API↗04Как сделать форму с понятными ошибками в ReactФорма заметки на React Hook Form и Zod с проверкой данных, сообщениями об ошибках и примером для Next.js↗05Как принимать оплату на своём сайтеПриём платежей через ЮKassa в приложении на Django и Next.js, от кнопки оплаты до подтверждения платежа↗06Как TypeScript помогает не ломать React-компонентыReact + TypeScript на одном примере: типы props, объект данных, optional-поля и понятные ошибки компилятора↗07Как устроена JWT-авторизация и почему API перестаёт пускать пользователяJWT access и refresh, защищённый endpoint Django REST Framework и причины ответа 401↗08Как проверить логику приложения с помощью VitestUnit-тест на Vitest для обработки параметров URL, три проверки и запуск без браузера↗09Как добавить авторизацию в Next.js через SupabaseКак добавить вход по ссылке из письма в Next.js, получить пользователя и защитить его данные через Supabase↗010Как сделать API для своего приложения на DjangoСоздаём JSON API на Django REST Framework, добавляем serializer, маршрут и проверяем ответ в браузере↗011Почему useEffect в React запускается дваждыРазбираем повторный запуск useEffect, зависимости, StrictMode и очистку подписок на простом примере React↗012Где взять API-ключ OpenRouter и как не раскрыть его в приложенииСоздание API-ключа OpenRouter, переменные окружения, проверка доступа на Python и защита ключа в своём приложении↗013Как выбрать бесплатную модель в OpenRouterКак найти бесплатные модели в OpenRouter, сравнить их возможности, проверить лимиты и выбрать модель для своего AI-приложения↗014Как проверить работу сайта с помощью PlaywrightПервый браузерный тест Next.js на Playwright, проверка страницы, перехода по ссылке и запуск после production-сборки↗015Как превратить созданное с помощью ИИ приложение в рабочий продуктОт сгенерированного интерфейса к рабочему приложению: данные, сервер, авторизация, проверка основных сценариев и запуск↗016Как сделать поиск и фильтры через URL в Next.jsКак сделать поиск и фильтрацию каталога через параметры URL в Next.js App Router, чтобы сохранялись ссылки и работала кнопка «Назад»↗017Как выбрать API-провайдера нейросетей для своего приложенияПрямое подключение и агрегаторы LLM, сравнение стоимости, лимитов, задержек и форматов API на примере AI-приложения↗018Как использовать Supabase вместо отдельного backendСоздаём таблицу в Supabase, сохраняем избранные события из Next.js и ограничиваем доступ к записям через RLS↗019Как настроить повторные платежи через ЮKassa для подпискиСохранение способа оплаты, повторное списание через API ЮKassa, сроки подписки и обработка неуспешных платежей↗020Как работает useState в React на примере избранных товаровuseState в React на примере избранных товаров, обновление массива без мутации, повторный рендер и границы локального состояния↗021Почему OpenRouter возвращает ошибку 403 и что проверитьЧто означает HTTP 403 в OpenRouter, как проверить ограничения ключа, модели и guardrails и найти причину отказа API↗022Почему Next.js работает локально, но ломается после деплояРазбираем ошибки сборки Next.js, переменные окружения, серверные запросы и проверку production перед публикацией↗023Вайбкодинг после прототипа. Почему приложение ещё не готово к запускуЧто проверить после создания приложения с ИИ: реальные функции, доступ к данным, расходы, сбои, платежи и обслуживание после запуска↗024React или Next.js. Когда стоит переходить на Next.jsКогда React-приложению нужен Next.js, что меняется в маршрутизации, серверной загрузке данных и компонентах, как начать переход↗025Чем фронтенд отличается от бэкенда на примере одного запросаКак браузер, сервер, API и база данных работают вместе. Разбираем один запрос пользователя от нажатия кнопки до ответа интерфейса↗026Когда использовать React Query, а когда загрузку данных Next.jsЗагрузка и обновление данных через TanStack Query, queryKey, кэширование и сравнение с серверными компонентами Next.js↗

О ПРОЕКТЕ

Теория, реализуемая в коде

Lemon Courses практические курсы и технические статьи об устройстве веб-приложений. Обучение проходит на Stepik. На этом сайте карта курсов и проектов, демонстрации и самостоятельные разборы инженерных задач.