Home

Space Usage

By default, Pixel Diary will save all diary data in the storage provided by the visitors browser. However, the available space of this storage may vary between browsers (typically 5-10 MB), but should be enough to store multiple years.

To put this seemingly small space in relation, the following table shows the space required for a full year.

	Plain	Encrypted	Data Included
Minimal	~ 6 KB	~ 8 KB	Only moods; no notes
Maximal	~ 60 KB	~ 80 KB	A note with maximal length on every day

So, even if a browser would only offer 1 MB of space, it would be enough for 12.5 years of encrypted diary data (or ~16.5 if unencrypted).

Cloud Storage Registration

In order to use any of the supported cloud storages when hosting a Pixel Diary under your own domain, you will need to register your Pixel Diary at the respective providers. If you only host your Pixel Diary on your own machine, under http://localhost, you don't need to change anything.

Dropbox

Create a new app using the App Console
Select "Dropbox API" and "App folder", choose a name for your app, and then click "Create app"
Now add the domain(s) of your Pixel Diary as "Redirect URIs"
Click the "Enable additional users" button to allow other users to use your app
Copy the "App key" and paste it into .env as the value of REACT_APP_CLOUD_DROPBOX
And lastly, run npm run build (again) to apply the new configuration

Please note that you have to apply for production once your Pixel Diary links to 50 unique users. Details on this can be found in Dropbox's Developer Guide.

OneDrive

Register a new app using Microsoft Azure
Choose a name for your app
Select "Accounts in any organizational directory and personal Microsoft accounts", if not already selected
Add the domain(s) of your Pixel Diary as "Redirect URI", using the type "Web"
Then click "Register"
Copy the "Application (client) ID" from the overview and paste it into .env as the value of REACT_APP_CLOUD_ONEDRIVE
Select "API permissions" on the sidebar and then click the "Add a permission" button
Now select "Microsoft Graph" (typically the top most box), then select "Delegated permissions", and check the Files.ReadWrite.AppFolder permission
Confirm the selection by clicking the "Add permission" button
Select "Authentication" on the sidebar
Now check the "Access tokens" option and apply the changes by clicking the "Save" button at the top
And lastly, run npm run build (again) to apply the new configuration

Google Drive

Create a new project using the API Console. Enter a project name and then click "Create"
Select your project in top bar, if it isn't already selected
Click the "Enable APIs and services" button
Select "Google Drive API" and click "Enable"
Click the "Create credentials" button in the top right
Now return to your projects dashboard by clicking the Google APIs logo in the top left
Select "OAuth consent screen" on the sidebar
Choose a name for your app and add the domain(s) of your Pixel Diary as "Authorized domains"
Click the "Add scope" button, check the ../auth/drive.appdata scope, and confirm by clicking "Add"
Apply all changes by clicking the "Save" button
Now select "OAuth client ID" from the "Create credentials" drop-down
Select "Web application" and add the domain(s) of your Pixel Diary as "Authorized JavaScript origins" and as "Authorized redirect URIs", then click "Create"
Copy the client ID and paste it into .env as the value of REACT_APP_CLOUD_GOOGLE_DRIVE
And lastly, run npm run build (again) to apply the new configuration