AI Stack – адаптивный шаблон Angular 20 для IT-агентств и личных портфолио.

AI Stack – адаптивный шаблон Angular 20 для IT-агентств и личных портфолио.

• Демонстрация: https://portfolio.deepbase.in/
• Ссылка на онлайн-документацию: https://docs.deepbase.in/upgrade.html

Описание:

AI Stack — это чистый и элегантный шаблон портфолио на Angular 20, созданный для:

• ИТ-стартапы
• Разработчики
• Дизайнеры
• Фрилансеры и агентства

Созданный с использованием новейших технологий Angular CLI и веб-технологий, AI Stack обеспечивает плавный пользовательский интерфейс, высокую производительность, адаптивность для мобильных устройств и возможности PWA. Он идеально подходит для демонстрации личных проектов, портфолио или услуг с помощью современных анимаций и вариантов компоновки.

✅ Ключевые технологии и особенности

• Angular 20 – современный SPA-фреймворк для создания быстрых и масштабируемых приложений.
• Поддержка Angular PWA – встроенные функции прогрессивных веб-приложений для работы в автономном режиме и поведения, аналогичного обычному приложению.
• Bootstrap 5.3.3 – адаптивный дизайн и современные компоненты пользовательского интерфейса.
• Bootstrap Icons 1.11.3 – Чистые и масштабируемые иконки для UI/UX.
• AOS 2.3.4 (Анимация при прокрутке) – Плавная и настраиваемая анимация прокрутки.
• Swiper 11.1.15 – Слайдеры и карусели, адаптированные для мобильных устройств и поддерживающие сенсорное управление.
• Ngx-Owl-Carousel-O 18.0.0 – Библиотека каруселей для адаптивных слайдеров.
• GLightbox 3.3.0 – Красивый лайтбокс для изображений и видео.
• Isotope Layout 3.0.6 – Фильтруемые и анимированные макеты сетки.
• ImagesLoaded 5.0.0 – Гарантирует полную загрузку изображений перед отрисовкой макета.
• jQuery 3.7.1 – Расширенные возможности манипулирования DOM (опционально, но поддерживается).
• Express 4.18.2 – Интеграция с бэкэндом или обработка API (опционально).
• RxJS 7.8.0 – Реактивное программирование для управления данными в Angular.
• Zone.js 0.15.1 – вспомогательный инструмент Angular для асинхронного отслеживания и обнаружения изменений.
• TSLib 2.3.0 – Библиотека времени выполнения для вспомогательных функций TypeScript.
• Эффект пишущей машинки 2.21.0 – Динамическая анимированная печать для креативных текстовых заголовков.
• Capacitor 7.0.1 – Беспроблемное развертывание мобильных приложений для Android и iOS.
• Полностью адаптивный дизайн – оптимизированная компоновка для мобильных устройств, планшетов и настольных компьютеров.
• SEO-оптимизация – Чистая структура и обработка метаданных для лучшей индексации.
• Современный UI/UX — привлекательный, минималистичный и быстро загружающийся дизайн.

Настройка разработки

В вашем файле package.json содержится:

Скрипты Angular CLI

"scripts": { "ng": "ng", "start": "ng submit", "build": "ng build", "watch": "ng build --watch --configuration development", "test": "ng test"}

Инструменты разработчика

• @angular-devkit/build-angular : ^19.0.2
• @angular/compiler-cli : ^19.0.2
• TypeScript : ~5.8.3
• Тестирование : Jasmine, Karma, Chrome Launcher
• Capacitor CLI : ^7.0.1 для поддержки нативной платформы

Готовность к использованию на мобильных и нативных платформах

• @capacitor/angular : ^2.0.3
• @capacitor/android , @capacitor/ios , @capacitor/core : ^7.0.1
• Легко развертывается как нативное приложение с поддержкой Capacitor для Android/iOS.

Документация включает в себя:

• Настройка и установка (Angular CLI и Node)
• Как включить и настроить PWA
• Настройка карусели, галереи и анимации
• Рекомендации по адаптивному поведению и развертыванию
• Часто задаваемые вопросы и известные проблемы

Changelog