{"id":48881878,"url":"https://github.com/ilramdhan/ilramdhan.dev","last_synced_at":"2026-04-16T03:04:35.501Z","repository":{"id":331301753,"uuid":"1126098572","full_name":"ilramdhan/ilramdhan.dev","owner":"ilramdhan","description":"My Personal Web Portofolio","archived":false,"fork":false,"pushed_at":"2026-03-27T15:00:46.000Z","size":4452,"stargazers_count":4,"open_issues_count":1,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-03-28T00:43:05.187Z","etag":null,"topics":["framer-motion","lucide-react","react","react-markdown","react-router","recharts","supabase","tanstack-react-query","web-portofolio"],"latest_commit_sha":null,"homepage":"https://ilramdhan.dev","language":"TypeScript","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/ilramdhan.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":"2026-01-01T05:15:16.000Z","updated_at":"2026-03-27T15:00:52.000Z","dependencies_parsed_at":null,"dependency_job_id":"2585d033-1cd3-43f2-92ef-2e66895de244","html_url":"https://github.com/ilramdhan/ilramdhan.dev","commit_stats":null,"previous_names":["ilramdhan/ilramdhan.dev"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/ilramdhan/ilramdhan.dev","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ilramdhan%2Filramdhan.dev","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ilramdhan%2Filramdhan.dev/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ilramdhan%2Filramdhan.dev/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ilramdhan%2Filramdhan.dev/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ilramdhan","download_url":"https://codeload.github.com/ilramdhan/ilramdhan.dev/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ilramdhan%2Filramdhan.dev/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31869067,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-15T15:24:51.572Z","status":"online","status_checked_at":"2026-04-16T02:00:06.042Z","response_time":69,"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":["framer-motion","lucide-react","react","react-markdown","react-router","recharts","supabase","tanstack-react-query","web-portofolio"],"created_at":"2026-04-16T03:04:35.301Z","updated_at":"2026-04-16T03:04:35.483Z","avatar_url":"https://github.com/ilramdhan.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Portfolio Website Ilramdhan.dev\n\nA modern, responsive portfolio website built with React, Vite, Tailwind CSS, and Supabase. This project showcases a developer's profile, projects, blog posts, and technical skills with a clean and interactive UI.\n\n## 🚀 Features\n\n*   **Dynamic Content Management**: Powered by Supabase for easy management of projects, blogs, experience, education, and more.\n*   **Responsive Design**: Fully responsive layout optimized for all devices using Tailwind CSS.\n*   **Dark/Light Mode**: Seamless theme switching with persistent preference.\n*   **Interactive UI**: Animations powered by Framer Motion and 3D effects with Vanta.js/Three.js.\n*   **Blog System**: Markdown-supported blog posts with commenting functionality.\n*   **Project Showcase**: Detailed project pages with image galleries, tech stacks, and links.\n*   **Resume/CV Section**: Display of work experience, education, and certifications.\n*   **Wakatime Integration**: Real-time coding stats visualization.\n*   **Admin Dashboard**: Secure admin area for managing all content (protected by Supabase Auth).\n\n## 🛠 Tech Stack\n\n### Frontend\n*   **Framework**: [React](https://react.dev/) (with [Vite](https://vitejs.dev/))\n*   **Language**: [TypeScript](https://www.typescriptlang.org/)\n*   **Styling**: [Tailwind CSS](https://tailwindcss.com/)\n*   **Routing**: [React Router](https://reactrouter.com/)\n*   **State Management/Data Fetching**: [TanStack Query (React Query)](https://tanstack.com/query/latest)\n*   **Animations**: [Framer Motion](https://www.framer.com/motion/), [Vanta.js](https://www.vantajs.com/)\n*   **Icons**: [Lucide React](https://lucide.dev/)\n*   **Markdown**: [React Markdown](https://github.com/remarkjs/react-markdown)\n*   **Charts**: [Recharts](https://recharts.org/)\n\n### Backend / Services\n*   **Database**: [Supabase](https://supabase.com/) (PostgreSQL)\n*   **Authentication**: Supabase Auth\n*   **Storage**: Supabase Storage (for images and files)\n\n## 📂 Project Structure\n\n```\n/\n├── actions/            # Client-triggered action handlers used by the SPA\n├── api/                # API related files\n├── app/                # Main application pages and layouts\n│   ├── admin/          # Admin dashboard components\n│   ├── about.tsx       # About page\n│   ├── blog.tsx        # Blog listing page\n│   ├── blog-detail.tsx # Individual blog post page\n│   ├── login.tsx       # Admin login page\n│   ├── page.tsx        # Home page\n│   ├── projects.tsx    # Projects listing page\n│   └── ...\n├── components/         # Reusable UI components\n│   ├── Hero.tsx        # Homepage hero section\n│   ├── Navbar.tsx      # Navigation bar\n│   ├── ProjectCard.tsx # Project display card\n│   └── ...\n├── lib/                # Utility functions and configurations\n│   ├── supabase/       # Supabase client setup\n│   ├── api.ts          # API service functions for data fetching\n│   ├── database.types.ts # TypeScript definitions for Supabase tables\n│   └── ...\n├── experimental/       # Archived or optional modules not used in current production runtime\n├── public/             # Static assets\n└── ...\n```\n\n## 🗄️ Database Schema\n\nThe project uses the following tables in Supabase:\n\n*   `profile`: User profile information (bio, social links, avatar, etc.).\n*   `projects`: Portfolio projects with details, images, and tags.\n*   `blogs`: Blog posts with markdown content.\n*   `resume`: Work experience and education entries.\n*   `services`: Services offered by the developer.\n*   `certificates`: Certifications and awards.\n*   `tech_stack`: Technologies and skills with icons.\n*   `messages`: Contact form submissions.\n*   `blog_comments`: Comments on blog posts.\n\n## 🚀 Getting Started\n\n### Prerequisites\n\n*   Node.js (v18 or higher)\n*   npm or yarn\n*   A Supabase project\n\n### Installation\n\n1.  **Clone the repository**\n    ```bash\n    git clone https://github.com/yourusername/your-repo-name.git\n    cd your-repo-name\n    ```\n\n2.  **Install dependencies**\n    ```bash\n    npm install\n    ```\n\n3.  **Environment Setup**\n    Create a `.env.local` file in the root directory and add your Supabase credentials:\n    ```env\n    VITE_SUPABASE_URL=your_supabase_project_url\n    VITE_SUPABASE_ANON_KEY=your_supabase_anon_key\n    ```\n\n    - [ ] Never expose non-`VITE_` secrets to frontend bundle\n\n\n4.  **Run the development server**\n    ```bash\n    npm run dev\n    ```\n\n5.  **Build for production**\n    ```bash\n    npm run build\n    ```\n\n## 📝 License\n\nThis project is licensed under the MIT License.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Filramdhan%2Filramdhan.dev","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Filramdhan%2Filramdhan.dev","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Filramdhan%2Filramdhan.dev/lists"}