Перейти к основному содержимому

Типовые проекты

1. Вёрстка email-рассылок​

Тестовые стенды для статики​

Тестовые стенды с docker​

2. Landing page и статичные сайты​

Old-school​

New-school​

3. Сайты для блогов и документации​

4. Небольшие контентные сайты (CMS)​

5. Web applications (SPA React)​

6. Дизайн email, сайтов и приложений​

Типы сайтов​

  • Одностраничный (landing page, scrolling site)
  • Реклама одного товара / одной услуги
  • Реклама одного события (эвентов)
  • Promo-компании
  • Сайт-визитка
  • Сайт-портфолио Многостраничный (иерархия страниц)
  • Визитная карточка компании
  • Корпоративный сайт (фирменный)
  • Интернет-магазин (ЛК, Карточки товаров, Каталог, Оплата) Application (приложение)
  • SPA (React, Vue, Angular)
  • PWA (like mobile app)

Project team​

  • Заказчик, клиент, уполномоченный представитель (Product owner/manager)
    • Владелец бизнеса, генератор идеи, инвестор
    • ТЗ, документы, стратегияç
    • Если product manger, то он как посредник между бизнесом и разработкой, между заказчиком и исполнителями
  • Бизнес-аналитик
    • Не всегда бывает в команде
    • Анализирует продукт и предлагает свои идеи по улучшению проекта и развитию функционала
  • Менеджер проекта (Project manager/Team lead/Scrum master)
    • Управляет процессом разработки, коммуникация с командой, организатор митингов, SCRUM-мастер
    • Создание и распределение задач, установление сроков
    • Работа с документацией, презентация готовых этапов и всего продукта
    • Ведущий на ретроспективах
  • Дизайнер (Designer)
    • Проектирование
    • Мудборды и дизайн-концепция
    • Дизайн-макеты
  • Frontend-разработчик
    • Верстка страниц и компонентов по дизайн-макетам
    • Запросы к API, отрисовка данных
    • Бизнес-логика на клиенте
    • Роутинг приложения, иерархия страниц и пр.
  • Mobile-разработчик
    • Разработчик клиента под мобильные устройства (Android, iOS)
  • Backend-разработчик
    • API
    • Админ-панель
    • Логика для работы БД
    • Бизнес-логика на сервере
  • Tecтировщик (QA/Tester)
    • Проверка работоспособности
    • Тестовая документация (тест-кейсы, репорты и пр.)
    • Тест-репорт, закрытие задач для релиза
    • Различные виды тестирование (регрес, интеграционное и т.д.)
  • Девопс (DevOps)
    • Не разрабаытывает, только настраивает, чтобы все работало
    • Настройка депллоя приложения (скрипты deploy cli)
    • Доступ к репозиториям
    • Настройка серверов (тестовый и продуктовый) и БД
    • Хостинг и домен

Оценка проекта​

  • Сборка (React, NextJS)
  • Дизайн (Figma)
  • Экраны, Адаптивность
  • UI-фреймворк или без него
  • Mock-данные
  • Типизация, TypeScript
  • Авторизация/Аутентификация
  • API, запросы, обработка
  • Мультиязычность
  • State-managment
  • Поддерживаемые браузеры
  • Документация фронтенда
  • Верстка писем
  • Оптимизация, деструктуризация, декомпозиция (Atomic design)
  • Postman-интеграция
  • ENV-vars (тестовый, продуктовый)

Мой комфорт​

  • Новые проекты: Да, старые - нет
  • Простые и понятные проекты без сложной бизнес-логики
  • Минимум абстракций и чужого непонятного легаси-кода
  • Большие команды: нет, микро-тим или соло: да
  • Быстро: нет, качественно: да
  • Офис: нет, удаленно: да
  • Менеджер, который требует жёсткой оценки и спрашивает за каждый час работы может пойти в жопу
  • Менеджер, который даёт спокойно работать - хороший менеджер
  • Дизайнер, который не знает вёрстку - плохой дизайнер
  • Тестировщик, который незаметный и мало говорит - хороший тестировщик
  • Бэкендер, который просит "чего-то там сделать", чтобы запросы проходили - плохой бэкендер
  • Хороший девопс - девопс, которого никогда не видел и ничего о нем не знаешь
  • Фронтендер, который не умеет верстать и не разбирается в дизайне - плохой фронтендер!

Поиск заказов​

Российские платформы​

Основные биржи фриланса​

  • FL.ru — крупная биржа, много React-проектов
  • Kwork — микрозадачи и проекты, удобный интерфейс
  • Freelance.ru — проверенная платформа
  • Weblancer — классическая биржа

Специализированные площадки​

  • Тинькофф Старт — стартапы и проекты
  • Хабр Карьера — вакансии и проекты для разработчиков
  • hh.ru — раздел "Проектная работа"
  • Работа.ру — фильтр по проектной работе

Международные платформы​

  • Upwork — крупная платформа, высокие ставки
  • Freelancer — много проектов, конкурентная среда
  • Fiverr — можно продавать услуги как готовые пакеты
  • Toptal — для опытных разработчиков, высокие требования

Telegram-каналы​

  • Freelance — каналы с IT-заказами
  • IT-заказы — специализированные каналы
  • Веб-разработка — каналы по фронтенду

Дополнительные ресурсы​

Социальные сети​

  • LinkedIn — профессиональная сеть, можно найти проекты
  • VK — группы по фрилансу и React-разработке
  • Telegram — поиск по каналам и чатам

Сообщества разработчиков​

  • GitHub — некоторые проекты ищут контрибьюторов
  • Stack Overflow Jobs
  • Dev.to — раздел с вакансиями

Рекомендации для начала​

  • Создайте профиль на 2–3 платформах (например, FL.ru, Kwork, Upwork).
  • Подготовьте портфолио с React-проектами.
  • Начните с небольших задач для набора отзывов.
  • Укажите конкретные навыки: React, TypeScript, Redux, Next.js и т.д.
  • Типичные React-проекты для подработки

Согласно вашей базе знаний:​

Лендинги на React — от 15,000₽ Блоги на React — от 20,000₽ SPA-приложения — от 50,000₽ Админ-панели — от 40,000₽ Доработка существующих проектов — от 1,000₽/час Подробнее в вашем файле: docs/3 - frontend/other/8-earnings.md