Skip to content

harrisazmi/OnlinePortfolioV2

Repository files navigation

🌐 Online Portfolio v2

A modern, cloud-deployed personal portfolio designed to showcase professional skills, technical projects, and career achievements. Built with a focus on performance, accessibility, and continuous delivery, the portfolio reflects a commitment to clean UI/UX, scalable architecture, and real-world DevOps practices.

Live Demo: View Portfolio
Live Legacy: View Portfolio
Source Code: GitHub Repository
Report Issues: GitHub Issues


📌 Why I Built This

While digital resumes and static PDFs serve their purpose, they often fall short in showcasing technical depth, real-time updates, and interactivity. I realized my traditional resume lacked flexibility and didn’t truly reflect the way I work or what I’ve built.

This portfolio solves that by offering:

  • A dynamic and interactive format for showcasing my professional journey
  • A centralized place to explore my experience, skills, and technical projects
  • Mobile and print-friendly formats to adapt across various platforms
  • Continuous updates via CI/CD pipelines and global hosting via Cloudflare Pages

🛠️ Tech Stack

Frontend & Backend

  • TypeScript – Type-safe development
  • Next.js 15 – React framework for SSR & static sites
  • React 19 – Component-driven architecture
  • Tailwind CSS v4 – Utility-first styling
  • MYDS-UI – Custom design system
  • Radix UI – Accessible component primitives
  • ShadCN UI – Headless component styling
  • Node.js – Runtime environment

DevOps & Hosting

  • Cloudflare Pages – Fast, edge-hosted deployments
  • Vercel (Preview) – Zero-config previews for PRs
  • GitHub Actions – CI/CD pipeline for automated builds and deployments

🚀 Key Features & Technical Highlights

✅ Interactive, Component-Driven Layout

  • Built with modular, reusable React components for scalability
  • All major sections (projects, experience, contact) are abstracted for clean separation of concerns

📱 Fully Responsive Design

  • Mobile-first approach with seamless adaptation across devices
  • Optimized layout and UX for desktops, tablets, and smartphones

♿ Accessibility-Focused UI

  • Keyboard navigation, semantic HTML, and compliant color contrast
  • Prioritizes inclusive experiences for all users

🔁 CI/CD Integration

  • GitHub commits trigger automatic builds via Cloudflare Pages
  • Enables continuous delivery with minimal overhead and instant updates

📈 Impact and Outcomes

🌍 Improved Accessibility and Engagement

  • Transitioned from static documents to a dynamic, engaging platform
  • Encourages exploration and interactivity for recruiters and collaborators

🔗 Simplified Sharing and Outreach

  • A single link serves as a centralized professional identity
  • Consolidates skills, credentials, and contact info in one accessible format

💡 Demonstrated Technical Proficiency

  • Highlights real-world application of modern web technologies
  • Reflects strong knowledge of CI/CD, component-driven design, and performance optimization

🚧 Built to Scale and Evolve

  • More than a static portfolio—this is a professional platform
  • Built to adapt with my evolving career, skillset, and personal brand

🧪 Available Scripts

Script Description
dev Starts local development server
build Builds the production app
start Starts production server
lint Lints project using ESLint

📄 License

This project is open-source and available under the MIT License.


👨‍💻 Author

HARRIS AZMI BIN ROSWADI
Full-Stack Engineer | React · TypeScript · Next.js · AWS · CI/CD
LinkedInGitHub


🙋‍♀️ Feedback and Contributions

Have ideas to improve this portfolio?
Feel free to open an issue or submit a pull request.
If you found it inspiring, a ⭐ is always appreciated!

About

Online Portfolio v2

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages