Greg/readingtracker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update with all the necessary files for nixpack

Browse Source
This commit is contained in:
Greg 2025-08-17 00:33:16 +02:00
parent 7bb78ad89d
commit 7b98d2c894
12 changed files with 159 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
.gitignore vendored Normal file
View File

@ -0,0 +1,10 @@
node_modules
dist
.env
.DS_Store
.vscode
.idea
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*

30
README.md
View File

@ -1 +1,29 @@
Reading tracker app # Reading Goal App
A React + Vite + Tailwind single-page app. Dates are DD/MM/YYYY everywhere and the calendar starts on Monday.
## Local Development
```bash
npm install
npm run dev
```
## Production Build
```bash
npm run build
npm run preview
```
## Deploy with Coolify (Nixpacks)
1. Push this repo to GitHub.
2. In Coolify: **Create Application → Git**, select your repo/branch.
3. **Build Pack**: choose **Nixpacks**.
4. No base directory unless you're using a monorepo.
5. (Optional) **Environment**: set `NODE_ENV=production`.
6. Deploy. The container will:
- install dependencies
- build with `vite build` (output in `dist/`)
- run `serve -s dist -l $PORT` (Coolify injects `$PORT`)

12
index.html Normal file
View File

@ -0,0 +1,12 @@
<!doctype html>
<html lang="en-GB">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Reading Goal App</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

11
nixpacks.toml Normal file
View File

@ -0,0 +1,11 @@
[phases.setup]
nixPkgs = ["nodejs_20", "corepack"]
[phases.install]
cmds = ["npm ci || npm install"]
[phases.build]
cmds = ["npm run build"]
[start]
cmd = "npm run start"

28
package.json Normal file
View File

@ -0,0 +1,28 @@
{
"name": "reading-goal-app",
"version": "1.0.0",
"private": true,
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview --host 0.0.0.0 --port 5173",
"start": "serve -s dist -l ${PORT:-3000}"
},
"dependencies": {
"lucide-react": "^0.452.0",
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {
"@types/react": "^18.2.45",
"@types/react-dom": "^18.2.18",
"@vitejs/plugin-react": "^4.2.0",
"autoprefixer": "^10.4.18",
"postcss": "^8.4.33",
"serve": "^14.2.1",
"tailwindcss": "^3.4.9",
"typescript": "^5.5.4",
"vite": "^5.3.4"
}
}

6
postcss.config.cjs Normal file
View File

@ -0,0 +1,6 @@
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {}
}
}

7
reading_tracker.jsx → src/App.tsx
View File

@ -1,3 +1,4 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { BookOpen, Plus, X, Edit2, Check, ChevronLeft, ChevronRight } from 'lucide-react'; import { BookOpen, Plus, X, Edit2, Check, ChevronLeft, ChevronRight } from 'lucide-react';
@ -465,9 +466,7 @@ const ReadingGoalApp = () => {
<p className="text-sm text-gray-600">{safeAuthor}</p> <p className="text-sm text-gray-600">{safeAuthor}</p>
</div> </div>
<div <div
className={`px-2 py-1 rounded text-xs font-medium ${ className={`px-2 py-1 rounded text-xs font-medium ${progressPercent >= 100 ? 'bg-green-100 text-green-700' : 'bg-blue-100 text-blue-700'}`}
progressPercent >= 100 ? 'bg-green-100 text-green-700' : 'bg-blue-100 text-blue-700'
}`}
> >
{progressPercent >= 100 ? 'Completed' : `${goal.daysRemaining} days left`} {progressPercent >= 100 ? 'Completed' : `${goal.daysRemaining} days left`}
</div> </div>
@ -599,7 +598,7 @@ const ReadingGoalApp = () => {
<h3 className="font-semibold mb-3">Progress Overview</h3> <h3 className="font-semibold mb-3">Progress Overview</h3>
<div className="space-y-3"> <div className="space-y-3">
<div className="flex justify-between"><span className="text-gray-600">Current Progress</span><span className="font-medium">{book.currentPage} / {book.totalPages} pages</span></div> <div className="flex justify-between"><span className="text-gray-600">Current Progress</span><span className="font-medium">{book.currentPage} / {book.totalPages} pages</span></div>
<div className="w-full bg-gray-200 rounded-full h-3"><div className="bg-blue-500 h-3 rounded-full transition-all" style={{ width: `${Math.min(progressPercent, 100)}%` }} /></div> <div className="w.full bg-gray-200 rounded-full h-3"><div className="bg-blue-500 h-3 rounded-full transition-all" style={{ width: `${Math.min(progressPercent, 100)}%` }} /></div>
<div className="flex justify-between"><span className="text-gray-600">Completion</span><span className="font-medium">{progressPercent.toFixed(1)}%</span></div> <div className="flex justify-between"><span className="text-gray-600">Completion</span><span className="font-medium">{progressPercent.toFixed(1)}%</span></div>
</div> </div>
</div> </div>

11
src/index.css Normal file
View File

@ -0,0 +1,11 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
/* App-wide base styles */
html, body, #root {
height: 100%;
}
body {
margin: 0;
}

10
src/main.tsx Normal file
View File

@ -0,0 +1,10 @@
import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App'
import './index.css'
ReactDOM.createRoot(document.getElementById('root')!).render(
<React.StrictMode>
<App />
</React.StrictMode>
)

6
tailwind.config.cjs Normal file
View File

@ -0,0 +1,6 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ['./index.html', './src/**/*.{ts,tsx,js,jsx}'],
theme: { extend: {} },
plugins: []
}

27
tsconfig.json Normal file
View File

@ -0,0 +1,27 @@
{
"compilerOptions": {
"target": "ES2020",
"useDefineForClassFields": true,
"lib": [
"ES2020",
"DOM",
"DOM.Iterable"
],
"types": [
"vite/client",
"react",
"react-dom"
],
"module": "ESNext",
"skipLibCheck": true,
"moduleResolution": "bundler",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx",
"strict": true
},
"include": [
"src"
]
}

6
vite.config.ts Normal file
View File

@ -0,0 +1,6 @@
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
export default defineConfig({
plugins: [react()]
})