{"id":29416953,"url":"https://github.com/w1llow1sp/multibit-angular","last_synced_at":"2026-05-20T14:35:23.145Z","repository":{"id":303837891,"uuid":"1016752818","full_name":"w1llow1sp/multibit-angular","owner":"w1llow1sp","description":"Туду лист (тестовое задание)","archived":false,"fork":false,"pushed_at":"2025-07-09T16:24:23.000Z","size":156,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-07-10T01:20:57.078Z","etag":null,"topics":["angular","crud","rxjs","tslib"],"latest_commit_sha":null,"homepage":"https://multibit-angular.onrender.com","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/w1llow1sp.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-07-09T13:23:42.000Z","updated_at":"2025-07-09T16:24:27.000Z","dependencies_parsed_at":"2025-07-10T01:21:03.494Z","dependency_job_id":"17575fb3-81a1-4d5d-bef7-125e716ed53b","html_url":"https://github.com/w1llow1sp/multibit-angular","commit_stats":null,"previous_names":["w1llow1sp/multibit-angular"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/w1llow1sp/multibit-angular","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/w1llow1sp%2Fmultibit-angular","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/w1llow1sp%2Fmultibit-angular/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/w1llow1sp%2Fmultibit-angular/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/w1llow1sp%2Fmultibit-angular/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/w1llow1sp","download_url":"https://codeload.github.com/w1llow1sp/multibit-angular/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/w1llow1sp%2Fmultibit-angular/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264890087,"owners_count":23678833,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","crud","rxjs","tslib"],"created_at":"2025-07-11T20:08:22.678Z","updated_at":"2026-05-20T14:35:23.054Z","avatar_url":"https://github.com/w1llow1sp.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Мини-приложение \"Список задач\" (ToDo)\n\nСовременное Angular-приложение для управления задачами с продвинутыми возможностями, уведомлениями и аналитикой.\n\n## 🌐 Демо\n\n**🔗 Живое приложение:** [https://multibit-angular.onrender.com](https://multibit-angular.onrender.com)\n\n## 🚀 Технологии\n\n- **Angular 18+** (CLI-проект, Standalone Components)\n- **TypeScript** (Strict Mode)\n- **HTML + CSS** (Адаптивный дизайн)\n- **RxJS** для реактивного программирования\n- **Angular Router** для навигации\n- **Angular Forms** (Template-driven)\n- **localStorage** для персистентности данных\n\n## 📋 Функциональность\n\n### 📄 Главная страница (`/tasks`)\n- ✅ Список задач с полями: `title`, `description`, `status`\n- ✅ Кнопка \"Добавить задачу\" (открывает форму)\n- ✅ Кнопка \"Удалить\" для каждой задачи с подтверждением\n- ✅ Кнопка \"Подробнее\" → переход на `/tasks/:id`\n- ✅ **Расширенный поиск и фильтрация** задач\n- ✅ **Сортировка** по дате создания/обновления/названию/статусу\n- ✅ **Skeleton Loader** для плавной загрузки\n- ✅ **Уведомления** о действиях пользователя\n\n### ➕ Добавление задачи\n- ✅ Форма с **валидацией** (title — обязательно, description — необязательно)\n- ✅ Статус задачи по умолчанию: \"К выполнению\"\n- ✅ **Счетчик символов** с индикацией лимитов\n- ✅ **Горячие клавиши** (Ctrl+Enter для сохранения, Escape для отмены)\n- ✅ **Toast-уведомления** об успехе/ошибках\n\n### 🔍 Страница задачи (`/tasks/:id`)\n- ✅ Полная информация о задаче с **красивым дизайном**\n- ✅ Кнопка \"Назад\" → возврат к списку\n- ✅ **Inline редактирование** задачи\n- ✅ **Быстрое изменение статуса** через выпадающий список\n- ✅ **Умное отображение дат** на русском языке\n- ✅ **Хлебные крошки** для навигации\n- ✅ **Горячие клавиши** для управления\n\n## 🛠 Архитектура\n\n### Компоненты\n- **TaskListComponent** - главная страница со списком задач\n- **TaskDetailComponent** - детальная страница задачи  \n- **AddTaskComponent** - форма добавления новой задачи\n- **IconComponent** - переиспользуемый компонент иконок (20+ иконок)\n- **SearchFilterComponent** - продвинутый поиск и фильтрация\n- **LoadingSkeletonComponent** - красивые состояния загрузки (9 типов)\n\n### Сервисы\n- **TaskService** - улучшенный сервис для работы с задачами\n  - ✅ **CRUD операции** с `OperationResult\u003cT\u003e`\n  - ✅ **Кеширование** для производительности\n  - ✅ **Уведомления** о действиях\n  - ✅ **Расширенная статистика** и аналитика\n  - ✅ **Автосохранение** каждые 30 секунд\n  - ✅ **Фильтрация и сортировка** задач\n  - ✅ **Импорт/экспорт** данных\n  - ✅ **Обработка ошибок** с fallback\n\n### Пайпы\n- **RussianDatePipe** - интеллектуальное форматирование дат\n  - ✅ **Относительное время** (\"2 часа назад\", \"вчера\")\n  - ✅ **Кеширование** результатов\n  - ✅ **Временные зоны** и кастомные форматы\n  - ✅ **7 форматов**: relative, short, medium, full, time, date-only, iso, custom\n  - ✅ **Fallback** для старых браузеров\n\n### Модели\n- **Task** interface - структура задачи\n- **TaskStatus** enum - статусы задач  \n- **CreateTaskDto**, **UpdateTaskDto** - DTO для операций\n- **OperationResult\u003cT\u003e** - типизированные результаты операций\n- **TaskStatistics** - расширенная статистика\n\n## 🎨 Дополнительные возможности\n\n- 🔍 **Умный поиск** по названию и описанию с предложениями\n- 🎛 **Продвинутая фильтрация** по статусу, дате, быстрые фильтры\n- 📊 **Гибкая сортировка** по различным критериям с сохранением состояния\n- 📱 **Полностью адаптивный дизайн** для всех устройств\n- 🎭 **Плавные анимации** и переходы между состояниями\n- 🎹 **Горячие клавиши** для быстрого управления\n- 🔄 **Skeleton Loading** для улучшенного UX\n- 🎯 **Полная Accessibility** (ARIA-атрибуты, клавиатурная навигация)\n- 📅 **Интеллектуальные даты** на русском языке\n- 💾 **Автосохранение** и бэкапы в localStorage\n- 🎲 **Демо-данные** для быстрого старта\n- 🔔 **Toast-уведомления** о всех действиях\n- 📈 **Детальная статистика** выполнения задач\n- 🎨 **Цветовое кодирование** статусов задач\n- 🔄 **Офлайн поддержка** через localStorage\n\n## 🚀 Установка и запуск\n\n### Предварительные требования\n- **Node.js** (версия 18+)\n- **npm** или **yarn**\n- **Angular CLI** (опционально)\n\n### Клонирование репозитория\n```bash\ngit clone https://github.com/w1llow1sp/multibit-angular.git\ncd multibit-angular\n```\n\n### Установка зависимостей\n```bash\nnpm install\n```\n\n### Запуск в режиме разработки\n```bash\nnpm start\n# или\nng serve\n```\n\nПриложение будет доступно по адресу: `http://localhost:4200/`\n\n### Сборка для продакшена\n```bash\nnpm run build:prod\n# или  \nng build --configuration production\n```\n\nФайлы будут собраны в папку `dist/my-app/browser/`\n\n## 🌐 Деплой\n\n### Автоматический деплой на Render\nПроект настроен для автоматического деплоя на **Render.com**:\n\n- **Build Command:** `npm run build:prod`\n- **Publish Directory:** `dist/my-app/browser`\n- **Auto-Deploy:** включен для ветки `main`\n\n### Деплой на другие платформы\n```bash\n# Netlify/Vercel\nnpm run build:prod\n# Загрузите содержимое dist/my-app/browser/\n\n# GitHub Pages (с Angular CLI)\nng deploy --base-href=\"/repository-name/\"\n```\n\n## 📁 Структура проекта\n\n```\nsrc/app/\n├── components/                  # Основные компоненты\n│   ├── task-list/              # Список задач + фильтрация\n│   ├── task-detail/            # Детали задачи + редактирование  \n│   └── add-task/               # Форма добавления + валидация\n├── shared/                     # Общие модули\n│   ├── components/             # Переиспользуемые компоненты\n│   │   ├── icon/               # Компонент иконок (20+ иконок)\n│   │   ├── search-filter/      # Продвинутая фильтрация\n│   │   └── loading-skeleton/   # Skeleton Loading (9 типов)\n│   ├── models/                 # Модели данных + типы\n│   ├── services/               # Сервисы + результаты операций\n│   └── pipes/                  # Пайпы + форматирование дат\n├── app.routes.ts              # Маршрутизация (Lazy Loading)\n├── app.component.*            # Корневой компонент\n└── main.ts                    # Точка входа\n```\n\n## 🧪 Тестирование\n\n### Запуск unit-тестов\n```bash\nnpm test\n# или\nng test\n```\n\n### Запуск e2e-тестов\n```bash\nnpm run e2e\n# или\nng e2e\n```\n\n### Проверка типов TypeScript\n```bash\nnpx tsc --noEmit\n```\n\n## 📝 Использование\n\n1. **Просмотр задач**: Откройте главную страницу для просмотра списка\n2. **Добавление**: Нажмите \"Добавить задачу\" и заполните форму\n3. **Поиск**: Используйте умный поиск с предложениями\n4. **Фильтрация**: Выберите статус, период или быстрые фильтры\n5. **Детали**: Нажмите \"Подробнее\" для просмотра полной информации\n6. **Редактирование**: На странице деталей нажмите \"Редактировать\" (Ctrl+E)\n7. **Статус**: Быстро меняйте статус через выпадающий список\n8. **Демо-данные**: Приложение автоматически загружает примеры при первом запуске\n\n### Горячие клавиши\n- **Ctrl+E** - Начать редактирование\n- **Ctrl+S** - Сохранить изменения  \n- **Ctrl+Enter** - Отправить форму\n- **Escape** - Отменить действие/вернуться назад\n\n## 🎯 Производительность\n\n- **Lazy Loading** модулей для быстрой загрузки\n- **OnPush Change Detection** для оптимизации\n- **Кеширование** данных и результатов вычислений\n- **Debounced Search** для экономии ресурсов\n- **Virtual Scrolling** готов для больших списков\n- **Gzip сжатие** статических файлов\n\n## 🤝 Разработка\n\nПроект использует современные подходы Angular:\n- **Standalone Components** - без NgModules\n- **Lazy Loading** - для оптимизации загрузки\n- **OnPush Change Detection** - для производительности\n- **TypeScript Strict Mode** - для безопасности типов\n- **Angular Style Guide** - для структуры кода\n- **RxJS Best Practices** - для реактивного программирования\n\n## 🔧 Технические особенности\n\n- **Angular 18+** с новейшими возможностями\n- **Строгая типизация** TypeScript\n- **Реактивные формы** с валидацией\n- **Observable-based** архитектура\n- **Error Boundaries** для обработки ошибок\n- **Progressive Enhancement** для доступности\n\n## 📊 Метрики\n\n- **Bundle Size**: ~280KB (gzipped ~79KB)\n- **Performance Score**: 95+ (Lighthouse)\n- **Accessibility Score**: 100 (Lighthouse) \n- **Best Practices**: 100 (Lighthouse)\n- **TypeScript Coverage**: 100%\n\n## 📜 Лицензия\n\nMIT License - свободное использование для образовательных и коммерческих целей.\n\n## 👥 Контрибьютинг\n\n1. Fork репозитория\n2. Создайте feature branch (`git checkout -b feature/AmazingFeature`)\n3. Commit изменения (`git commit -m 'Add some AmazingFeature'`)\n4. Push в branch (`git push origin feature/AmazingFeature`)\n5. Откройте Pull Request\n\n---\n\n*Современное Angular-приложение, демонстрирующее лучшие практики разработки 2024 года*\n\n**🔗 Live Demo:** [https://multibit-angular.onrender.com](https://multibit-angular.onrender.com)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fw1llow1sp%2Fmultibit-angular","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fw1llow1sp%2Fmultibit-angular","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fw1llow1sp%2Fmultibit-angular/lists"}