Austin Harshberger

Innately curious goober and avid reader.
Los Angeles Metropolitan Area
Loading profile sections...
Create a page like this

A reusable build prompt for your own attested links profile.
You are a principal JavaScript and web developer with 30+ years of experience building state-of-the-art responsive web experiences using modern browser APIs, secure backend patterns, SQLite, accessibility practices, and performance techniques.

Create a polished links-first profile for me. Use my own name, light and dark profile photos, light and dark cover photos, headline, about text, location, contact info, main links, other links, and preferred accent color. The result should feel like a custom professional links profile, not a generic clone.

Build requirements:
- Create a public profile at /public and / with a sticky search bar, fixed profile header, fixed comment sidebar with owner replies, About, main Links, expandable Other links, and a footer.
- Store all editable data in SQLite: profile fields, light/dark image paths, accent color, main links, other-link categories, layout sections, comments, replies, sessions, 2FA state, and admin login credentials.
- Add a protected /admin page that is also the /login page. Do not reveal admin details until login succeeds. Ask for the 2FA code only after username/password are valid.
- Let the owner edit profile fields, upload separate light/dark profile and cover images, add/edit/delete main links, add/edit/delete categorized other links, reorder/hide content sections by simple numeric position, moderate comments, reply to comments, delete replies, change accent color, set up/remove 2FA, and change username/password after entering current password plus a valid 2FA code.
- Use a salted PBKDF2 password hash, HttpOnly SameSite session cookies, server-only credentials, and no browser localStorage for shared data.
- Render user-entered About, comments, and replies with safe markdown support for links like [label](https://example.com), bold, italics, inline code, and new lines.
- Include /qr as a conference QR page with the same profile identity, automatic light/dark profile image switching, a static scannable QR image, native Web Share with clipboard fallback, and no public navigation link from the main page.
- Use a dynamic SVG favicon that tracks the selected accent color and switches its fill/ink treatment automatically for light and dark browser modes.
- Include a footer link labeled AI Attested. Use the attest.97115104.com npm package to create a fresh attestation, then put the verify URL in both a meta attestation tag and the footer link.
- Add a Create a page like this modal containing this prompt with copy and Web Share buttons.
- Add a deploy-locally.sh script that chooses an open port, starts the app server, opens the browser on macOS, prints the main, public, admin, and QR URLs, and stays running until Ctrl-C.
- Add a strict CSP that does not require unsafe-eval. Avoid eval(), new Function(), string setTimeout/setInterval, and CDN scripts that depend on eval.

Seed example content:
- Main links: email, blog, LinkedIn, X/Twitter, GitHub, SSRN, Telegram, Calendly.
- Other links categories: projects, patents, publications, initiatives, receipts, misc. Use simple purpose-built SVG category icons for these entries instead of reusing blog icons.

Verification:
- Run the local deploy script and test only served pages, not file URLs.
- Check desktop and mobile widths, all links, search results, login, 2FA challenge, profile edits, credential updates, section ordering, link editors, other-link editors, comments, replies, delete controls, modal behavior, QR rendering, share/copy fallback, keyboard focus, contrast, CSP console errors, and layout overflow.
Contact info

Choose how you'd like to reach out.
[email protected]
Open Email Client