https://github.com/innei/d
D is a simple local first personal website, written in Vue 3
https://github.com/innei/d
Last synced: 5 months ago
JSON representation
D is a simple local first personal website, written in Vue 3
- Host: GitHub
- URL: https://github.com/innei/d
- Owner: Innei
- Created: 2023-11-14T09:26:54.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-01-19T22:01:54.000Z (over 2 years ago)
- Last Synced: 2025-03-30T07:02:13.520Z (about 1 year ago)
- Language: TypeScript
- Homepage: https://innei.ren
- Size: 1.46 MB
- Stars: 3
- Watchers: 2
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# D
A simple website. Written by Vue 3.
Data persistents in index DB, and local first after syncing but not using CRDTs.
## Structure
Establishing IndexDb for the first time.
```mermaid
sequenceDiagram
participant Server as Server Database
participant API as /sync/collection Interface
participant Frontend as Frontend
participant Stream as Stream Processing
participant IndexDB as IndexDb
Server->>API: Full data stream transmission loss
API->>Frontend: Data stream
Frontend->>Stream: Receiving data stream
loop Parse each line of data
Stream->>IndexDB: Enter each line of data into respective tables
end
```
Data binding with Pinia to implement UI reactivity.
```mermaid
sequenceDiagram
participant IndexDB as IndexDb
participant Hook as Hook (on change)
participant Pinia as Pinia Store
participant UI as User Interface
IndexDB->>Hook: Change event
Hook->>Pinia: Update/inject data
Pinia->>UI: Render/update reactive data
```
Subsequent incremental updates.
```mermaid
flowchart LR
subgraph server [Server]
db[Database]
checksum_table[Checksum Table]
hooks[Update Hooks]
db --> checksum_table
db --> hooks
end
subgraph operations [Operations]
add_record[Add Record]
update_record[Update Record]
delete_record[Delete Record]
add_record --> hooks
update_record --> hooks
delete_record --> hooks
end
cronjob[Cron Job] --> db
hooks -->|Update Checksums| checksum_table
server -.-> operations
server --> cronjob
```
```mermaid
sequenceDiagram
participant Frontend
participant /sync/deta API
participant Database
Frontend->>/sync/deta API: Request sync with last sync timestamp
/sync/deta API->>Database: Query updates since last sync timestamp
Database-->>/sync/deta API: Updated records
/sync/deta API-->>Frontend: Updated records
Frontend->>Frontend: Incrementally update indexDb with records
```