A diary/note synchronization application built with React and TypeScript, supporting both online and offline usage.
Currently at: https://life.songyangyu.com/
Private Beta, open-sourced on client side. Create an issue here if interested in trying out
# install packages
pnpm install
# start local server
pnpm start
# deploy to gh-pages
pnpm run deploy- User authentication
- Online note synchronization
- Offline storage support
- Markdown content rendering
- Note filtering by date range
- Sorting by creation/modification time
- Responsive interface design
- React 18
- TypeScript 4
- IndexedDB (via idb library)
- React Markdown
- CSS3
- Node.js >= 16
- npm >= 8
- Clone the project and install dependencies:
git clone [project-url]
cd [project-directory]
pnpm install- Start the development server:
pnpm startThe application will run at http://localhost:3000
src/
├── components/ # React components
├── services/ # API and database services
├── styles/ # CSS style files
├── types/ # TypeScript type definitions
├── utils/ # Utility functions
└── App.tsx # Application entry component
- Username and password login
- JWT token authentication
- Persistent login state
- Automatic periodic sync (every 5 minutes)
- Manual sync trigger support
- Offline-first strategy
- Local storage using IndexedDB
- Offline access and editing support
- Sync conflict resolution
- Date range note filtering
- Sorting by creation/modification time
- Real-time Markdown rendering
- Responsive design for mobile compatibility
Default API address is http://localhost:8080, configurable in src/services/api.ts by modifying API_BASE.
Execute the following command to build for production:
npm run buildBuilt files will be generated in the build directory, ready for deployment to a static server.
pnpm start # Start development server
pnpm test # Run tests
pnpm run build # Build for production
pnpm run eject # Eject configuration filesThe project uses TypeScript strict mode to ensure type safety.
This project is licensed under the MIT License.