This repository powers a portfolio platform designed to showcase personal and professional achievements, provide development services, and articulate expertise in software development. It focuses on presenting working experiences, software-related skills, references, answers to common behavioral questions, and supports e-commerce features such as service payments.
To refer to the design, please see the mock-up in Figma:
The portfolio includes:
- A comprehensive showcase of working experiences.
- Detailed software development skills and areas of expertise.
- References and endorsements from collaborators or employers.
- Answers to common behavioral questions, offering insights into problem-solving approaches, communication style, and workflow preferences.
- A platform for offering development services with integrated payment functionality.
This portfolio is built with robust modern technologies and best development practices, enabling a seamless, responsive, and engaging user experience.
This repository uses a monorepository to manage multiple systems and services effectively:
web: The frontend service, built with Astro.js and React for dynamic and static UI components.cms: A content management system, likely for managing portfolio-related data (skills, references, etc.).tests: Handles automated testing for storage, integration, and UI feedback.ai-assistant: A modular sub-system that provides OpenAI-powered tools and features for integration, including CLI tools, a chatbot web component, and a Cloudflare worker backend.
- Portfolio Showcase:
- Highly optimized content rendering powered by Astro.js.
- Features React.js dynamic components for interactive elements such as behavioral question answers or services listings.
- Personal Branding:
- Emphasizes your skills, experience, and ways to collaborate.
- Supports references and reviews to strengthen trustworthiness.
- Service Monetization:
- Allows visitors to request development services.
- Stripe integration handles secure payment processing.
- AI-Powered Chatbot:
- A chatbot is seamlessly integrated into all portfolio HTML files.
- Hiring managers or recruiters can directly ask questions to the chatbot, enabling on-the-spot inquiries about your skills, experience, and availability.
- Question Handling:
- Answers common behavioral questions to facilitate a better understanding of your working and communication style.
- High Performance:
- Lightweight and fast builds through Astro.js for SEO-friendly and high-performance static website generation.
- Astro.js: For fast, lightweight static site generation, ideal for personal portfolios.
- React.js: For dynamic UI elements, user interactions, and reusable modular components.
- Material-UI (MUI): To ensure a polished design and professional feel.
- AI Assistant Worker: Cloudflare worker service for wrapping OpenAI APIs and serving requests from the web and CLI.
- CMS Integration: Manages the portfolio data and makes it configurable for potential real-time updates.
- Docker: Ensures portable and consistent local and production environments.
- Stripe Integration: Facilitates payments for services directly through the portfolio.
- CI/CD:
- Uses GitHub Actions for deployments and PR quality checks.
- Docker Compose: Configures different stages (development, test, production) for seamless container setups.
To set up the development environment for this repository, you can use the following commands:
-
Install Dependencies:
bash ./scripts/dev/setup.sh
-
Start Development:
bash ./scripts/dev/start.sh
- Monorepo Architecture: Centralizes multiple systems in a single repository for better manageability and collaboration.
- AI-Driven: Provides AI-powered utilities like chatbots and automated content generation.
- Service Monetization: Adds real-world e-commerce functionality with Stripe integration.
- Responsive Design: Built on modern frameworks to ensure great performance across devices.
The AI Assistant is a sub-system located in systems/ai-assistant that adds OpenAI-powered capabilities to this portfolio. It is composed of the following components:
The CLI provides modular commands for:
- Managing CMS tasks.
- Summarizing resumes and extracting keywords.
- Providing chatbot-powered assistance.
A set of reusable web components enabling seamless integration of OpenAI-based chatbot interfaces for interacting with website visitors.
The portfolio includes an AI chatbot, embedded into all portfolio HTML files, designed to:
- Answer hiring managers' or recruiters' questions in real-time.
- Provide details about expertise, skills, working style, and availability.
The worker acts as a backend service wrapping OpenAI API requests, providing scalability, speed, and cost efficiency.
The worker requires manual creation of a Cloudflare AI Gateway resource. This step currently cannot be automated. To complete setup:
- Sign into your Cloudflare account.
- Go to Workers & KV > AI Gateway.
- Create a new resource and configure it with the necessary OpenAI API details.
Once the AI Gateway is created, use the deployment script to deploy the worker:
bash ./scripts/ci/deploy.shThis document was generated with the assistance of an AI tool to structure and outline the features, systems, and components of this repository. Thank you for checking out this portfolio platform. We welcome feedback, contributions, and suggestions to help improve its functionality, performance, and usability.