muken
81c12ace7b
- Generate thumbnail (150px), medium (800px), full size on upload - OptimizedImage component with Intersection Observer lazy loading - Blur placeholder while loading - Fetches appropriate size based on props (thumbnail/medium/full) - Async image loading reduces initial page load time - Added medium and thumbnail columns to images table
la-huasca-ts
TypeScript + Next.js version of La Huasca.
A minimal Next.js 14+ App Router scaffold using TypeScript, with @chenglou/pretext installed. The landing page demonstrates a Pretext-based text measurement in a client component (src/components/MeasuredText.tsx).
Getting started
npm install
npm run dev
Open http://localhost:3000.
Project structure
package.json
next.config.js
tsconfig.json
src/app/layout.tsx
src/app/page.tsx
src/app/login/page.tsx
src/app/admin/page.tsx
src/app/user/page.tsx
src/app/api/...
src/components/Navbar.tsx
src/components/MeasuredText.tsx
src/lib/db.ts
src/lib/schema.ts
src/lib/auth.ts
deploy-db.sh
README.md
Database
The app connects to a PostgreSQL database using the DATABASE_URL environment variable.
Kubernetes runtime uses:
- namespace:
lahuasca - Postgres: 15, PVC-backed
- app secrets:
calendar-db-secrets, keyurl - ingress: Traefik on
lahuasca.com
Initialize the database schema and seed data
There are several ways to initialize the database depending on your environment:
Option 1: Using the init-db.sh script (for direct server access)
If you have direct access to the Kubernetes cluster, you can use the init-db.sh script:
./init-db.sh
This script will automatically detect the postgres pod and initialize the database with all required tables and seed data.
Option 2: Using the Kubernetes job (recommended for production)
To initialize the database using a Kubernetes job:
kubectl apply -f k8s/init-db-job.yaml
You can monitor the job status with:
kubectl get jobs -n lahuasca
kubectl get pods -n lahuasca | grep init-database
To view the job logs:
kubectl logs -n lahuasca -l job-name=init-database
Once the job completes successfully, you can remove it:
kubectl delete job init-database -n lahuasca
Option 3: Using the API endpoint (development only)
Note: This method only works in development mode and is disabled in production.
Start the dev server and call:
curl -X POST http://localhost:3000/api/db/init
To reset everything (drops and recreates tables with seed data):
curl -X POST "http://localhost:3000/api/db/init?reset=true"
Note: database initialization is blocked in production. Use reset=true only if you actually want schema reinitialization.
Authentication
The app includes JWT-based session authentication backed by the database. Demo accounts are seeded automatically:
admin/admin→ Admin portal (/admin)user/user→ User portal (/user)
The Login / Logout control lives in the Navbar.
Admin portal
Visit /admin after logging in as admin to upload images. Images are previewed in a gallery and can be deleted individually. Uploaded images are now persisted in PostgreSQL.
User portal
Visit /user after logging in as user to see a member portal with reservations, discount coupons, offers, the WiFi password, and a list of benefits.