{"id":24733752,"url":"https://github.com/ryan-infitech/gamification","last_synced_at":"2025-03-22T16:30:14.480Z","repository":{"id":272741490,"uuid":"917605165","full_name":"Ryan-infitech/Gamification","owner":"Ryan-infitech","description":"WebApp Programing Learning berbasis Gamification [ React ]","archived":false,"fork":false,"pushed_at":"2025-02-28T19:38:54.000Z","size":27736,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-28T21:11:16.826Z","etag":null,"topics":["gamification","learning","react","tugas-kuliah","website"],"latest_commit_sha":null,"homepage":"https://programinglearning.netlify.app/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Ryan-infitech.png","metadata":{"files":{"readme":"README-ID.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}},"created_at":"2025-01-16T09:59:15.000Z","updated_at":"2025-02-28T19:38:58.000Z","dependencies_parsed_at":null,"dependency_job_id":"1d63542c-4f67-482f-9a91-450867ddf8e7","html_url":"https://github.com/Ryan-infitech/Gamification","commit_stats":null,"previous_names":["ryan-infitech/gamification"],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ryan-infitech%2FGamification","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ryan-infitech%2FGamification/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ryan-infitech%2FGamification/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ryan-infitech%2FGamification/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Ryan-infitech","download_url":"https://codeload.github.com/Ryan-infitech/Gamification/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244986047,"owners_count":20542939,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["gamification","learning","react","tugas-kuliah","website"],"created_at":"2025-01-27T18:44:19.574Z","updated_at":"2025-03-22T16:30:14.456Z","avatar_url":"https://github.com/Ryan-infitech.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"right\"\u003e\n\n\u003ca href=\"README.md\"\u003e\u003cimg src=\"https://flagcdn.com/w40/gb.png\" width=\"25\"\u003e\u003c/a\u003e | \u003ca href=\"README-ID.md\"\u003e\u003cimg src=\"https://flagcdn.com/w40/id.png\" width=\"20\"\u003e\u003c/a\u003e\n\n\u003c/div\u003e\n\n# Gamification - Programing Learning\n![App Screenshot](./media/SS%20Desk%201.png)\n\nHallo! 👋 ayo kenalan dengan project saya kali ini: Programming Learning, sebuah website seru buat belajar coding. Website ini saya buat supaya teman-teman bisa belajar programming dengan cara yang lebih fun dan interaktif.\nJadi gini, di website ini kamu bakal nemuin kuis-kuis seru dengan pertanyaan pilihan ganda yang diacak. Nggak cuma itu, kamu langsung bisa tau jawaban kamu bener atau salah, plus ada animasi lucu yang bikin belajar jadi nggak membosankan. Saya pakai teknologi kekinian seperti TypeScript, Tailwind CSS, Framer Motion, dan Lucide React buat bikin tampilannya jadi keren dan nyaman dipakai.\n\n### Apa aja sih yang bisa kamu lakuin di sini?\n\n- Pilih topik yang kamu suka dan mulai jawab pertanyaan satu-satu\n- Langsung tau skor kamu setelah jawab\n- Dapet trofi virtual kalo kamu berhasil\n- Bisa langsung di deploy kalo kamu mau \n\n### Yang bikin website ini special:\n\n- Soal-soalnya diacak, jadi tiap main bakal dapet urutan yang beda\n- Ada efek animasi yang bikin kamu tau langsung jawaban kamu bener atau salah\n- Bisa liat progress belajar kamu sejauh mana\n- Tampilannya kekinian dan bisa dipake di HP atau laptop, plus ada dark mode buat yang suka tema gelap\n\n### Teknologi yang dipake:\n\n![Logo](https://miro.medium.com/v2/resize:fit:828/format:webp/1*a-HMmQFQNC76zCZBZfFgJg.gif)\n\n- TypeScript - biar code-nya rapi dan aman\n- Tailwind CSS - buat design yang keren dan konsisten\n- Framer Motion - nambahin animasi smooth yang bikin mata happy\n- Lucide React - ikon-ikon modern yang bikin tampilan makin ciamik\n\nKenapa harus coba? Karena website ini cocok buat siapa aja yang pengen belajar coding, dari yang baru mulai sampai yang udah jago. Interfacenya gampang dipake, designnya eye-catching, dan yang paling penting: belajarnya jadi lebih asik! 🚀\n\n## Preview\n\n![App Screenshot](./media/SS%20Desk%201.png)\n![App Screenshot](./media/SS%20Desk%202.png)\n![App Screenshot](./media/SS%20Desk%203.png)\n\n\u003cdiv align=\"center\"\u003e\n\u003cimg src=\"./media/Galaxy-S21-Ultra-localhost%20(1).png\" alt=\"App Screenshot\" style=\"width: 50%; height: 50%;\"/\u003e \u003c/div\u003e\n\n\n## Run Locally\n\nClone project ini\n\n```bash\ngit clone https://github.com/Ryan-infitech/Gamification\n```\n\npergi ke project directory\n\n```bash\n  cd project directory\n```\n\nInstall dependencies\n\n```bash\n  npm install\n```\n\nBuild project\n\n```bash\n  npm run build\n```\n\nStart local server\n\n```bash\n  npm run dev\n```\n\n\n## Tech Stack\n\n\u003cdiv align=\"center\"\u003e\n\n![Logo](./media/icons-typescript-48.png) ![Logo](./media/1174949_js_react%20js_logo_react_react%20native_icon.png) \u003cimg width=\"48\" height=\"48\" src=\"https://img.icons8.com/color/48/tailwindcss.png\" alt=\"tailwindcss\"/\u003e ![Logo](./media/icons-json-48.png)\n\n ![Node, Express](https://user-images.githubusercontent.com/97989643/224550089-f2541ade-c5c6-4afa-8538-51a8dda4e23b.gif)\n\n\u003c/div\u003e\n\n ## Kontak\n\nJika Anda memiliki pertanyaan atau saran, silakan buka issue baru di repository ini.\n\n[![WhatsApp](https://img.shields.io/badge/WhatsApp-25D366?style=for-the-badge\u0026logo=whatsapp\u0026logoColor=white)](https://wa.me/6285157517798)\n[![Instagram](https://img.shields.io/badge/Instagram-E4405F?style=for-the-badge\u0026logo=instagram\u0026logoColor=white)](https://www.instagram.com/ryan.septiawan__/)\n[![linkedin](https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge\u0026logo=linkedin\u0026logoColor=white)](https://www.linkedin.com/in/rian-septiawan-23b0a5351/)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fryan-infitech%2Fgamification","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fryan-infitech%2Fgamification","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fryan-infitech%2Fgamification/lists"}