Initial Commit
This commit is contained in:
Victor Giers
453
tauri_boilerplate.sh
Executable file
453
tauri_boilerplate.sh
Executable file
@@ -0,0 +1,453 @@
|
||||
#!/bin/bash
|
||||
set -euo pipefail
|
||||
|
||||
usage() {
|
||||
echo "Usage: $0 [project-name]"
|
||||
echo "If no project name is given, you will be prompted."
|
||||
}
|
||||
|
||||
valid_name() {
|
||||
[[ "$1" =~ ^[A-Za-z0-9_-]+$ ]]
|
||||
}
|
||||
|
||||
if [[ "${1-}" == "-h" || "${1-}" == "--help" ]]; then
|
||||
usage; exit 0
|
||||
fi
|
||||
|
||||
PROJ="${1-}"
|
||||
|
||||
if [[ -n "$PROJ" ]] && ! valid_name "$PROJ"; then
|
||||
echo "Invalid project name: $PROJ (use letters, numbers, hyphen, underscore)"
|
||||
PROJ=""
|
||||
fi
|
||||
|
||||
while [[ -z "$PROJ" ]]; do
|
||||
read -r -p "Enter project name (letters, numbers, -, _ only): " PROJ
|
||||
if [[ -z "$PROJ" ]]; then
|
||||
continue
|
||||
fi
|
||||
if ! valid_name "$PROJ"; then
|
||||
echo "Invalid project name. Use letters, numbers, hyphen, underscore."
|
||||
PROJ=""
|
||||
fi
|
||||
done
|
||||
|
||||
echo ">> Creating Tauri+React+FastAPI boilerplate in '$PROJ' ..."
|
||||
|
||||
# --- Directory Structure ---
|
||||
mkdir -p "$PROJ/backend"
|
||||
mkdir -p "$PROJ/frontend"
|
||||
|
||||
# --- Backend: Python FastAPI+SQLite ---
|
||||
cat > "$PROJ/backend/requirements.txt" <<EOF
|
||||
fastapi
|
||||
uvicorn[standard]
|
||||
EOF
|
||||
|
||||
cat > "$PROJ/backend/db.py" <<EOF
|
||||
import sqlite3, os
|
||||
from datetime import datetime
|
||||
|
||||
DB_FILE = os.environ.get("WS_DB_PATH", "appdata.db")
|
||||
|
||||
def get_conn():
|
||||
conn = sqlite3.connect(DB_FILE, check_same_thread=False)
|
||||
conn.row_factory = sqlite3.Row
|
||||
return conn
|
||||
|
||||
def init_db():
|
||||
conn = get_conn()
|
||||
c = conn.cursor()
|
||||
c.execute('''
|
||||
CREATE TABLE IF NOT EXISTS likes (
|
||||
id TEXT PRIMARY KEY,
|
||||
title TEXT,
|
||||
artist TEXT,
|
||||
album TEXT,
|
||||
url TEXT,
|
||||
duration INTEGER,
|
||||
is_new INTEGER DEFAULT 1,
|
||||
last_seen TIMESTAMP
|
||||
)''')
|
||||
conn.commit()
|
||||
conn.close()
|
||||
|
||||
def get_likes(is_new=None):
|
||||
conn = get_conn()
|
||||
c = conn.cursor()
|
||||
if is_new is None:
|
||||
rows = c.execute('SELECT * FROM likes ORDER BY last_seen DESC').fetchall()
|
||||
else:
|
||||
rows = c.execute('SELECT * FROM likes WHERE is_new=? ORDER BY last_seen DESC', (1 if is_new else 0,)).fetchall()
|
||||
return [dict(row) for row in rows]
|
||||
|
||||
def add_demo_like():
|
||||
conn = get_conn()
|
||||
c = conn.cursor()
|
||||
c.execute(
|
||||
"INSERT OR IGNORE INTO likes (id, title, artist, album, url, duration, last_seen) VALUES (?, ?, ?, ?, ?, ?, ?)",
|
||||
("track1", "Test Track", "Some Artist", "Test Album", "http://test", 123, datetime.utcnow())
|
||||
)
|
||||
conn.commit()
|
||||
conn.close()
|
||||
EOF
|
||||
|
||||
cat > "$PROJ/backend/main.py" <<EOF
|
||||
from fastapi import FastAPI, WebSocket
|
||||
from fastapi.middleware.cors import CORSMiddleware
|
||||
from starlette.websockets import WebSocketDisconnect
|
||||
import db
|
||||
|
||||
app = FastAPI(title="$PROJ – React, FastAPI, SQLite, WebSocket")
|
||||
db.init_db()
|
||||
db.add_demo_like()
|
||||
|
||||
app.add_middleware(
|
||||
CORSMiddleware,
|
||||
allow_origins=["*"],
|
||||
allow_methods=["*"],
|
||||
allow_headers=["*"],
|
||||
)
|
||||
|
||||
@app.get("/likes/all")
|
||||
def api_all_likes():
|
||||
return db.get_likes()
|
||||
|
||||
@app.get("/likes/new")
|
||||
def api_new_likes():
|
||||
return db.get_likes(is_new=True)
|
||||
|
||||
# Example WebSocket endpoint (send a message on connection)
|
||||
@app.websocket("/ws")
|
||||
async def websocket_endpoint(ws: WebSocket):
|
||||
await ws.accept()
|
||||
try:
|
||||
await ws.send_json({"type": "hello", "msg": "WebSocket is live!"})
|
||||
while True:
|
||||
data = await ws.receive_text()
|
||||
await ws.send_json({"type": "echo", "data": data})
|
||||
except WebSocketDisconnect:
|
||||
# Client disconnected; exit quietly.
|
||||
pass
|
||||
except Exception:
|
||||
# Any other exception: close connection gracefully.
|
||||
await ws.close()
|
||||
EOF
|
||||
|
||||
# --- Frontend: Vite+React+ESLint+Tauri ---
|
||||
cd "$PROJ/frontend"
|
||||
CI=true npm_config_yes=true npm create vite@5.2.0 . -- --template react
|
||||
|
||||
# Patch package.json for Tauri & deps
|
||||
node -e '
|
||||
const fs = require("fs");
|
||||
const pkg = JSON.parse(fs.readFileSync("./package.json", "utf8"));
|
||||
pkg.scripts = {
|
||||
...pkg.scripts,
|
||||
tauri: "tauri",
|
||||
"tauri-dev": "tauri dev",
|
||||
"tauri-build": "tauri build"
|
||||
};
|
||||
pkg.dependencies = pkg.dependencies || {};
|
||||
pkg.devDependencies = pkg.devDependencies || {};
|
||||
pkg.dependencies.axios = pkg.dependencies.axios || "latest";
|
||||
pkg.dependencies["@tauri-apps/api"] = pkg.dependencies["@tauri-apps/api"] || "latest";
|
||||
pkg.devDependencies["@tauri-apps/cli"] = pkg.devDependencies["@tauri-apps/cli"] || "latest";
|
||||
pkg.devDependencies["eslint-plugin-react"] = pkg.devDependencies["eslint-plugin-react"] || "latest";
|
||||
fs.writeFileSync("package.json", JSON.stringify(pkg, null, 2));
|
||||
'
|
||||
|
||||
# Tauri config and Rust backend
|
||||
mkdir -p src-tauri/src
|
||||
mkdir -p src-tauri/icons
|
||||
|
||||
PROJ="$PROJ" python3 - <<'PY'
|
||||
import json, os, re, pathlib
|
||||
proj = os.environ["PROJ"]
|
||||
identifier = "com.example." + (re.sub(r"[^A-Za-z0-9]", "", proj) or "app")
|
||||
cfg = {
|
||||
"$schema": "https://schema.tauri.app/config/2",
|
||||
"productName": proj,
|
||||
"version": "0.1.0",
|
||||
"identifier": identifier,
|
||||
"build": {
|
||||
"beforeDevCommand": "npm run dev",
|
||||
"beforeBuildCommand": "npm run build",
|
||||
"devUrl": "http://localhost:5173",
|
||||
"frontendDist": "../dist",
|
||||
},
|
||||
"app": {
|
||||
"windows": [
|
||||
{
|
||||
"title": f"{proj} – React, FastAPI, SQLite, WebSocket, ESLint",
|
||||
"width": 1200,
|
||||
"height": 800,
|
||||
}
|
||||
],
|
||||
"security": {"csp": None},
|
||||
},
|
||||
"bundle": {"active": True, "targets": "all"},
|
||||
}
|
||||
pathlib.Path("src-tauri/tauri.conf.json").write_text(json.dumps(cfg, indent=2))
|
||||
PY
|
||||
|
||||
cat > src-tauri/Cargo.toml <<'EOF'
|
||||
[package]
|
||||
name = "tauri-react-fastapi-app"
|
||||
version = "0.1.0"
|
||||
description = "Tauri + React + FastAPI boilerplate"
|
||||
authors = ["You"]
|
||||
edition = "2021"
|
||||
build = "build.rs"
|
||||
|
||||
[build-dependencies]
|
||||
tauri-build = { version = "2", features = [] }
|
||||
|
||||
[dependencies]
|
||||
tauri = { version = "2", features = [] }
|
||||
serde = { version = "1", features = ["derive"] }
|
||||
serde_json = "1"
|
||||
|
||||
[features]
|
||||
default = []
|
||||
EOF
|
||||
|
||||
cat > src-tauri/build.rs <<'EOF'
|
||||
fn main() {
|
||||
tauri_build::build()
|
||||
}
|
||||
EOF
|
||||
|
||||
cat > src-tauri/src/main.rs <<'EOF'
|
||||
#![cfg_attr(not(debug_assertions), windows_subsystem = "windows")]
|
||||
|
||||
fn main() {
|
||||
tauri::Builder::default()
|
||||
.run(tauri::generate_context!())
|
||||
.expect("error while running tauri application");
|
||||
}
|
||||
EOF
|
||||
|
||||
# Minimal 32x32 RGBA icon required by Tauri bundle tooling
|
||||
python3 - <<'PY'
|
||||
import pathlib, struct, zlib
|
||||
path = pathlib.Path("src-tauri/icons/icon.png")
|
||||
path.parent.mkdir(parents=True, exist_ok=True)
|
||||
w = h = 32
|
||||
color = (48, 160, 255, 255) # rgba blue-ish
|
||||
row = bytes([0]) + bytes(color) * w # filter byte + pixels
|
||||
data = row * h
|
||||
|
||||
def chunk(t, d):
|
||||
return (struct.pack("!I", len(d)) + t + d +
|
||||
struct.pack("!I", zlib.crc32(t + d) & 0xFFFFFFFF))
|
||||
|
||||
ihdr = chunk(b'IHDR', struct.pack("!IIBBBBB", w, h, 8, 6, 0, 0, 0))
|
||||
idat = chunk(b'IDAT', zlib.compress(data, 9))
|
||||
iend = chunk(b'IEND', b'')
|
||||
png = b'\x89PNG\r\n\x1a\n' + ihdr + idat + iend
|
||||
path.write_bytes(png)
|
||||
PY
|
||||
|
||||
cd src
|
||||
|
||||
cat > App.jsx <<'EOF'
|
||||
import React, { useEffect, useState } from "react";
|
||||
import axios from "axios";
|
||||
|
||||
const API_URL = "http://localhost:8000";
|
||||
|
||||
function App() {
|
||||
const [allLikes, setAllLikes] = useState([]);
|
||||
const [wsMsg, setWsMsg] = useState("");
|
||||
const [error, setError] = useState("");
|
||||
const [wsAttempts, setWsAttempts] = useState(0);
|
||||
|
||||
useEffect(() => {
|
||||
axios.get(API_URL + "/likes/all")
|
||||
.then(res => setAllLikes(res.data))
|
||||
.catch(err => setError(err.message));
|
||||
|
||||
let socket;
|
||||
let retryTimer;
|
||||
|
||||
const connectWs = (attempt = 0) => {
|
||||
setWsAttempts(attempt + 1);
|
||||
socket = new WebSocket("ws://localhost:8000/ws");
|
||||
socket.onopen = () => {
|
||||
setError("");
|
||||
};
|
||||
socket.onmessage = e => {
|
||||
const msg = JSON.parse(e.data);
|
||||
setWsMsg(JSON.stringify(msg));
|
||||
};
|
||||
socket.onerror = () => {
|
||||
setError("WebSocket connection failed");
|
||||
};
|
||||
socket.onclose = () => {
|
||||
if (attempt < 4) {
|
||||
retryTimer = setTimeout(() => connectWs(attempt + 1), 1000 * (attempt + 1));
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
connectWs();
|
||||
|
||||
return () => {
|
||||
if (retryTimer) clearTimeout(retryTimer);
|
||||
if (socket) socket.close();
|
||||
};
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h1>React · FastAPI · SQLite · WebSocket · ESLint</h1>
|
||||
{error && <p style={{ color: "#f66" }}>Error: {error}</p>}
|
||||
<p>Likes from backend:</p>
|
||||
<ul>
|
||||
{allLikes.map(t => (
|
||||
<li key={t.id}>{t.title} – {t.artist}</li>
|
||||
))}
|
||||
</ul>
|
||||
<p>WebSocket (attempt {wsAttempts}): <code>{wsMsg}</code></p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
export default App;
|
||||
EOF
|
||||
|
||||
cat > main.jsx <<'EOF'
|
||||
import React from 'react'
|
||||
import { createRoot } from 'react-dom/client'
|
||||
import App from './App.jsx'
|
||||
|
||||
createRoot(document.getElementById('root')).render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>,
|
||||
)
|
||||
EOF
|
||||
|
||||
cat > index.css <<'EOF'
|
||||
body { font-family: sans-serif; margin: 2em; background: #202126; color: #fafafa; }
|
||||
h1 { color: #6bf; }
|
||||
EOF
|
||||
|
||||
cd ../
|
||||
|
||||
cd ../..
|
||||
|
||||
cat > "$PROJ/.gitignore" <<'EOF'
|
||||
backend/.venv
|
||||
backend/__pycache__/
|
||||
backend/appdata.db
|
||||
frontend/node_modules
|
||||
frontend/dist
|
||||
frontend/src-tauri/target
|
||||
frontend/src-tauri/gen
|
||||
frontend/src-tauri/Cargo.lock
|
||||
.DS_Store
|
||||
*.pyc
|
||||
EOF
|
||||
|
||||
cat > "$PROJ/run.sh" <<'EOF'
|
||||
#!/bin/bash
|
||||
set -euo pipefail
|
||||
|
||||
ROOT="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
|
||||
BACKEND="$ROOT/backend"
|
||||
FRONTEND="$ROOT/frontend"
|
||||
VENV="$BACKEND/.venv"
|
||||
|
||||
cleanup() {
|
||||
[[ -n "${BACK_PID:-}" ]] && kill "$BACK_PID" 2>/dev/null || true
|
||||
}
|
||||
trap cleanup EXIT INT TERM
|
||||
|
||||
echo ">> Backend: ensure venv and deps"
|
||||
python3 -m venv "$VENV"
|
||||
source "$VENV/bin/activate"
|
||||
pip install --upgrade pip
|
||||
pip install -r "$BACKEND/requirements.txt"
|
||||
|
||||
echo ">> Starting backend (uvicorn)..."
|
||||
cd "$BACKEND"
|
||||
python -m uvicorn main:app --port 8000 --reload &
|
||||
BACK_PID=$!
|
||||
|
||||
echo ">> Installing frontend deps (npm install)..."
|
||||
cd "$FRONTEND"
|
||||
npm install
|
||||
|
||||
echo ">> Launching Tauri dev (opens a window)..."
|
||||
npm run tauri-dev
|
||||
EOF
|
||||
chmod +x "$PROJ/run.sh"
|
||||
|
||||
cat > "$PROJ/README.md" <<EOF
|
||||
# $PROJ
|
||||
|
||||
## Quickstart (dev)
|
||||
|
||||
1. **Backend venv + deps**
|
||||
cd $PROJ/backend
|
||||
python3 -m venv .venv
|
||||
source .venv/bin/activate
|
||||
pip install --upgrade pip
|
||||
pip install -r requirements.txt
|
||||
|
||||
2. **Install frontend deps**
|
||||
cd ../frontend
|
||||
npm install
|
||||
|
||||
3. **Run Tauri (dev)**
|
||||
npm run tauri-dev
|
||||
|
||||
- **Alt: run both servers and Tauri via helper**
|
||||
./run.sh
|
||||
|
||||
## What this does
|
||||
|
||||
- Starts FastAPI backend (REST & WebSocket, SQLite)
|
||||
- Starts React+Vite dev server (auto-reloads)
|
||||
- Opens Tauri window
|
||||
- React frontend talks to backend via HTTP+WebSocket
|
||||
|
||||
## Production-ish build
|
||||
|
||||
1. cd frontend
|
||||
2. npm run build
|
||||
3. npm run tauri-build
|
||||
|
||||
(Tauri will bundle the built frontend from dist/)
|
||||
|
||||
## WebSocket
|
||||
|
||||
Check out App.jsx and main.py for example WS code.
|
||||
|
||||
EOF
|
||||
|
||||
echo ">> Creating Python venv and installing backend requirements..."
|
||||
cd "$PROJ/backend"
|
||||
python3 -m venv .venv
|
||||
source .venv/bin/activate
|
||||
pip install --upgrade pip
|
||||
pip install -r requirements.txt
|
||||
deactivate
|
||||
|
||||
echo ">> Installing frontend npm dependencies..."
|
||||
cd ../frontend
|
||||
npm install
|
||||
echo ">> All dependencies installed."
|
||||
cd ../..
|
||||
|
||||
echo ">> Boilerplate created at '$PROJ'. See $PROJ/README.md for next steps."
|
||||
|
||||
echo ">> Launching Tauri app..."
|
||||
cd "$PROJ/backend"
|
||||
source .venv/bin/activate
|
||||
python -m uvicorn main:app --port 8000 --reload &
|
||||
BACK_PID=$!
|
||||
trap 'kill $BACK_PID 2>/dev/null || true' EXIT
|
||||
cd ../frontend
|
||||
npm run tauri-dev
|
||||
Reference in New Issue
Block a user