You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
A personal project lab. Every page sits behind a login, pages are organized in a folder tree, and whatever a page saves follows the user to any browser they sign in on.
How it works
GitHub Pages serves only the shell: index.html, style.css, app.js.
Firebase (free Spark plan) handles accounts and stores everything else: the pages themselves and each user's saved data. The pages are not in this repo, so a hidden page stays private even though the repo is public.
Pages run in a sandboxed frame. Whatever a page saves to localStorage is copied to the signed-in user's account and restored in any browser. Pages need no changes to get this.
Each user's data is private. The admin can delete it but cannot read it.
Files
File
What it does
index.html
Page shell: sign-in screen, top bar, tree, content area
style.css
All styles and design tokens
app.js
Sign-in, tree, page frames, saving, admin tools
firebase-config.js
Your Firebase project settings and the admin username
firestore.rules
Database access rules, pasted into the Firebase console
One-time setup (about 15 minutes)
Create a Firebase project. Go to console.firebase.google.com → Create a project → name it shidner → Google Analytics off → Create.
Turn on sign-in.Build → Authentication → Get started → Sign-in method → Email/Password → enable the first switch (leave Email link off) → Save.
Create the admin account before anything else.Authentication → Users → Add user. Email: matthew@shidner.example.com. Password: your admin password. Doing this first means nobody else can claim the name matthew.
Create the database.Build → Firestore Database → Create database → Standard edition → pick a location (for example us-west1) → Start in production mode → Create.
Publish the rules.Firestore Database → Rules → delete what's there, paste all of firestore.rules → Publish.
Copy your web settings. Gear icon → Project settings → General → Your apps → the web icon (</>) → nickname shidner → Register app (skip Hosting). Copy the six values from the firebaseConfig it shows into firebase-config.js.
Deploy. Copy these files into the repo: replace index.html, style.css and app.js, and add firebase-config.js, firestore.rules and this README. Delete projects.json and the projects/ folder: those old pages would otherwise stay public. Commit and push in GitHub Desktop; Pages updates in about a minute.
Load the pages. Open the site, sign in as matthew → Admin → Import bundle → choose shidner-pages.json. Keep that file outside the repo; it holds every page.
Everyday use
Add a page:Admin → choose the HTML file → title → folder → Add page. Use / for subfolders, for example Deep Dives/English.
Reorder: lower Order numbers come first. A folder sorts by its lowest-numbered page.
Hide a page from other users: untick Visible. You still see it, marked hidden.
Update a page:Replace uploads a new HTML file. Users' saved data for that page is kept.
Back up:Export all pages downloads one file you can import again later.
Remove a user:Delete in the Users table signs them out for good and erases their saved data. The username stays reserved. To remove the login itself: Firebase console → Authentication → Users.
Change your password: click your username in the top bar.
Good to know
Anyone who finds the site's address can create an account and see every visible page. Hide anything personal.
Each page can save about 4 MB of data per user.
The free plan allows 50,000 reads and 20,000 writes a day, far more than personal use needs.
Pages that relied on the old site's browser storage (Wrangell Trails) import that data the first time you open them in the same browser.
Troubleshooting
You see
Fix
"Almost there"
firebase-config.js still has the PASTE_… placeholders
"Accounts aren't switched on"
Step 2
"Permission denied"
Step 5: the rules aren't published, or were only partly pasted
"That username has characters that aren't allowed" on every sign-up
Change USER_EMAIL_DOMAIN in firebase-config.js and the admin email in firestore.rules to another domain you control, then redo step 3