https://github.com/phantomstudios/folder-stack
A fullstack app to show the images within a local folder in a vertical list.
https://github.com/phantomstudios/folder-stack
nextjs node react
Last synced: 8 months ago
JSON representation
A fullstack app to show the images within a local folder in a vertical list.
- Host: GitHub
- URL: https://github.com/phantomstudios/folder-stack
- Owner: phantomstudios
- License: mit
- Archived: true
- Created: 2022-10-09T00:09:29.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2024-12-17T23:55:55.000Z (about 1 year ago)
- Last Synced: 2025-05-21T12:17:43.070Z (9 months ago)
- Topics: nextjs, node, react
- Language: TypeScript
- Homepage:
- Size: 4.33 MB
- Stars: 16
- Watchers: 1
- Forks: 1
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
## IMPORTANT NOTE: THIS REPOSITORY IS BEING DEPRECATED, PLEASE REACH OUT TO US [ON EMAIL](mailto:josua@phantom.agency) IF YOU WISH TO TAKE THIS REPOSITORY OVER.
Folder Stack
A slick way to watch folders on big screens.
This is a small [Next.js](https://nextjs.org/) fullstack app that allows you to specify a local folder of images (PNGs) to watch, and an accompanying frontend application displaying these images in a simple yet elegant vertical list.
## Getting Started
First, clone the repository and install the dependencies:
```bash
npm i
```
Then, run the development server:
```bash
npm run dev
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
## Configuration
You can configure a few things by editing the file `src/config/index.ts`.
- `ROOT_DIRECTORY` - The directory to watch. Can be absolute or relative to the project root.
- `RECURSIVE` - Should we scan recursively within folders.
- `MAX_IMAGES` - How many images to request.
- `POLL_INTERVAL` - How often should the frontend look for updates.
- `FILE_EXTENSIONS` - An array of filetypes supported, e.g. `["png", "jpg"]`.
- `SHOW_TITLE` - If the title should be overlaid.
- `DISABLE_SCROLL` - Should scrolling be blocked?
- `STACK_STYLE` - How the image stack should be transformed on the page using regular `CSSProperties`.