{"id":25796706,"url":"https://github.com/amirmx2905/mydevport","last_synced_at":"2026-06-17T10:31:49.411Z","repository":{"id":278819225,"uuid":"936778665","full_name":"amirmx2905/MyDevPort","owner":"amirmx2905","description":"MyDevPort is a personal portfolio showcasing my projects, skills, and experience. This repository contains code samples, web applications, and other works that highlight my development journey.","archived":false,"fork":false,"pushed_at":"2025-06-10T19:03:25.000Z","size":25527,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-06-10T20:30:15.372Z","etag":null,"topics":["css","html5","javascript","tailwindcss","typescript","vercel","vite","vue3"],"latest_commit_sha":null,"homepage":"https://mydevport.vercel.app","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/amirmx2905.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-02-21T17:08:54.000Z","updated_at":"2025-06-10T19:03:28.000Z","dependencies_parsed_at":"2025-02-21T22:19:01.601Z","dependency_job_id":"03d48491-c01e-4008-8380-12a223f6fa7c","html_url":"https://github.com/amirmx2905/MyDevPort","commit_stats":null,"previous_names":["amirmx2905/mydevport"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/amirmx2905/MyDevPort","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/amirmx2905%2FMyDevPort","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/amirmx2905%2FMyDevPort/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/amirmx2905%2FMyDevPort/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/amirmx2905%2FMyDevPort/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/amirmx2905","download_url":"https://codeload.github.com/amirmx2905/MyDevPort/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/amirmx2905%2FMyDevPort/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34445179,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-17T02:00:05.408Z","response_time":127,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css","html5","javascript","tailwindcss","typescript","vercel","vite","vue3"],"created_at":"2025-02-27T14:40:40.979Z","updated_at":"2026-06-17T10:31:49.405Z","avatar_url":"https://github.com/amirmx2905.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# MyDevPort - Developer Portfolio\n\nA modern, interactive portfolio showcasing my skills, projects, and experience as a Full Stack Developer. Built with Vue.js and featuring dynamic animations, responsive design, and smooth user interactions.\n\n\u003cp align=\"center\"\u003e\n    \u003cstrong\u003e\u003ca href=\"https://mydevport.vercel.app/\" style=\"text-decoration: none; color: #4FC08D;\"\u003e🌐 MyDevPort\u003c/a\u003e\u003c/strong\u003e\n\u003c/p\u003e\n\n\u003cbr\u003e\n\n## Tech Stack\n\n\u003cp align=\"center\"\u003e\n    \u003ca href=\"https://vuejs.org/\" style=\"text-decoration: none;\"\u003e\u003cimg src=\"https://img.shields.io/badge/Vue.js-4FC08D?style=for-the-badge\u0026logo=vuedotjs\u0026logoColor=white\" alt=\"Vue.js\"\u003e\u003c/a\u003e\u0026nbsp;\n    \u003ca href=\"https://www.typescriptlang.org/\" style=\"text-decoration: none;\"\u003e\u003cimg src=\"https://img.shields.io/badge/TypeScript-3178C6?style=for-the-badge\u0026logo=typescript\u0026logoColor=white\" alt=\"TypeScript\"\u003e\u003c/a\u003e\u0026nbsp;\n    \u003ca href=\"https://tailwindcss.com/\" style=\"text-decoration: none;\"\u003e\u003cimg src=\"https://img.shields.io/badge/TailwindCSS-06B6D4?style=for-the-badge\u0026logo=tailwindcss\u0026logoColor=white\" alt=\"TailwindCSS\"\u003e\u003c/a\u003e\u0026nbsp;\n    \u003ca href=\"https://vitejs.dev/\" style=\"text-decoration: none;\"\u003e\u003cimg src=\"https://img.shields.io/badge/Vite-646CFF?style=for-the-badge\u0026logo=vite\u0026logoColor=white\" alt=\"Vite\"\u003e\u003c/a\u003e\u0026nbsp;\n    \u003ca href=\"https://developer.mozilla.org/en-US/docs/Web/JavaScript\" style=\"text-decoration: none;\"\u003e\u003cimg src=\"https://img.shields.io/badge/JavaScript-F7DF1E?style=for-the-badge\u0026logo=javascript\u0026logoColor=black\" alt=\"JavaScript\"\u003e\u003c/a\u003e\u0026nbsp;\n    \u003ca href=\"https://developer.mozilla.org/en-US/docs/Web/CSS\" style=\"text-decoration: none;\"\u003e\u003cimg src=\"https://img.shields.io/badge/CSS3-1572B6?style=for-the-badge\u0026logo=css3\u0026logoColor=white\" alt=\"CSS3\"\u003e\u003c/a\u003e\u0026nbsp;\n    \u003ca href=\"https://developer.mozilla.org/en-US/docs/Web/HTML\" style=\"text-decoration: none;\"\u003e\u003cimg src=\"https://img.shields.io/badge/HTML5-E34F26?style=for-the-badge\u0026logo=html5\u0026logoColor=white\" alt=\"HTML5\"\u003e\u003c/a\u003e\u0026nbsp;\n    \u003ca href=\"https://vercel.com/\" style=\"text-decoration: none;\"\u003e\u003cimg src=\"https://img.shields.io/badge/Vercel-000000?style=for-the-badge\u0026logo=vercel\u0026logoColor=white\" alt=\"Vercel\"\u003e\u003c/a\u003e\u0026nbsp;\n\u003c/p\u003e\n\n\u003cbr\u003e\n\n## Features\n\n- **Interactive Canvas**: Dynamic particle system with mouse interaction and responsive animations\n- **Vue 3 Composition API**: Modern Vue.js architecture with TypeScript support\n- **Fully Responsive**: Optimized for all devices with mobile-first design\n- **Smooth Animations**: CSS transitions and custom animations throughout\n- **Project Showcase**: Interactive modals with detailed project information\n- **Certifications Gallery**: Visual display of professional achievements\n- **Experience Timeline**: Professional background with company details\n- **Contact Form**: Functional contact system with validation\n- **Skills Display**: Technical and soft skills with interactive elements\n- **CV Download**: Direct PDF download functionality\n- **Modern UI/UX**: Glassmorphism design with gradient effects\n\n\u003cbr\u003e\n\n## Setup Guide\n\nThis guide will help you set up the project locally on Mac or Windows.\n\u003cbr\u003e\n\n### Prerequisites\n\n- Node.js (v18 or higher)\n- npm or yarn\n- Git\n\n\u003cbr\u003e\n\n## Installation Steps\n\n### 1. Clone the Repository\n\n```bash\ngit clone https://github.com/amirmx2905/MyDevPort.git\ncd MyDevPort\n```\n\n\u003cbr\u003e\n\n### 2. Install Dependencies\n\n```bash\nnpm install\n```\n\n\u003cbr\u003e\n\n### 3. Start Development Server\n\n```bash\nnpm run dev\n```\n\nThis will start the development server at `http://localhost:5173/`\n\n\u003cbr\u003e\n\n### 4. Build for Production\n\n```bash\nnpm run build\n```\n\nThis creates optimized production files in the `dist/` directory.\n\n\u003cbr\u003e\n\n### 5. Preview Production Build\n\n```bash\nnpm run preview\n```\n\n\u003cbr\u003e\n\n## Project Structure\n\n```bash\nMyDevPort/\n├── public/                    # Static assets\n│   ├── documents/            # CV and documents\n│   │   └── Amir_Flores_CV.pdf\n│   └── images/               # Images and icons\n│       ├── certifications/   # Certification images\n│       ├── icons/           # Skill and UI icons\n│       ├── logos/           # Company logos\n│       ├── profile/         # Profile photos\n│       └── projects/        # Project screenshots\n├── src/\n│   ├── components/          # Vue components\n│   │   ├── Header/          # Landing section\n│   │   ├── AboutMe/         # About section\n│   │   ├── Experience/      # Work experience\n│   │   ├── Projects/        # Portfolio projects\n│   │   ├── Certifications/  # Achievements\n│   │   ├── Contact/         # Contact form\n│   │   └── Footer/          # Footer section\n│   ├── composables/         # Vue composables\n│   │   ├── useDeviceDetection.ts\n│   │   ├── useModalScroll.ts\n│   │   └── useSmoothScroll.ts\n│   ├── App.vue              # Main application\n│   ├── main.ts              # Application entry point\n│   └── style.css            # Global styles\n├── package.json             # Dependencies and scripts\n├── vite.config.ts           # Vite configuration\n├── tsconfig.json            # TypeScript configuration\n└── README.md                # This file\n```\n\n\u003cbr\u003e\n\n## Development\n\n### Available Scripts\n\n```bash\n# Start development server\nnpm run dev\n\n# Build for production\nnpm run build\n\n# Preview production build locally\nnpm run preview\n```\n\n\u003cbr\u003e\n\n### Component Architecture\n\nThe project follows a modular component structure:\n\n- **Header**: Interactive landing section with particle canvas\n- **AboutMe**: Personal information, skills, and profile\n- **Experience**: Professional background and work history\n- **Projects**: Portfolio showcase with detailed modals\n- **Certifications**: Educational achievements and credentials\n- **Contact**: Functional contact form with validation\n- **Footer**: Additional links and information\n\n\u003cbr\u003e\n\n### Key Technologies Explained\n\n- **Vue 3**: Latest version with Composition API and `\u003cscript setup\u003e` syntax\n- **TypeScript**: Type-safe development with enhanced IDE support\n- **Tailwind CSS**: Utility-first CSS framework for rapid styling\n- **Vite**: Fast build tool with hot module replacement\n- **Responsive Design**: Mobile-first approach with breakpoint utilities\n\n\u003cbr\u003e\n\n## Deployment\n\nThis project is automatically deployed to Vercel on every push to the main branch.\n\n### Manual Deployment to Vercel\n\n1. Install Vercel CLI: `npm i -g vercel`\n2. Run: `vercel`\n3. Follow the prompts\n\n### Other Deployment Options\n\n- **Netlify**: Drag and drop the `dist/` folder\n- **GitHub Pages**: Use `gh-pages` package\n- **Firebase Hosting**: Use Firebase CLI\n\n\u003cbr\u003e\n\n## Performance Features\n\n- **Optimized Images**: WebP format for faster loading\n- **Code Splitting**: Automatic chunking by Vite\n- **Tree Shaking**: Unused code elimination\n- **Minification**: Compressed production builds\n- **CDN Delivery**: Fast global content delivery via Vercel\n\n\u003cbr\u003e\n\n## Browser Support\n\n- Chrome (latest)\n- Firefox (latest)\n- Safari (latest)\n- Edge (latest)\n\n\u003cbr\u003e\n\n## Contributing\n\n1. Fork the repository\n2. Create a feature branch: `git checkout -b feature-name`\n3. Commit changes: `git commit -m 'Add feature'`\n4. Push to branch: `git push origin feature-name`\n5. Submit a pull request\n\n\u003cbr\u003e\n\n## License\n\nThis project is licensed under the MIT License - see the `LICENSE` file for details.\n\n\u003cbr\u003e\n\n## Contact\n\n- **Portfolio**: [https://mydevport.vercel.app/](https://mydevport.vercel.app/)\n- **GitHub**: [@amirmx2905](https://github.com/amirmx2905)\n- **LinkedIn**: [Amir Sebastián Flores Cardona](https://www.linkedin.com/in/amir-sebasti%C3%A1n-flores-cardona-617556250/)\n\n\u003cbr\u003e\n\n## Author\n\n**Amir Sebastián Flores Cardona**\n- Full Stack Developer\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Famirmx2905%2Fmydevport","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Famirmx2905%2Fmydevport","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Famirmx2905%2Fmydevport/lists"}