SignPeek ✅

SignPeek ✅
signpeek.niaros.dev
Вигляд:
SignPeek — швидкий вебзастосунок для миттєвого перегляду електронно підписаних документів та роботи з криптографічними контейнерами безпосередньо у браузері. Він дозволяє відкрити файл, переглянути його структуру та підписи, отримати інформацію про сертифікати й одразу переглянути вкладені документи без завантаження файлів на сервер.
Репозиторій
Демо-сторінка

Можливості

✔Підтримка електронних підписів: Робота з бінарними підписами CAdES (`.p7s`, `.p7m`) та XML-підписами XAdES.
✔Аналіз сертифікатів: Вилучення інформації про підписувача, організацію, центр сертифікації та термін дії сертифіката з ASN.1-структур.
✔Перегляд контейнерів: Відображення підписаного контейнера та його вкладених файлів в інтерактивному ієрархічному дереві.
✔Рекурсивна розпаковка: Підтримка вкладених контейнерів та архівів, зокрема підписаних контейнерів усередині ZIP-архівів.
✔Підтримка ASiC: Робота з ASiC-E та ASiC-S — форматами підписаних контейнерів, що використовуються в українських та європейських системах електронного підпису.
✔Розумний експорт: Можливість завантажити окремий файл із контейнера або експортувати весь його вміст у новий ZIP-архів.
✔Перегляд документів: Відображення PDF, Word (`.docx`) та табличних файлів (`.xls`, `.xlsx`, `.csv`) безпосередньо у браузері.
✔Перегляд зображень: Підтримка поширених форматів зображень, а також HEIC та TIFF.
✔Інтерактивні переглядачі: Масштабування, панорамування, поворот сторінок та інші елементи керування.
✔Drag & Drop: Швидке відкриття файлів перетягуванням безпосередньо у застосунок.
✔Локальна обробка: Файли обробляються на пристрої користувача та не передаються на backend.
✔Адаптивний інтерфейс: Інтерфейс пристосований до настільних та мобільних екранів.
✔PWA: Застосунок підтримує Progressive Web App та може встановлюватися як окремий застосунок.

Використані технології

React
Vite
TailwindCSS
JavaScript
GitHub Pages

Структура проєкту

SignPeek/
├── 📁 public/                   # Статичні ресурси та публічні файли
├── 📁 src/                      # Вихідний код застосунку
│   ├── 📁 components/           # UI та компоненти застосунку
│   ├── 📁 hooks/                # Кастомні React hooks
│   ├── 📁 utils/                # Утиліти для роботи з файлами та криптографією
│   ├── 📄 App.jsx               # Головний компонент застосунку
│   ├── 📄 global.css            # Глобальні стилі
│   └── 📄 main.jsx              # Точка входу застосунку
├── 📄 index.html                # HTML-точка входу
├── 📄 eslint.config.js          # Конфігурація ESLint
├── 📄 package.json              # Залежності та скрипти
├── 📄 pnpm-lock.yaml            # Lock-файл залежностей
├── 📄 pnpm-workspace.yaml       # Конфігурація pnpm workspace
└── 📄 vite.config.js            # Конфігурація Vite