CareerVibe — это платформа для карьерного нетворкинга, где студенты и молодые специалисты могут задать вопрос профессионалам из ведущих компаний и получить качественный ответ. Проект разработан в рамках лаборатории искусственного интеллекта Финансового университета при Правительстве РФ.
🌐 Демо: скоро
- Возможности
- Технологии
- Установка и запуск
- Структура проекта
- API Endpoints
- Скриншоты
- Планы по развитию
- Лицензия
- Автор
- ✅ Регистрация и авторизация (по email или никнейму)
- ✅ Ограничение email-доменов — только
.ru(согласно законодательству РФ) - ✅ Валидация email на клиенте и сервере
- ✅ Хеширование паролей (Werkzeug)
- ✅ Сессии с проверкой валидности
- ✅ Профиль пользователя (аватарка, никнейм, информация о себе, дата регистрации)
- ✅ Редактирование профиля (никнейм, аватарка, bio)
- ✅ Счётчик символов в bio (максимум 500)
- ✅ Создание, просмотр, редактирование, удаление вопросов
- ✅ Добавление, редактирование, удаление ответов
- ✅ Поддержка Markdown и LaTeX в вопросах и ответах (редактор EasyMDE с предпросмотром)
- ✅ Тёмная тема для редактора (автоматически переключается с основной темой)
- ✅ Голосование за вопросы и ответы (AJAX, подсветка активного голоса)
- ✅ Отметка «Лучший ответ» (только для автора вопроса)
- ✅ Счётчик просмотров вопросов
- ✅ Вложенные ответы — возможность отвечать на существующие ответы (1 уровень вложенности)
- ✅ Пагинация на главной странице (10 вопросов на страницу с удобным навигатором)
- ✅ Добавление тегов при создании вопроса (через запятую или Enter)
- ✅ Ограничение: максимум 7 тегов, каждый до 20 символов
- ✅ Автодополнение тегов (AJAX) — при вводе в поле поиска или в форме вопроса
- ✅ Удаление
#при добавлении тегов (пользователь может вводить с # или без) - ✅ Динамическое добавление/удаление тегов в форме с визуальной обратной связью
- ✅ Цветовая индикация популярности тегов
- ✅ Отдельные страницы для каждого тега
- ✅ Интерактивная карта всех тегов — визуализация в виде «пузырьков» с физикой (перетаскивание, настройка отталкивания, центробежной силы и скорости, поиск по тегам, сброс позиций)
- ✅ Отображение общего количества тегов и топ-30 на карте
- ✅ Поиск по заголовкам и тексту вопросов
- ✅ Поиск по тегам — введите
#тегв строку поиска - ✅ Подсветка найденных слов в результатах (регистронезависимо)
- ✅ Сортировка ленты: новые / популярные
- ✅ Отображение количества найденных вопросов
- ✅ Загрузка файлов к вопросам и ответам
- ✅ Поддерживаемые форматы: изображения (png, jpg, jpeg, gif, webp), видео (mp4, webm, mov, avi), аудио (mp3, wav, ogg), документы и архивы (pdf, txt, zip, rar, doc, docx, xls, xlsx)
- ✅ Максимум 5 файлов на один вопрос/ответ
- ✅ Drag-and-drop загрузка, предпросмотр изображений, встроенные плееры для видео и аудио
- ✅ Удаление вложений (в том числе существующих при редактировании)
- ✅ Модальное окно для увеличения изображений
- ✅ Две темы оформления — светлая и тёмная (переключение через бургер-меню, сохранение в localStorage)
- ✅ Два языка — русский и английский (переключение через бургер-меню, сохранение в localStorage)
- ✅ Типинг-эффект для заголовка на главной странице (перезапускается при смене языка)
- ✅ Адаптивная вёрстка (мобильные устройства)
- ✅ Бургер-меню на мобильных с выпадающим списком навигации
- ✅ Сайдбар с активными пользователями и популярными тегами
- ✅ Выезжающие уведомления (тосты) с автоматическим исчезновением
- ✅ Анимации карточек, кнопок, аватарок, тегов
- ✅ Sticky-шапка
- ✅ Полноэкранный режим редактора (хэдер скрывается)
- ✅ Анимированные соцсети в футере (эффект MetaMask)
- ✅ «О проекте» (миссия) — с визуализацией ценностей
- ✅ «Помощь» — подробное руководство по использованию платформы, Markdown и LaTeX
- ✅ «Правила сообщества» — детальные правила поведения, ограничения и санкции
- ✅ «Контакты» — информация о разработчике, лаборатории и способах связи
| Компонент | Технология |
|---|---|
| Backend | Python 3.10+, Flask 2.3.3 |
| Database | SQLite3 |
| Frontend | HTML5, CSS3 (чистый, без фреймворков) |
| Markdown + LaTeX | EasyMDE, KaTeX, marked.js |
| Auth | Werkzeug (хеширование паролей) |
| Файлы | werkzeug.utils.secure_filename |
| Визуализация тегов | Интерактивная физика пузырьков (JavaScript Canvas) |
| Локализация | Клиентская (JSON-файлы), Flask-Babel для сервера |
| Темы | CSS-переменные, переключение через JavaScript |
- Python 3.10 или выше
- pip
- Клонировать репозиторий
git clone https://github.com/Y-deva/careervibe.git
cd careervibe- Создать и активировать виртуальное окружение
python -m venv venv
# Windows:
venv\Scripts\activate
# Linux / macOS:
source venv/bin/activate- Установить зависимости
pip install -r requirements.txt- Инициализировать базу данных
python init_db.py- (Опционально) Наполнить базу тестовыми данными
python injector.pyЭто создаст 50 пользователей, 200 вопросов, 500 ответов и 300 комментариев с реалистичными данными.
- Запустить приложение
python app.py- Открыть в браузере
http://127.0.0.1:5000
careervibe/
├── app.py # Основное приложение Flask (маршруты, логика)
├── init_db.py # Скрипт создания базы данных
├── injector.py # Скрипт наполнения БД тестовыми данными
├── requirements.txt # Зависимости проекта
├── README.md # Документация
├── instance/
│ └── careervibe.db # База данных SQLite (создаётся после запуска init_db.py)
├── static/
│ ├── style.css # Все стили проекта (светлая/тёмная тема)
│ ├── avatars/ # Загруженные аватарки пользователей
│ ├── uploads/ # Загруженные файлы (вложения к вопросам и ответам)
│ └── locales/ # Файлы локализации
│ ├── ru.json # Русские переводы
│ └── en.json # Английские переводы
└── templates/
├── base.html # Базовый шаблон (шапка, бургер-меню, футер, тосты)
├── index.html # Главная страница (лента вопросов + пагинация + сайдбар)
├── login.html # Страница входа и регистрации
├── mission.html # Страница «Миссия»
├── help.html # Страница помощи (руководство по Markdown/LaTeX)
├── rules.html # Правила сообщества
├── contacts.html # Контакты
├── all_tags.html # Интерактивная карта всех тегов (пузырьки)
├── ask_question.html # Создание нового вопроса
├── question_detail.html # Детальная страница вопроса
├── edit_question.html # Редактирование вопроса
├── edit_answer.html # Редактирование ответа
├── profile.html # Профиль пользователя
├── edit_profile.html # Редактирование профиля
├── search.html # Результаты поиска (с подсветкой)
└── tag_questions.html # Вопросы по тегу
| Маршрут | Метод | Описание |
|---|---|---|
/ |
GET | Главная страница (лента вопросов с пагинацией) |
/login |
GET, POST | Вход и регистрация (поддержка email/никнейма, только .ru домены) |
/logout |
GET | Выход из аккаунта |
/ask |
GET, POST | Создание вопроса (с тегами и файлами) |
/question/<id> |
GET | Детальная страница вопроса |
/question/<id>/edit |
GET, POST | Редактирование вопроса |
/question/<id>/delete |
POST | Удаление вопроса |
/question/<id>/vote |
POST | Голосование за вопрос (AJAX) |
/answer/<id>/add |
POST | Добавление ответа (с поддержкой parent_id для вложенности) |
/answer/<id>/edit |
GET, POST | Редактирование ответа |
/answer/<id>/delete |
POST | Удаление ответа |
/answer/<id>/vote |
POST | Голосование за ответ (AJAX) |
/answer/<id>/best |
POST | Отметка лучшего ответа |
/tag/<name> |
GET | Вопросы по тегу |
/tags |
GET | Интерактивная карта всех тегов |
/profile/<id> |
GET | Профиль пользователя |
/profile/edit |
GET, POST | Редактирование профиля (аватарка, никнейм, bio) |
/search |
GET | Поиск вопросов (поддерживается #тег) |
/mission |
GET | Страница «Миссия» |
/help |
GET | Страница помощи |
/rules |
GET | Правила сообщества |
/contacts |
GET | Контакты |
/uploads/<filename> |
GET | Доступ к загруженным файлам |
/api/tags/autocomplete |
GET | AJAX-автодополнение тегов |
/set_language/<lang> |
GET | Смена языка (сессия) |
- Уведомления на email
- Личные сообщения между пользователями
- Роли (модератор, админ)
- Загрузка нескольких изображений в одном ответе
- OAuth-вход (Google, VK)
- API для мобильного приложения
- Продвинутый поиск с фильтрацией по дате, автору и популярности
- Система репутации пользователей
- Экспорт вопросов и ответов в PDF
- Поддержка дополнительных языков
- Система достижений и бейджей
Проект распространяется под лицензией MIT. Подробнее см. файл LICENSE.
Стеценко Николай
Финансовый университет при Правительстве РФ
Лаборатория искусственного интеллекта
- Финансовый университет при Правительстве РФ за поддержку и хостинг
- Сообщество CareerVillage за вдохновение
⭐️ Если проект вам полезен, поставьте звезду на GitHub!