AI Cube

Приложение за выходные

Я убил три выходных подряд на скроллинг. В воскресенье вечером решил сделать что-нибудь настоящее. Открыл Claude Code, написал промпт — и к понедельнику утром у меня был работающий трекер расходов с графиками и категориями.

Вот пять приложений, каждое из которых реально сделать за одни выходные — с нулевым опытом в программировании.

Как запустить Claude Code

# Установка (один раз)
npm install -g @anthropic-ai/claude-code

# Запуск в папке проекта
mkdir my-app && cd my-app
claude

Всё. Теперь пиши что хочешь сделать на русском языке. Claude Code создаёт файлы, объясняет решения, исправляет ошибки по ходу.

Совет: итерируй маленькими шагами. Сначала «сделай форму добавления расхода», потом «добавь список», потом «добавь диаграмму». Так намного проще чем пытаться описать всё сразу.

App 1: Expense Tracker

App 1Expense Tracker

3–4 часа

★★ средний

HTMLVanilla JSlocalStorageChart.js

Стартовый промпт:

Создай веб-приложение трекер расходов.

Функции:
- Форма добавления: сумма, категория, описание, дата
- Категории: еда, транспорт, развлечения, здоровье, другое
- Список расходов с фильтром по месяцу
- Круговая диаграмма по категориям (Chart.js CDN)
- Итого за выбранный месяц

Стек: один HTML-файл + Vanilla JS, данные в localStorage.
Дизайн: тёмная тема, акцент #6366F1, без внешних фреймворков.

App 2: Personal Dashboard

App 2Personal Dashboard

4–5 часов

★★★ сложный

Next.jsTailwind CSSlocalStorageOpenWeather API

Стартовый промпт:

Создай личный дашборд на Next.js App Router.

Виджеты:
- Погода (OpenWeatherMap API, ключ вставлю сам, город = Москва)
- Список задач на сегодня: добавить / отметить / удалить
- Привычки: 5 ежедневных чекбоксов, стрик-счётчик
- Цитата дня из массива 30 цитат — по номеру дня
- Таймер Помодоро 25/5 мин с уведомлением

Стек: Next.js 15, Tailwind CSS, данные в localStorage.
Добавь README с инструкцией деплоя на Vercel.

App 3–5: ещё три идеи

App 3Gift Idea Generator

2–3 часа

★ лёгкий

HTMLCSSJavaScript

Стартовый промпт:

Создай генератор идей подарков. Форма: кому (имя/тип),
возраст (ползунок 1-80), бюджет (3 варианта), интересы (мультиселект 8 пунктов).
Результат: 6 карточек с идеями, кнопка "Ещё 6 идей".
Стек: HTML + CSS + JS без фреймворков.

App 4Personal Website

5–6 часов

★★★ сложный

Next.jsTailwindFramer MotionVercel

Стартовый промпт:

Создай персональный сайт-портфолио.
Страницы: главная (имя + роль + кнопки), обо мне (история + навыки),
проекты (карточки с тегами), контакты (форма + соцсети).
Стек: Next.js + Tailwind + Framer Motion для анимаций.
Настрой деплой на Vercel одной командой.

App 5Habit Tracker

2–3 часа

★★ средний

ReactViteTailwindlocalStorage

Стартовый промпт:

Создай трекер привычек на React + Vite.
Функции: добавить привычку (название + эмодзи + цвет),
отмечать выполнение каждый день, стрик (дней подряд),
календарь текущего месяца (зелёные/серые клетки).
Анимация при отметке выполнения. Данные в localStorage.

Деплой за 2 минуты

# Установи Vercel CLI (один раз)
npm install -g vercel

# В папке проекта
vercel --prod

# Vercel даст ссылку — приложение онлайн.
# Бесплатный план достаточен для личных проектов.

Если Claude Code создал Next.js проект — деплой на Vercel работает из коробки. Для чистого HTML-файла тоже работает — Vercel раздаст его как статику.