feat: Transform to Tauri desktop app

- Initialize Tauri v2 project with Rust backend
- Restructure project: move source files to src/ directory
- Add Tauri configuration for Windows, macOS, and Linux builds
- Update Vite config for Tauri development workflow
- Add file system and dialog permissions for native features
- Update package.json with desktop build scripts
- Update tsconfig.json paths for new src structure
- Add Tauri and desktop badges to README
- Document desktop build process and architecture
This commit is contained in:
TypoGenie
2026-01-29 18:28:35 +02:00
parent ae5ce9d243
commit 2c22b0fce6
51 changed files with 7556 additions and 58 deletions

View File

@@ -18,6 +18,11 @@
<img src="https://img.shields.io/badge/TypeScript-5.8-3178C6?style=for-the-badge&logo=typescript&logoColor=white" alt="TypeScript" />
<img src="https://img.shields.io/badge/Vite-6-646CFF?style=for-the-badge&logo=vite&logoColor=white" alt="Vite" />
<img src="https://img.shields.io/badge/Tailwind-3-06B6D4?style=for-the-badge&logo=tailwindcss&logoColor=white" alt="Tailwind" />
<img src="https://img.shields.io/badge/Tauri-2-24C8D8?style=for-the-badge&logo=tauri&logoColor=white" alt="Tauri" />
</p>
<p>
<img src="https://img.shields.io/badge/Desktop_App-Windows%20%7C%20macOS%20%7C%20Linux-blue?style=for-the-badge" alt="Desktop Apps" />
</p>
<p>
@@ -71,6 +76,7 @@ In a world where document formatting tools are increasingly locked behind paywal
- **🎨 40+ Typography Styles** — Curated across 8 aesthetic categories
- **📐 Multiple Paper Sizes** — A4 and Letter formats supported
- **💾 Local Processing** — Your documents never leave your machine
- **🖥️ Native Desktop Apps** — Built with Tauri for Windows, macOS, and Linux
- **📥 One-Click Export** — Clean `.docx` files ready for Microsoft Word
### 🏛️ Style Categories
@@ -140,13 +146,22 @@ Every style includes meticulously configured:
## 🚀 Quick Start
### Prerequisites
### Option 1: Download Desktop App (Recommended)
Pre-built binaries coming soon for:
- 🪟 **Windows** (.msi, .exe)
- 🍎 **macOS** (.dmg, .app)
- 🐧 **Linux** (.deb, .rpm, .AppImage)
### Option 2: Build from Source
#### Prerequisites
- **Node.js** 18+ (we recommend the latest LTS)
- A modern web browser
- **Rust** (for Tauri desktop builds)
- Your favorite text editor
### Installation
#### Web Development
```bash
# 1. Clone the collective's work
@@ -164,6 +179,18 @@ npm run dev
Your browser will open to `http://localhost:3000` — and you're ready to create!
#### Desktop App Development
```bash
# Run in desktop development mode
npm run desktop
# Build desktop app for production
npm run desktop:build
```
The built apps will be in `src-tauri/target/release/bundle/`
### Usage
1. **📤 Upload** — Drag and drop your Markdown file (or click to browse)
@@ -301,25 +328,37 @@ This follows established typographic best practices for comfortable reading.
### Available Scripts
```bash
# Development server with hot reload
npm run dev
# Web Development
npm run dev # Start Vite dev server
npm run build # Production build (outputs to dist/)
npm run preview # Preview production build locally
# Production build (outputs to dist/)
npm run build
# Preview production build locally
npm run preview
# Desktop App Development (Tauri)
npm run desktop # Run desktop app in dev mode
npm run desktop:build # Build desktop app for production
npm run tauri # Access Tauri CLI directly
```
### Project Structure
```
typogenie/
├── 📁 components/ # React components
│ ├── FileUpload.tsx # Drag-and-drop upload zone
│ ├── StyleSelector.tsx # Style gallery with live preview
│ ├── Preview.tsx # Final preview & DOCX export
└── StylePreviewModal.tsx # (Optional) Modal preview
├── 📁 src/ # Source code
│ ├── 📁 components/ # React components
│ ├── FileUpload.tsx # Drag-and-drop upload zone
│ ├── StyleSelector.tsx # Style gallery with live preview
│ ├── Preview.tsx # Final preview & DOCX export
│ │ └── StylePreviewModal.tsx # (Optional) Modal preview
│ ├── 📁 styles/ # Typography style definitions
│ ├── 📄 main.tsx # React entry point
│ ├── 📄 App.tsx # Main application component
│ ├── 📄 types.ts # TypeScript interfaces
│ └── 📄 constants.ts # Configuration exports
├── 📁 src-tauri/ # Tauri desktop app
│ ├── 📁 src/ # Rust source code
│ ├── 📁 icons/ # App icons
│ ├── 📄 Cargo.toml # Rust dependencies
│ └── 📄 tauri.conf.json # Tauri configuration
├── 📁 styles/ # Typography style definitions
│ ├── index.ts # Aggregates all categories
│ ├── minimalist.ts # 11 clean styles
@@ -352,6 +391,8 @@ typogenie/
| **Icons** | Lucide React | Beautiful, consistent iconography |
| **Markdown** | marked 12.0.0 | Local Markdown parsing |
| **Documents** | docx 8.5.0 | Client-side DOCX generation |
| **Desktop** | Tauri 2.0 | Native desktop apps (Rust + WebView) |
| **Backend** | Rust 1.77+ | Systems programming for desktop shell |
<br/>

View File

@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>TypoGenie - Professional Report Generator</title>
<title>TypoGenie</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
@@ -15,22 +15,9 @@
color: #e4e4e7;
}
</style>
<script type="importmap">
{
"imports": {
"lucide-react": "https://esm.sh/lucide-react@^0.563.0",
"react": "https://esm.sh/react@^19.2.4",
"react/": "https://esm.sh/react@^19.2.4/",
"react-dom/": "https://esm.sh/react-dom@^19.2.4/",
"docx": "https://esm.sh/docx@^8.5.0",
"marked": "https://esm.sh/marked@12.0.0"
}
}
</script>
<link rel="stylesheet" href="/index.css">
</head>
</head>
<body>
<div id="root"></div>
<script type="module" src="/index.tsx"></script>
</body>
</html>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

2247
package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

View File

@@ -1,21 +1,30 @@
{
"name": "typogenie",
"private": true,
"version": "0.0.0",
"version": "1.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
"preview": "vite preview",
"tauri": "tauri",
"tauri:dev": "tauri dev",
"tauri:build": "tauri build",
"desktop": "tauri dev",
"desktop:build": "tauri build"
},
"dependencies": {
"lucide-react": "^0.563.0",
"react": "^19.2.4",
"react-dom": "^19.2.4",
"@tauri-apps/api": "^2.0.0",
"@tauri-apps/plugin-dialog": "^2.0.0",
"@tauri-apps/plugin-fs": "^2.0.0",
"docx": "^8.5.0",
"marked": "12.0.0"
"lucide-react": "^0.563.0",
"marked": "12.0.0",
"react": "^19.2.4",
"react-dom": "^19.2.4"
},
"devDependencies": {
"@tauri-apps/cli": "^2.9.6",
"@types/node": "^22.14.0",
"@vitejs/plugin-react": "^5.0.0",
"typescript": "~5.8.2",

4
src-tauri/.gitignore vendored Normal file
View File

@@ -0,0 +1,4 @@
# Generated by Cargo
# will have compiled files and executables
/target/
/gen/schemas

5020
src-tauri/Cargo.lock generated Normal file

File diff suppressed because it is too large Load Diff

25
src-tauri/Cargo.toml Normal file
View File

@@ -0,0 +1,25 @@
[package]
name = "typogenie"
version = "1.0.0"
description = "TypoGenie - Markdown to Word document converter"
authors = ["TypoGenie Contributors"]
license = "MIT"
repository = "https://git.lashman.live/lashman/typogenie"
edition = "2021"
rust-version = "1.77.2"
[lib]
name = "app_lib"
crate-type = ["staticlib", "cdylib", "rlib"]
[build-dependencies]
tauri-build = { version = "2.5.3" }
[dependencies]
serde_json = "1.0"
serde = { version = "1.0", features = ["derive"] }
log = "0.4"
tauri = { version = "2.9.5" }
tauri-plugin-log = "2"
tauri-plugin-dialog = "2"
tauri-plugin-fs = "2"

3
src-tauri/build.rs Normal file
View File

@@ -0,0 +1,3 @@
fn main() {
tauri_build::build()
}

View File

@@ -0,0 +1,52 @@
{
"$schema": "../gen/schemas/desktop-schema.json",
"identifier": "default",
"description": "Default capabilities for TypoGenie",
"windows": [
"main"
],
"permissions": [
"core:default",
"dialog:default",
"dialog:allow-open",
"dialog:allow-save",
"fs:default",
"fs:allow-read-file",
"fs:allow-write-file",
"fs:allow-read-dir",
"fs:allow-copy-file",
"fs:allow-remove",
"fs:allow-rename",
"fs:allow-exists",
"fs:allow-mkdir",
{
"identifier": "fs:scope",
"allow": [
{
"path": "$HOME"
},
{
"path": "$HOME/**"
},
{
"path": "$DESKTOP"
},
{
"path": "$DESKTOP/**"
},
{
"path": "$DOCUMENT"
},
{
"path": "$DOCUMENT/**"
},
{
"path": "$DOWNLOAD"
},
{
"path": "$DOWNLOAD/**"
}
]
}
]
}

BIN
src-tauri/icons/128x128.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

BIN
src-tauri/icons/32x32.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
src-tauri/icons/icon.icns Normal file

Binary file not shown.

BIN
src-tauri/icons/icon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 37 KiB

BIN
src-tauri/icons/icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 49 KiB

26
src-tauri/src/lib.rs Normal file
View File

@@ -0,0 +1,26 @@
use tauri::Manager;
#[cfg_attr(mobile, tauri::mobile_entry_point)]
pub fn run() {
tauri::Builder::default()
.plugin(tauri_plugin_dialog::init())
.plugin(tauri_plugin_fs::init())
.setup(|app| {
// Show the main window after setup
if let Some(window) = app.get_webview_window("main") {
let _ = window.show();
let _ = window.set_focus();
}
if cfg!(debug_assertions) {
app.handle().plugin(
tauri_plugin_log::Builder::default()
.level(log::LevelFilter::Info)
.build(),
)?;
}
Ok(())
})
.run(tauri::generate_context!())
.expect("error while running tauri application");
}

6
src-tauri/src/main.rs Normal file
View File

@@ -0,0 +1,6 @@
// Prevents additional console window on Windows in release, DO NOT REMOVE!!
#![cfg_attr(not(debug_assertions), windows_subsystem = "windows")]
fn main() {
app_lib::run();
}

56
src-tauri/tauri.conf.json Normal file
View File

@@ -0,0 +1,56 @@
{
"$schema": "../node_modules/@tauri-apps/cli/config.schema.json",
"productName": "TypoGenie",
"version": "1.0.0",
"identifier": "live.lashman.typogenie",
"build": {
"frontendDist": "../dist",
"devUrl": "http://localhost:3000",
"beforeDevCommand": "npm run dev",
"beforeBuildCommand": "npm run build"
},
"app": {
"windows": [
{
"label": "main",
"title": "TypoGenie",
"width": 1400,
"height": 900,
"minWidth": 1000,
"minHeight": 700,
"resizable": true,
"fullscreen": false,
"center": true,
"decorations": true,
"transparent": false,
"visible": false
}
],
"security": {
"csp": "default-src 'self'; connect-src 'self' https://fonts.googleapis.com https://fonts.gstatic.com; font-src 'self' https://fonts.gstatic.com; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com; img-src 'self' data: blob:;"
}
},
"bundle": {
"active": true,
"targets": ["msi", "nsis", "dmg", "app", "deb", "rpm", "appimage"],
"icon": [
"icons/32x32.png",
"icons/128x128.png",
"icons/128x128@2x.png",
"icons/icon.icns",
"icons/icon.ico"
],
"category": "Productivity",
"shortDescription": "Markdown to Word document converter",
"longDescription": "TypoGenie is a free, open-source typesetting engine that transforms Markdown into beautifully formatted Microsoft Word documents with 40+ professional styles.",
"publisher": "TypoGenie Contributors",
"copyright": "Copyright (c) 2026 TypoGenie Contributors",
"license": "MIT",
"homepage": "https://git.lashman.live/lashman/typogenie",
"windows": {
"webviewInstallMode": {
"type": "embedBootstrapper"
}
}
}
}

View File

@@ -20,10 +20,11 @@
"jsx": "react-jsx",
"paths": {
"@/*": [
"./*"
"./src/*"
]
},
"allowImportingTsExtensions": true,
"noEmit": true
}
}
},
"include": ["src/**/*"]
}

View File

@@ -1,20 +1,41 @@
import path from 'path';
import { defineConfig, loadEnv } from 'vite';
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
export default defineConfig(({ mode }) => {
const env = loadEnv(mode, '.', '');
return {
server: {
port: 3000,
host: '0.0.0.0',
},
plugins: [react()],
define: {},
resolve: {
alias: {
'@': path.resolve(__dirname, '.'),
}
}
};
export default defineConfig({
plugins: [react()],
// Vite options tailored for Tauri development
clearScreen: false,
server: {
port: 3000,
strictPort: true,
host: '0.0.0.0',
// Tauri requires a consistent port for the dev server
watch: {
ignored: ['**/src-tauri/**'],
},
},
// to make use of `TAURI_DEBUG` and other env variables
envPrefix: ['VITE_', 'TAURI_'],
build: {
// Tauri supports es2021
target: process.env.TAURI_PLATFORM == 'windows' ? 'chrome105' : 'safari13',
// don't minify for debug builds
minify: !process.env.TAURI_DEBUG ? 'esbuild' : false,
// produce sourcemaps for debug builds
sourcemap: !!process.env.TAURI_DEBUG,
// Output to dist folder for Tauri
outDir: 'dist',
emptyOutDir: true,
},
resolve: {
alias: {
'@': path.resolve(__dirname, './src'),
},
},
});