Skip to main content

Overview

Sync your LiveCodes data across devices:
  • Projects - Access your projects anywhere
  • Settings - Consistent preferences across devices
  • Templates - Sync custom templates
  • Assets - Share uploaded files
Sync uses browser-based storage and doesn’t require an account. Your data stays private and client-side.

How Sync Works

LiveCodes sync is built on:
  1. Browser Storage - Data stored in IndexedDB/localStorage
  2. Sync Protocol - Differential sync with conflict resolution
  3. Export/Import - Manual sync via files or URLs
LiveCodes doesn’t have a centralized server. Sync happens through your own storage mechanisms.

Sync Methods

Manual Export/Import

The most reliable sync method:
1

Export on Device 1

  1. Open MenuBackup/Restore
  2. Select what to backup (projects, settings, etc.)
  3. Click Backup to download a zip file
2

Transfer File

Move the backup file to Device 2:
  • Email to yourself
  • Cloud storage (Dropbox, Drive)
  • USB drive
3

Import on Device 2

  1. Open MenuBackup/Restore
  2. Go to Restore tab
  3. Select the backup file
  4. Click Restore

Using Cloud Storage

Store backups in the cloud:
  1. Export backup from LiveCodes
  2. Upload to Google Drive
  3. Download on other devices
  4. Import into LiveCodes

URL-Based Sync

Share projects via URLs:
1

Create Share URL

Click Share and generate a permanent URL
2

Save URL

Store the URL in:
  • Bookmarks
  • Note-taking app
  • Password manager
3

Access from Any Device

Open the URL on any device to load the project
URL-based sync only works for individual projects, not all settings.

What Can Be Synced

Projects

  • All saved projects
  • Code in all editors
  • External resources
  • Project configurations

User Settings

  • Editor preferences
  • Theme selection
  • Language defaults
  • Keyboard shortcuts

Templates

  • Custom starter templates
  • Saved configurations

Assets

  • Uploaded files (via GitHub Pages)
  • Asset URLs and metadata

App Data

  • Recent projects
  • Snippets
  • User preferences

Sync Workflow Examples

Development Workflow

1

Work on Desktop

Create and save project on desktop computer
2

Share via URL

Generate permanent share URL
3

Continue on Mobile

Open URL on tablet or phone to review/edit
4

Final Edits on Laptop

Open same URL on laptop for final touches

Team Collaboration

1

Create Project

Build project and test locally
2

Export Configuration

Export as JSON for version control
3

Share with Team

Commit to GitHub or send JSON file
4

Team Imports

Team members import and work on copies

Backup Strategies

Regular Backups

1

Weekly Backups

Export all projects weekly:
livecodes_backup_2024-03-15.zip
livecodes_backup_2024-03-22.zip
2

Store Safely

Keep in multiple locations:
  • Local drive
  • Cloud storage
  • External backup
3

Test Restore

Periodically test that backups work

Version Control for Projects

Use Git for important projects:
# Export project as JSON
# Save as project.json

git add project.json
git commit -m "Update project"
git push

Conflict Resolution

When syncing between devices:
Manual resolution:
  1. Export from both devices
  2. Compare changes
  3. Merge manually
  4. Import merged version
Last write wins:
  • Most recent import overwrites
  • Keep backups before importing

Privacy & Security

LiveCodes sync is designed with privacy in mind:
  • No account required - Works without sign-up
  • Client-side only - Data stays in your browser
  • No tracking - Your code isn’t monitored
  • You control sharing - Only you decide what to sync

Data Encryption

Backup files are not encrypted by default:
If syncing sensitive code:
  • Encrypt backup files before uploading to cloud
  • Use private repositories
  • Consider local-only storage

Browser Storage Limits

  • Limit: ~5-10 MB
  • Used for: Settings, small projects
  • Cleared when: Cache cleared
Regularly export large projects to avoid browser storage limits.

Cross-Browser Sync

Sync between different browsers:
1

Export from Browser 1

Export backup in Chrome
2

Import to Browser 2

Import same backup in Firefox, Safari, etc.
Browser storage is isolated. Manual export/import is required to sync between browsers.

Troubleshooting

  • Backup selectively (only needed data)
  • Delete old/unused projects first
  • Use GitHub for large assets
  • Verify backup file isn’t corrupted
  • Check available browser storage
  • Try importing smaller batches
  • Clear some browser storage first
  • Check backup includes projects
  • Verify import completed successfully
  • Look in “All Projects” list
  • Ensure “User Config” is selected in backup
  • Settings are browser/device specific
  • Re-import if needed

Best Practices

1

Backup Before Major Changes

Always backup before:
  • Updating browser
  • Clearing cache
  • Trying experimental features
2

Use Descriptive Names

Name projects clearly for easy identification:
React Dashboard - v2
API Integration Demo
Client Website Prototype
3

Regular Maintenance

  • Delete old/unused projects
  • Keep backups organized
  • Test restore process occasionally

Future Sync Features

Planned improvements:
  • Automatic cloud sync
  • Real-time collaboration
  • Conflict resolution UI
  • GitHub integration for auto-sync

Build docs developers (and LLMs) love