{"id":34560102,"url":"https://github.com/frostbyte012/gemma-studio","last_synced_at":"2026-04-07T23:31:32.589Z","repository":{"id":287459793,"uuid":"954634182","full_name":"frostbyte012/Gemma-Studio","owner":"frostbyte012","description":"A web-based application for managing datasets, fine-tuning machine learning models, and monitoring training progress. Built with React, TypeScript, and FastAPI, it simplifies workflows for dataset preprocessing, hyperparameter configuration, and model export.","archived":false,"fork":false,"pushed_at":"2025-04-22T00:00:18.000Z","size":280,"stargazers_count":0,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-22T01:19:09.593Z","etag":null,"topics":["docker","fastapi","reactjs","typescript"],"latest_commit_sha":null,"homepage":"","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/frostbyte012.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}},"created_at":"2025-03-25T11:37:52.000Z","updated_at":"2025-04-22T00:00:29.000Z","dependencies_parsed_at":"2025-04-11T21:43:25.285Z","dependency_job_id":null,"html_url":"https://github.com/frostbyte012/Gemma-Studio","commit_stats":null,"previous_names":["frostbyte012/gemma-studio"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/frostbyte012/Gemma-Studio","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frostbyte012%2FGemma-Studio","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frostbyte012%2FGemma-Studio/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frostbyte012%2FGemma-Studio/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frostbyte012%2FGemma-Studio/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/frostbyte012","download_url":"https://codeload.github.com/frostbyte012/Gemma-Studio/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frostbyte012%2FGemma-Studio/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31533823,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-07T16:28:08.000Z","status":"ssl_error","status_checked_at":"2026-04-07T16:28:06.951Z","response_time":105,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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":["docker","fastapi","reactjs","typescript"],"created_at":"2025-12-24T08:53:26.688Z","updated_at":"2026-04-07T23:31:32.577Z","avatar_url":"https://github.com/frostbyte012.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Gemma Studio\n\nGemma Studio is a web-based application designed to streamline dataset management, model training, and deployment workflows. Built with modern technologies like **React**, **TypeScript**, **Vite**, and **Tailwind CSS**, it provides an intuitive interface for managing datasets, configuring training parameters, monitoring training progress, and exporting trained models.\n\n# Inspiration\nInspired by [GSoC 25 from Google DeepMind](https://gist.github.com/dynamicwebpaige/92f7739ad69d2863ac7e2032fe52fbad), the goal is to create a user-friendly Gemma Model Fine-tuning UI using tools like Streamlit or Gradio. The UI enables users to:\n\n- **Dataset Uploading**: Support various formats (CSV, JSONL, text files) with validation, preprocessing, and optional data augmentation.\n- **Hyperparameter Configuration**: Adjust key parameters (learning rate, batch size, epochs) with sensible defaults and tooltips.\n- **Training Progress Visualization**: Display real-time metrics (loss curves, accuracy, F1-score) and examples of generated text.\n- **Model Download/Export**: Export fine-tuned models in formats like TensorFlow SavedModel, PyTorch, or GGUF.\n- **Cloud Integration**: Optionally integrate with Google Cloud Storage and Vertex AI for scalable training and data storage.\n- **Documentation**: Provide clear documentation and step-by-step examples for ease of use.\n\n---\n\n## Project Structure\n\nThe project is organized as follows:\n\n```\ngemma-studio/\n├── public/                      # Static assets\n├── src/\n│   ├── components/              # React components\n│   │   ├── dashboard/           # Dashboard components\n│   │   │   └── WelcomeCard.tsx  # Welcome component on dashboard\n│   │   ├── dataset/             # Dataset related components\n│   │   │   ├── DatasetPreview.tsx  # Preview uploaded datasets\n│   │   │   └── DatasetUpload.tsx   # Upload datasets UI\n│   │   ├── layout/              # Layout components\n│   │   │   ├── Layout.tsx       # Main layout wrapper\n│   │   │   └── Navbar.tsx       # Navigation bar\n│   │   ├── models/              # Model components\n│   │   │   └── ModelExport.tsx  # Export trained models\n│   │   ├── training/            # Training components\n│   │   │   ├── HyperparameterConfig.tsx  # Configure training parameters\n│   │   │   └── TrainingProgress.tsx      # Training progress visualization\n│   │   └── ui/                  # shadcn/ui components\n│   │       └── ...              # Various UI components (buttons, cards, etc.)\n│   ├── hooks/                   # Custom React hooks\n│   │   ├── use-mobile.tsx       # Hook for responsive design\n│   │   └── use-toast.ts         # Toast notification hook\n│   ├── lib/                     # Utility functions\n│   │   ├── animations.ts        # Animation utilities\n│   │   └── utils.ts             # General utilities\n│   ├── pages/                   # Page components\n│   │   ├── Dashboard.tsx        # Dashboard page\n│   │   ├── Datasets.tsx         # Datasets management page\n│   │   ├── Index.tsx            # Landing page\n│   │   ├── Models.tsx           # Model export page\n│   │   ├── NotFound.tsx         # 404 page\n│   │   ├── Settings.tsx         # Settings page\n│   │   └── Training.tsx         # Training configuration and monitoring page\n│   ├── services/                # Backend service integrations\n│   │   ├── datasetService.ts    # Dataset management functionality\n│   │   ├── modelService.ts      # Model export functionality\n│   │   └── trainingService.ts   # Training functionality\n│   ├── App.css                  # App-wide styles\n│   ├── App.tsx                  # Main application component with routing\n│   ├── index.css                # Global styles\n│   ├── main.tsx                 # Application entry point\n│   └── vite-env.d.ts            # Vite environment types\n├── eslint.config.js             # ESLint configuration\n├── tailwind.config.ts           # Tailwind CSS configuration\n├── tsconfig.json                # TypeScript configuration\n└── vite.config.ts               # Vite configuration\n```\n\n---\n\n## Technologies Used\n\n- **Vite**: Fast build tool for modern web projects.\n- **TypeScript**: Strongly typed JavaScript for better code quality.\n- **React**: Component-based UI library.\n- **shadcn-ui**: Pre-built UI components.\n- **Tailwind CSS**: Utility-first CSS framework.\n\n---\n\n## Installation and Usage\n\n### Prerequisites\n- **Node.js** and **npm** installed on your system. You can install them using [nvm](https://github.com/nvm-sh/nvm#installing-and-updating).\n\n### Steps to Install and Run Locally\n1. Clone the repository:\n   ```bash\n   git clone \u003cYOUR_GIT_URL\u003e\n   ```\n\n2. Navigate to the project directory:\n   ```bash\n   cd gemma-studio\n   ```\n\n3. Install dependencies:\n   ```bash\n   npm install\n   ```\n\n4. Start the development server:\n   ```bash\n   npm run dev\n   ```\n\n5. Open your browser and navigate to `http://localhost:8080` to view the application.\n\n---\n\n### Starting the Backend\n\n1. Navigate to the backend directory:\n   ```bash\n   cd backend\n   ```\n\n2. Install the required Python dependencies:\n   ```bash\n   pip install -r requirements.txt\n   ```\n\n3. Start the FastAPI backend server:\n   ```bash\n   uvicorn app:app --host 0.0.0.0 --port 8000\n   ```\n\n4. The backend will be available at:\n   ```\n   http://localhost:8000\n   ```\n\n## Deployment\n\n### Deploying to Hugging Face Spaces\n1. Package the application as a Docker container:\n   ```bash\n   docker build -t gemma-studio .\n   ```\n\n2. Push the Docker image to Hugging Face Spaces:\n   - Follow the [Hugging Face Spaces Docker documentation](https://huggingface.co/docs/hub/spaces-docker) to deploy your container.\n\n### Deploying to Google Cloud Run\n1. Authenticate with Google Cloud:\n   ```bash\n   gcloud auth login\n   gcloud auth configure-docker\n   ```\n\n2. Build and push the Docker image:\n   ```bash\n   docker build -t gcr.io/\u003cYOUR_PROJECT_ID\u003e/gemma-studio .\n   docker push gcr.io/\u003cYOUR_PROJECT_ID\u003e/gemma-studio\n   ```\n\n3. Deploy to Cloud Run:\n   ```bash\n   gcloud run deploy gemma-studio \\\n       --image gcr.io/\u003cYOUR_PROJECT_ID\u003e/gemma-studio \\\n       --platform managed \\\n       --region us-central1 \\\n       --allow-unauthenticated\n   ```\n\n### Integrating with Vertex AI\n- Use Vertex AI for advanced model training and deployment.\n- Integrate the backend services (`trainingService.ts`, `modelService.ts`) with Vertex AI APIs for seamless training and deployment workflows.\n- Refer to the [Vertex AI documentation](https://cloud.google.com/vertex-ai/docs) for more details.\n\n---\n\n## Future Scope\n\n1. **Hugging Face Integration**:\n   - Deploy models directly to Hugging Face Spaces for easy sharing and inference.\n\n2. **Google Cloud Integration**:\n   - Use Google Cloud Storage for dataset management.\n   - Leverage Vertex AI for scalable model training and deployment.\n\n3. **Custom Domain Support**:\n   - Integrate with platforms like Netlify or Vercel for hosting under a custom domain.\n\n4. **Enhanced UI/UX**:\n   - Add more interactive visualizations for training progress and dataset insights.\n\n5. **Multi-Cloud Support**:\n   - Extend deployment options to AWS and Azure.\n\n---\n\n## Contributing\n\nContributions are welcome! Please follow these steps:\n1. Fork the repository.\n2. Create a new branch:\n   ```bash\n   git checkout -b feature/your-feature-name\n   ```\n3. Commit your changes:\n   ```bash\n   git commit -m \"Add your message here\"\n   ```\n4. Push to your branch:\n   ```bash\n   git push origin feature/your-feature-name\n   ```\n5. Open a pull request.\n\n---\n\n## License\n\nThis project is licensed under the MIT License. See the `LICENSE` file for details.\n\n---\n\n## Contact\n\nFor any questions or feedback, feel free to reach out at [ai.frostbyte012@gmail.com].","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffrostbyte012%2Fgemma-studio","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffrostbyte012%2Fgemma-studio","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffrostbyte012%2Fgemma-studio/lists"}