Internet Computer Portfolio Website
A modern, fully decentralized portfolio website showcasing CSWE Core Competencies for social work education, deployed on the Internet Computer blockchain. This project demonstrates advanced technical skills in web development and blockchain deployment.
The website is hosted entirely on-chain using the Internet Computer's canister infrastructure, ensuring permanent availability, censorship resistance, and Web3 integration. Unlike traditional hosting, all assets are served directly from the blockchain with optimized caching and security policies.
Technical Stack
-
Frontend Technologies
Built with HTML5, CSS3, and vanilla JavaScript for optimal performance and compatibility. Uses modern CSS features including custom properties, flexbox, grid, and smooth transitions for responsive design across all devices.
-
Internet Computer Blockchain
Deployed as a static asset canister on the Internet Computer using DFX SDK (0.29.2). Configured with .ic-assets.json5 for security policies, CSP headers, and optimized cache control for immutable assets.
-
Security & Performance
Implements Content Security Policy headers, optimized asset caching (31536000s for static files), and secure identity management. Local development environment uses IC replica for testing before mainnet deployment.
-
Development Workflow
Python-based local development server with hot-reload capabilities. Deployment automation using bash scripts for both local testing and mainnet deployment. Identity management with password-protected credentials and cycle management.
Key Features & Technical Highlights
-
Fully Decentralized Hosting
All website assets are stored and served directly from the Internet Computer blockchain, eliminating dependency on traditional web servers and ensuring permanent availability without recurring hosting costs.
-
Expandable PDF Viewer
Custom-built inline PDF viewer with smooth CSS transitions, allowing users to view supporting documents without leaving the page. Features include expandable iframes, toggle animations, and multiple viewing options.
-
Responsive Design
Mobile-first responsive design with breakpoints at 450px, 580px, 768px, 1024px, and 1250px. Adaptive layouts ensure optimal viewing experience across smartphones, tablets, and desktop devices.
-
No-Cache Development Mode
Development server configured with Cache-Control headers to prevent browser caching during development, ensuring instant feedback when testing changes locally before blockchain deployment.
Deployment Information
Canister ID: gug7q-nyaaa-aaaai-atlwq-cai
Network: Internet Computer Mainnet
Live URL: https://www.thebookofjohnathan.com
This project demonstrates proficiency in modern web development, blockchain technology, responsive design, and DevOps practices including automated deployment workflows and infrastructure management.