{"id":50783671,"url":"https://github.com/alihaydarsucu/alihaydarsucu.github.io","last_synced_at":"2026-06-12T05:32:34.097Z","repository":{"id":284830714,"uuid":"945649841","full_name":"alihaydarsucu/alihaydarsucu.github.io","owner":"alihaydarsucu","description":"🌐 My Portfolio Website","archived":false,"fork":false,"pushed_at":"2026-05-26T08:50:17.000Z","size":38151,"stargazers_count":4,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"v2","last_synced_at":"2026-05-26T10:26:20.825Z","etag":null,"topics":["developer-portfolio","personal-website","website"],"latest_commit_sha":null,"homepage":"https://alihaydarsucu.github.io/","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/alihaydarsucu.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-03-09T22:28:37.000Z","updated_at":"2026-05-26T08:50:24.000Z","dependencies_parsed_at":null,"dependency_job_id":"d26006ed-28ab-4a82-a698-6468f4c07dd5","html_url":"https://github.com/alihaydarsucu/alihaydarsucu.github.io","commit_stats":null,"previous_names":["alihaydarsucu/alihaydarsucu.github.io"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/alihaydarsucu/alihaydarsucu.github.io","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alihaydarsucu%2Falihaydarsucu.github.io","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alihaydarsucu%2Falihaydarsucu.github.io/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alihaydarsucu%2Falihaydarsucu.github.io/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alihaydarsucu%2Falihaydarsucu.github.io/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/alihaydarsucu","download_url":"https://codeload.github.com/alihaydarsucu/alihaydarsucu.github.io/tar.gz/refs/heads/v2","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alihaydarsucu%2Falihaydarsucu.github.io/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34231214,"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-12T02:00:06.859Z","response_time":109,"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":["developer-portfolio","personal-website","website"],"created_at":"2026-06-12T05:32:31.379Z","updated_at":"2026-06-12T05:32:34.086Z","avatar_url":"https://github.com/alihaydarsucu.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n\u003cdiv align=\"center\"\u003e\n   \u003cimg src=\"Images/Icons/icon.svg\" alt=\"Logo\" width=\"120\"\u003e\n   \u003ch1\u003eAli Haydar Sucu\u003c/h1\u003e\n   \u003cp\u003eComputer Engineering Student | Embedded \u0026 AI Enthusiast\u003c/p\u003e\n\u003c/div\u003e\n\n- [Project Overview](#project-overview)\n- [Features](#features)\n- [Blog System](#blog-system)\n- [Photos Gallery](#photos-gallery)\n- [CV Generation](#cv-generation)\n- [Tech \u0026 Structure](#tech--structure)\n- [Responsive Design](#responsive-design)\n- [Getting Started](#getting-started)\n- [Contact](#contact)\n\n\n## Project Overview\n\nThis repository contains my personal portfolio and blog website, featuring a fully automated CV generation system and a bilingual, category-based blog. The site is designed for both professional presentation and technical content sharing, with a modern, responsive UI and seamless English/Turkish support.\n\n\n## Features\n\n- **Bilingual Website**: All content and navigation available in English and Turkish, with instant language switching and clean URLs for both languages.\n- **Responsive Design**: Mobile-first, grid-based layouts, hamburger navigation, and adaptive breakpoints (1200px, 1035px, 768px, 470px, 370px).\n- **Dark/Light Mode**: Automatic system detection and manual toggle, with persistent user preference.\n- **Modern UI/UX**: Accessible, semantic HTML, ARIA labels, and visually appealing design.\n- **Automated CV Generation**: LaTeX-based, ATS-optimized, Oxford-style CV, auto-built and versioned via GitHub Actions.\n- **Dynamic Blog System**: Blog posts are written and managed locally from the admin panel, then published with category, subcategory, and language metadata.\n- **Photos Gallery**: Interactive photo gallery with search, category filtering, pagination (10 items/page), lightbox viewer with keyboard navigation, and bilingual support.\n- **Clean URL Routing**: Blog posts accessible via `/posts/slug` (EN) and `/yazilar/slug` (TR); Photos accessible via `/photos` (EN) and `/fotograflar` (TR), with .htaccess rewrite support.\n- **Social \u0026 SEO**: Open Graph, Twitter Card, and SEO meta tags; social links including Chess.com, LinkedIn, GitHub.\n\n---\n\n## Blog System\n\n- **Content Source**: Blog posts are written in the local admin editor and saved in project files.\n- **Storage Model**: Post index is stored in `data/blog-posts.json`; full article content is stored in `data/blog-content/\u003cslug\u003e.html`.\n- **Local Uploads**: Article images are uploaded and optimized locally into `Images/Uploads/Blog`.\n- **Category System**:\n  - Main: Technical, History, Fiction (TR); only Technical (EN)\n  - Subcategories (Technical): Systems, Embedded, AI\n- **Tab Navigation**: Blog pages feature a two-level tab system for category and subcategory filtering, with language-specific tab logic.\n- **Multilingual UI**: All blog UI elements, empty states, and buttons are translated.\n- **Share \u0026 Copy**: Blog posts have a share button that copies the clean site URL to clipboard.\n- **JSON Structure**: `data/blog-posts.json` contains post metadata used for filtering and display.\n\n---\n\n## Photos Gallery\n\n- **Photo Storage**: Photos stored in `/Images/Projects/` and referenced via `/data/photos.json`.\n- **Data Structure**: JSON file contains bilingual metadata (titles, descriptions) with category tags and filenames.\n- **Features**:\n  - **Search**: Real-time search by title, description, or category tag\n  - **Category Filtering**: Filter photos by tags (Flag, Landscape, Cat, Building, etc.) with bilingual labels\n  - **Pagination**: 10 photos per page with next/previous navigation and page number buttons\n  - **Lightbox Viewer**: Fixed-position modal with 80% zoom level, smooth animations, and keyboard navigation (Arrow keys, Escape)\n  - **Scroll Lock**: Page scrolling is disabled when lightbox is open for better UX\n  - **Responsive Grid**: Adaptive layout with 280px tile height on desktop, 200px on mobile\n- **Multilingual UI**: All gallery labels (search, filters, pagination) are translated to English and Turkish\n- **Clean URLs**: Gallery accessible via `/photos` (EN) and `/fotograflar` (TR), with language-specific navigation\n\n---\n\n## CV Generation\n\n- **LaTeX Engine**: CV is written in LaTeX (`cv/cv.tex`) and built with LuaLaTeX.\n- **Automation**: GitHub Actions workflow auto-builds and versions the CV on every commit to `cv/`.\n- **ATS-Optimized**: Layout and content are designed for applicant tracking systems.\n- **Downloadable**: Latest CV is always available for download on the site.\n\n---\n\n\n## Tech \u0026 Structure\n\n\u003cdetails\u003e\n\u003csummary\u003e🛠️ Technology Stack \u0026 📁 Project Structure (click to expand)\u003c/summary\u003e\n\u003cbr\u003e\n\u003cdiv align=\"center\"\u003e\n   \u003cimg src=\"https://skillicons.dev/icons?i=html,css,js,latex,githubactions\" alt=\"Skill Icons\" height=\"40\"\u003e\n\u003c/div\u003e\n\n\u003cbr\u003e\n\n**Frontend:** HTML5, CSS3 (Flexbox/Grid), JavaScript (ES6+), Font Awesome 6\u003cbr\u003e\n**Automation:** GitHub Actions (blog \u0026 CV workflows)\u003cbr\u003e\n**Other:** LaTeX (LuaLaTeX), .htaccess for clean URLs\u003cbr\u003e\n**No backend:** All dynamic content is client-side or via GitHub Actions\n\n```text\n.\n├── .github/workflows/         # Blog \u0026 CV automation\n│   ├── update-blog.yml        # Blog data sync\n│   └── generate-cv.yml        # CV generation\n├── Assets/                    # Generated CV PDFs\n├── cv/                        # CV source files (LaTeX)\n├── data/                      # Gallery and blog data\n│   ├── blog-content/          # Article HTML files (slug-based)\n│   ├── blog-posts.json        # Blog index metadata\n│   └── photos.json            # Photo metadata (bilingual)\n├── Images/                    # Icons, screenshots, projects, etc.\n├── pages/                     # Language-specific pages\n│   ├── en/                    # English pages\n│   └── tr/                    # Turkish pages\n├── *.html                     # Root pages (index, 404, etc.)\n├── style.css                  # Main stylesheet\n├── script.js                  # Main JavaScript (UI, navigation, language, etc.)\n├── photos.js                  # Photos gallery JavaScript (search, filter, pagination, lightbox)\n├── .htaccess                  # URL rewriting for clean routes\n└── admin-server.js            # Local admin API server\n```\n\u003c/details\u003e\n\n\u003cdetails\u003e\n\u003csummary\u003e🖼️ Visual Showcase (click to expand)\u003c/summary\u003e\n\n\u003cdiv align=\"center\"\u003e\n   \u003ch3\u003eDesktop View (Dark Mode)\u003c/h3\u003e\n   \u003cimg src=\"Screenshots/desktop-home.png\" alt=\"Desktop Homepage\" width=\"90%\"\u003e\n   \u003cp\u003eHomepage on Desktop\u003c/p\u003e\n   \u003ch3\u003eMobile Views\u003c/h3\u003e\n   \u003ctable\u003e\n      \u003ctr\u003e\n         \u003ctd align=\"center\"\u003e\n            \u003cimg src=\"Screenshots/mobile-experience-dark.png\" alt=\"Mobile Experience (Dark Mode) Page\" width=\"200\"\u003e\n            \u003cp\u003eExperience (Dark Mode)\u003c/p\u003e\n         \u003c/td\u003e\n         \u003ctd align=\"center\"\u003e\n            \u003cimg src=\"Screenshots/mobile-projects-light.png\" alt=\"Mobile Projects (Light Mode) Page\" width=\"200\"\u003e\n            \u003cp\u003eProjects (Light Mode)\u003c/p\u003e\n         \u003c/td\u003e\n         \u003ctd align=\"center\"\u003e\n            \u003cimg src=\"Screenshots/mobile-skills-dark.png\" alt=\"Mobile Skills (Dark Mode) Page\" width=\"200\"\u003e\n            \u003cp\u003eSkills (Dark Mode)\u003c/p\u003e\n         \u003c/td\u003e\n      \u003c/tr\u003e\n   \u003c/table\u003e\n\u003c/div\u003e\n\u003c/details\u003e\n\n## Responsive Design\n\n- **Grid Layouts**: Home and blog pages use adaptive grid layouts (3-col, 2-col, 1-col) based on breakpoints.\n- **Hamburger Menu**: Navigation switches to mobile menu below 1035px, with logo left and hamburger right.\n- **Tab System**: Blog uses two-level tabs for category/subcategory filtering, with language-specific logic.\n- **Mobile Optimizations**: Touch targets, font scaling, and single-column layouts for small screens.\n\n---\n\n## Getting Started\n\n### Prerequisites\n\n- Modern web browser\n- GitHub account (for development)\n- Node.js (for local admin server)\n- LaTeX distribution (for local CV generation)\n\n### Local Development\n\n1. Clone the repository:\n   ```bash\n   git clone https://github.com/alihaydarsucu/alihaydarsucu.github.io.git\n   ```\n2. Open `index.html` in your browser\n\n### Local Blog Authoring (Optional)\n\nTo manage blog posts locally from the admin panel:\n\n```bash\nnpm install\nnpm run admin\n```\n\nThen open `/admin` (EN) or `/yonetim` (TR), write the post, and publish.\n\n### Building the CV Locally\n\n1. Install a full LaTeX distribution (e.g., TeX Live)\n2. Navigate to the `cv` directory\n3. Run:\n   ```bash\n   lualatex cv.tex\n   ```\n4. The compiled PDF will be available as `cv.pdf` in the `cv` directory\n\n---\n\n## Contact\n\n- GitHub: [@alihaydarsucu](https://github.com/alihaydarsucu)\n- Email: [alihaydarsucu@gmail.com](mailto:alihaydarsucu@gmail.com)\n- LinkedIn: [ali-haydar-sucu](https://linkedin.com/in/ali-haydar-sucu)\n- Website: [alihaydarsucu.github.io](https://alihaydarsucu.github.io)\n\n---\n\n\u003cdiv align=\"center\"\u003e\n  Made with ❤️ by Ali Haydar Sucu\n\u003c/div\u003e\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falihaydarsucu%2Falihaydarsucu.github.io","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Falihaydarsucu%2Falihaydarsucu.github.io","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falihaydarsucu%2Falihaydarsucu.github.io/lists"}