Migrate server to TypeScript and add React + Tailwind UI #2

Merged

Copilot merged 4 commits from copilot/refactor-app-to-typescript into master

2026-04-30 12:01:34 +03:00

Copilot commented

2026-04-30 12:00:50 +03:00

(Migrated from github.com)

Refactor the app to use TypeScript across the server and replace the inline HTML UI with a React + Tailwind frontend. This modernizes the stack while keeping the existing upload workflow intact.

Server (TypeScript + build pipeline)
- Replace server.js with src/server.ts, add TS build output to dist/, and update scripts to build/run the compiled server.
- Keep upload behavior, validation, and security checks intact, now fully typed.
Client (React + Tailwind)
- Add a Vite React TypeScript app with a Tailwind-based upload form and status UI.
- Serve the built client from Express and proxy /upload during local dev.
Docs & project structure
- Update README to describe the new build/development flow and client setup.
- Add appropriate ignores for build outputs.

Example (typed upload handler):

app.post(
  '/upload',
  uploadRateLimiter,
  requirePassword,
  loadUploadDir,
  upload.single('file'),
  (req, res) => {
    if (!req.file) {
      return res.status(400).json({ error: 'No file uploaded.' })
    }
    const relativePath = req.uploadBasePath
      ? path.relative(req.uploadBasePath, req.file.path)
      : req.file.filename
    return res.json({ message: `Uploaded ${req.file.originalname}.`, storedAs: relativePath })
  },
)

Refactor the app to use TypeScript across the server and replace the inline HTML UI with a React + Tailwind frontend. This modernizes the stack while keeping the existing upload workflow intact. - **Server (TypeScript + build pipeline)** - Replace `server.js` with `src/server.ts`, add TS build output to `dist/`, and update scripts to build/run the compiled server. - Keep upload behavior, validation, and security checks intact, now fully typed. - **Client (React + Tailwind)** - Add a Vite React TypeScript app with a Tailwind-based upload form and status UI. - Serve the built client from Express and proxy `/upload` during local dev. - **Docs & project structure** - Update README to describe the new build/development flow and client setup. - Add appropriate ignores for build outputs. Example (typed upload handler): ```ts app.post( '/upload', uploadRateLimiter, requirePassword, loadUploadDir, upload.single('file'), (req, res) => { if (!req.file) { return res.status(400).json({ error: 'No file uploaded.' }) } const relativePath = req.uploadBasePath ? path.relative(req.uploadBasePath, req.file.path) : req.file.filename return res.json({ message: `Uploaded ${req.file.originalname}.`, storedAs: relativePath }) }, ) ```