Loading page
by Tanjid Karim Shafin
Editable, frontend-only animated portfolio in React 19 + TypeScript + Vite. Built-in admin CMS persists every section (hero, projects, skills, experience, testimonials) straight to Firebase Firestore. Smooth Lenis scroll, Framer Motion animations, custom particle cursor, and a validated contact form. No backend server required.
A frontend-only, fully editable portfolio site built with React 19, TypeScript, and Vite. Every text block, project, skill, experience entry and testimonial is editable through a built-in admin CMS that persists straight to Firebase Firestore — no separate backend server required.
Pure-frontend architecture means you deploy a single static bundle to Vercel, Netlify, Cloudflare Pages, GitHub Pages or any S3 bucket, and your data lives in Firebase.
npm install
npm run dev # Dev server on http://localhost:5173
npm run build # Production build to dist/
npm run preview # Serve production build locally
npm run typecheck # Verify TypeScript (zero errors expected)
Spin up an isolated sandbox and run it server-side — no local setup.
Push this product straight into your AI IDE, web builder or cloud IDE.
Connect Tetrees to a compatible AI IDE, list products you own, and request the verified ZIP without exposing seller upload controls.
No reviews yet.
Sign in to join the discussion
Loading discussion…
Create .env (or .env.local) at project root with your Firebase web-app config:
VITE_FIREBASE_API_KEY=your_api_key
VITE_FIREBASE_AUTH_DOMAIN=your_app.firebaseapp.com
VITE_FIREBASE_PROJECT_ID=your_project_id
VITE_FIREBASE_STORAGE_BUCKET=your_app.appspot.com
VITE_FIREBASE_MESSAGING_SENDER_ID=000000000000
VITE_FIREBASE_APP_ID=1:000000000000:web:xxxxxxxxxxxxxxx
In your Firebase project:
firestore.rules.example if provided).profiles/{uid} doc with role: 'admin' to unlock the CMS panel./admin (or click the floating admin toggle if present) and sign in with an admin account.staticData so design previews work out of the box.src/
components/
cms/ # Admin panel + editable wrappers
layout/ # Navbar, preloader, smooth scroll, particle cursor
motion/ # Reusable motion primitives (split text, magnetic, parallax, tilt)
sections/ # Hero, About, Projects, Skills, Experience, Testimonials, Contact, Footer
ui/ # Skeleton loaders
lib/
firebase.ts # Firebase init
firestoreService.ts # CRUD helpers per collection
repository.ts # In-memory cache + Firestore wiring
ContentContext.tsx # React context for content + loading state
AdminContext.tsx # Auth/role gating
staticData.ts # Default seed content
types.ts # GlobalContent, Project, Skill, ExperienceEntry, Testimonial, UserProfile
pages/
Index.tsx # Single-page portfolio
NotFound.tsx
MIT
The sandbox audition completed and the detected runnable path passed.
This React web app completed archive review with strong static results. Structure, dependency manifests, documentation, functional source, and common risk patterns were checked by the Tetrees verification pipeline; runtime phases are stated separately. Final verified scores after isolated runtime evidence: overall 8.3 and security 9.
Deterministic AVCP artifact review
Pipeline avcp-2026-08-04.1 · SHA-256 a75c84055eeedf7a…
This version-scoped review deterministically inspects the submitted archive for structure, dependencies, documentation, functional source, and common malicious or high-risk signals. Build and test phases are reported as passed only after an isolated sandbox audition. It is not a guarantee of perfect security.
Reviewed Aug 7, 2026
The full install guide and integration prompts unlock after purchase.
Automation, Utilities & Developer Tools
Free
