https://github.com/premieroctet/access-log-ui
A modern UI for viewing and analyzing access logs with powerful filtering and search capabilities.
https://github.com/premieroctet/access-log-ui
Last synced: 2 months ago
JSON representation
A modern UI for viewing and analyzing access logs with powerful filtering and search capabilities.
- Host: GitHub
- URL: https://github.com/premieroctet/access-log-ui
- Owner: premieroctet
- License: mit
- Created: 2025-02-28T12:34:42.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2025-03-05T16:48:22.000Z (7 months ago)
- Last Synced: 2025-03-21T11:02:54.652Z (7 months ago)
- Language: TypeScript
- Homepage:
- Size: 2.93 MB
- Stars: 2
- Watchers: 0
- Forks: 0
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# Access Log UI
A modern UI for viewing and analyzing access logs with powerful filtering and search capabilities.
This is a fork of the amazing https://github.com/openstatusHQ/data-table-filters with support for reading an access log file (in JSON format for now).
## Built With
- [nextjs](https://nextjs.org)
- [tanstack-query](https://tanstack.com/query/latest)
- [tanstack-table](https://tanstack.com/table/latest)
- [shadcn/ui](https://ui.shadcn.com)
- [cmdk](http://cmdk.paco.me)
- [nuqs](http://nuqs.47ng.com)
- [dnd-kit](https://dndkit.com)
## Getting Started
You can configure this project using .env file
```
USE_MOCK_DATA=false
LOG_FILE_PATH=./logs/access.log
```
and to run the project in development mode:
```bash
yarn dev
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
## For Coolify
To use this project with Coolify, you have to follow these steps:
1. Update your traefik proxy configuration to add access logs :
```
- '--accesslog.filepath=/traefik/logs/access.log'
- '--accesslog.format=json'
- '--accesslog.bufferingsize=100'
- '--accesslog.fields.headers.defaultmode=drop'
- '--accesslog.fields.headers.names.User-Agent=keep'
```
2. Configure a volume storage to share the access log file with the container :
**Source path** : `/data/coolify/proxy/logs`
**Destination path** : `/app/logs`
## Credits
- [openstatusHQ](https://github.com/openstatusHQ) for the amazing data table filters example