Closed
Description
Instructions for Migrating the Blinko Application from Next.js to Tauri + Express Architecture
Overview of the Migration Architecture
Original Architecture (Next.js)
- Framework: Next.js (React framework with server-side rendering capabilities)
- Routing: Next.js file system routing
- API: Next.js API Routes + tRPC
- Authentication: next-auth
- Data Interaction: Prisma ORM
- Internationalization: next-i18n
- UI Framework: Custom + third-party component libraries
- Deployment Method: Web application deployment
Target Architecture
Front-end Application Framework:
- Tauri (desktop application shell)
- Vite (build tool)
- React SPA (single-page application)
- React Router (client-side routing)
Back-end Service:
- Express server
- vite-express development environment support
- @auth/express authentication system
- tRPC remains unchanged
- Prisma ORM remains unchanged
Migration Strategy
1. Architecture Separation
Split the original Next.js application into two independent projects:
- Front-end Project - Tauri + React single-page application
- Back-end Project - Express API server
2. Front-end Migration Key Points
Project Structure Reorganization
- Create a project structure that meets Tauri requirements
- Migrate the original page components to the new directory structure
Routing System Conversion
- Migrate from file system-based routing to React Router declarative routing
- As can be seen from the existing App.tsx file, React Router has been partially implemented
Build Process Adjustment
- Configure Vite as the front-end build tool
- Set environment variables suitable for desktop applications
Resource Reference Path Adaptation
- Adjust the reference paths of static resources
- Correct paths related to Next.js-specific features
Internationalization Migration
- Convert from next-i18n to the i18next system
- Keep the existing translation file structure
Theme System Adaptation
- Retain next-themes or migrate to an equivalent solution
3. Authentication System Migration
From next-auth to @auth/express
- Set up authentication routes for the Express server
- Implement equivalent authentication strategies and providers
- Update front-end authentication hooks and context
Session Management
- Re-implement the session persistence mechanism
- Configure secure cookie settings
Protected Routes
- Migrate the existing ProtectedRoute component, keeping its functionality unchanged
4. API Migration
From Next.js API Routes to Express Routes
- Rebuild the API endpoint structure
- Handle request validation and error handling
Keep tRPC Unchanged
- Adapt tRPC to work in the Express server
- Ensure the front-end tRPC client connects correctly
Database Access
- Retain the existing Prisma models and queries
- Ensure the Prisma client is properly initialized in the new environment
5. Desktop Application Feature Development
Integration of Tauri-specific Features
- File system access
- System tray
- Application updates
- System notifications
Offline Functionality
- Improve the existing offline page
- Implement local data caching