{"id":18646948,"url":"https://github.com/ozantekin/50days50projects","last_synced_at":"2025-04-07T06:12:05.235Z","repository":{"id":41085723,"uuid":"477256196","full_name":"ozantekin/50Days50Projects","owner":"ozantekin","description":"This repository features 50 mini projects related to HTML, CSS, and JavaScript. The development stages of these projects are available on YouTube.","archived":false,"fork":false,"pushed_at":"2024-08-02T05:16:47.000Z","size":10845,"stargazers_count":280,"open_issues_count":4,"forks_count":40,"subscribers_count":8,"default_branch":"main","last_synced_at":"2025-03-31T04:08:12.238Z","etag":null,"topics":["css","html","javascript"],"latest_commit_sha":null,"homepage":"https://youtube.com/playlist?list=PL4MimQX-iTOJEdZqdR3XVX4TnON85JMhy","language":"CSS","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/ozantekin.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","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},"funding":{"github":"ozantekin"}},"created_at":"2022-04-03T06:20:57.000Z","updated_at":"2025-03-12T23:09:48.000Z","dependencies_parsed_at":"2024-11-07T06:26:47.754Z","dependency_job_id":"a82e751f-854c-4844-aa7e-30ccf9a37814","html_url":"https://github.com/ozantekin/50Days50Projects","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ozantekin%2F50Days50Projects","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ozantekin%2F50Days50Projects/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ozantekin%2F50Days50Projects/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ozantekin%2F50Days50Projects/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ozantekin","download_url":"https://codeload.github.com/ozantekin/50Days50Projects/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247601448,"owners_count":20964864,"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":["css","html","javascript"],"created_at":"2024-11-07T06:23:47.250Z","updated_at":"2025-04-07T06:12:05.219Z","avatar_url":"https://github.com/ozantekin.png","language":"CSS","funding_links":["https://github.com/sponsors/ozantekin"],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n\u003cimg src=\"https://skillicons.dev/icons?i=html\" /\u003e \u003cimg src=\"https://skillicons.dev/icons?i=css\" /\u003e \u003cimg src=\"https://skillicons.dev/icons?i=js\" /\u003e \n\u003ch1\u003e50 Days 50 Projects\u003c/h1\u003e\n\u003c/div\u003e\n\n\u003chr/\u003e\n\n- \u003cb\u003e Overview: \u003c/b\u003e\n  - This repository is entirely project-based and contains fundamental projects, especially for beginners. It includes a total of 50 mini projects related to HTML, CSS, and JavaScript. You can easily access the source code and YouTube video links for the relevant projects through the \"Projects\" table below.\n- \u003cb\u003e Organization: \u003c/b\u003e\n  - Projects are organized into folders. You can click on the relevant project in the Projects section to access the source code and YouTube video links.\n\n\u003chr/\u003e\n\n- ###### This is a modified version of the \"50 Projects In 50 Days - HTML, CSS \u0026 JavaScript\" course taught by Brad Traversy and Florin Pop, filtered through my own study.\n\n\u003chr/\u003e\n\n\u003ch2 align=\"center\"\u003e Projects \u003c/h2\u003e\n\n\nmarkdown\nCopy code\n| No  | Source Code                                                                                                                          | YouTube Link                                                                                                                             | Status          |\n| --- | ------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- | --------------- |\n| 00  | **[Expanding Cards](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/01_Genisleyen_Kartlar)**                        | **[How to Create Animated Expanding Cards • 50 Days 50 Projects -1](https://youtu.be/32sSSksKbCE)**                                     | Completed       |\n| 01  | **[Progress Steps](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/02_Ilerleme_Adimlari)**                          | **[How to Create Animated Progress Steps • 50 Days 50 Projects -2](https://youtu.be/YhbVCjdjOO0)**                                      | Completed       |\n| 02  | **[Animated Rotating Menu](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/03_Donen_Menu_Animasyonu)**             | **[How to Create an Animated Menu • 50 Days 50 Projects -3](https://youtu.be/T3Gc3exJNBQ)**                                             | Completed       |\n| 03  | **[Hidden Search Widget](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/04_Gizli_Arama_Widget)**                  | **[How to Create a Toggle Search Input • 50 Days 50 Projects -4](https://youtu.be/Sn7F42jnCzU)**                                        | Completed       |\n| 04  | **[Blurred Loading Screen](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/05_Bulanik_Loading_Ekrani)**              | **[How to Create an Animated Loading Screen • 50 Days 50 Projects -5](https://www.youtube.com/watch?v=r5twXB71bDg\u0026ab_channel=OzanTekin)** | Completed       |\n| 05  | **[Scroll Animation](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/06_Scroll_Animasyonu)**                        | **[How to Create Scroll Animations • 50 Days 50 Projects -6](https://youtu.be/vOacI-cTnHc)**                                            | Completed       |\n| 06  | **[Split Landing Page](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/07_Bolunmus_Acilis_Sayfasi)**                | **[How to Create an Animated Expanding Landing Page • 50 Days 50 Projects -7](https://youtu.be/RQSArpgUPaw)**                          | Completed       |\n| 07  | **[Wave Animation](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/08_Dalga_Animasyonu)**                          | **[How to Create Wave Animation • 50 Days 50 Projects -8](https://youtu.be/QRiwYUQkNUQ)**                                               | Completed       |\n| 08  | **[Sound Stream Deck](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/09_Ses_Stream_Deck)**                        | **[Let's Create a Sound Stream Deck • 50 Days 50 Projects -9](https://youtu.be/EwHdykkdQEM)**                                          | Completed       |\n| 09  | **[Dad Jokes](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/10_Dad_Jokes)**                                      | **[Let's Build a Dad Jokes Generator • 50 Days 50 Projects -10](https://youtu.be/0lXxVbIg1-8)**                                       | Completed       |\n| 10  | **[Event keyCodes](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/11_Event_KeyCodes)**                            | **[KeyCodes Recap Project • 50 Days 50 Projects -11](https://youtu.be/sg5T7Vngtw4)**                                                  | Completed       |\n| 11  | **[FAQ Collapse](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/12_FAQ_Collapse)**                               | **[Let's Create a Detailed Collapse Project • 50 Days 50 Projects -12](https://youtu.be/JdqCTSVFJyk)**                                | Completed       |\n| 12  | **[Random Choice Picker](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/13_Random_Choice_Picker)**                | **[Simple Game with setTimeout and setInterval • 50 Days 50 Projects -13](https://youtu.be/3FVEJoCJEpc)**                              | Completed       |\n| 13  | **[Animated Navigation](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/14_Animated_Navigation)**                  | **[Animated Expanding Menu • 50 Days 50 Projects -14](https://youtu.be/fFKAUOIkHWo)**                                                 | Completed       |\n| 14  | **[Incrementing Counter](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/15_Artan_Sayac)**                        | **[Let's Build an Incrementing Counter • 50 Days 50 Projects -15](https://youtu.be/wXhz34MDZ7s)**                                     | Completed       |\n| 15  | **[Random Image Feed](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/16_Random_Image_Feed)**                      | **[How to Create a Random Image Feed • 50 Days 50 Projects -16](https://youtu.be/1eCzVtFhTNc)**                                       | Completed       |\n| 16  | **[Loading Screen](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/17_Loading_Ekrani)**                            | **[CSS Loading Screen • 50 Days 50 Projects -17](https://youtu.be/CX8uUWhlg-M)**                                                      | Completed       |\n| 17  | **[Auto Text Effect](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/18_Auto_Text_Effect)**                        | **[Automatic Text Effect • 50 Days 50 Projects -18](https://youtu.be/PPkBFDyZag8)**                                                   | Completed       |\n| 18  | **[Notes](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/19_Notes)**                                              | **[Notes App (localStorage) • 50 Days 50 Projects -19](https://youtu.be/1FKl_gvE3MM)**                                                | Completed       |\n| 19  | **[Quiz App](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/20_Quiz)**                                            | **[Quiz App • 50 Days 50 Projects -20](https://youtu.be/DhNQAQYrORQ)**                                                                | Completed       |\n| 20  | **[Drawing App](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/21_Drawing_App)**                                  | **[Drawing App - Canvas • 50 Days 50 Projects -21](https://youtu.be/RMeAy6j25tg)**                                                   | Completed       |\n| 21  | **[Pokedex](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/22_Pokedex)**                                        | **[Pokedex Guide - Fetch API \u0026 Async Await Basic Project • 50 Days 50 Projects -22](https://youtu.be/iQ3KE77Kxj8)**                    | Completed       |\n| 22  | **[Verify Account UI](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/23_Verify_Account)**                         | **[Verify Account UI • 50 Days 50 Projects -23](https://youtu.be/YgsU-yReKvo)**                                                       | Completed       |\n| 23  | **[Drag and Drop](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/24_SurukleBirak)**                               | **[Drag and Drop • 50 Days 50 Projects -24](https://youtu.be/KvFDIFYCvos)**                                                            | Completed       |\n| 24  | **[Password Strength](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/25_Password_Strength)**                      | **[Password Strength UI - Tailwind CSS • 50 Days 50 Projects -25](https://youtu.be/Ex3lenkN5GE)**                                     | Completed       |\n| 25  | **[Mobile Tab Navigation](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/26_Mobile_Tab_Navigation)**              | **[Let's Create Mobile Tab Navigation • HTML, CSS, JavaScript -26](https://youtu.be/l_ynwNG6J0k)**                                   | Completed       |\n| 26  | **[Image Carousel](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/27_Image_Carousel)**                            | **[Moving Image Showcase (setInterval) • HTML, CSS, JavaScript -27](https://youtu.be/8gYdAi_vSFo)**                                   | Completed       |\n| 27 | **[Notification](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/28_Bildirim)**                                     | **[JavaScript Beginner Project (DOM - Math.random) • Project -28](https://youtu.be/vLBZsAxqwMw)**                                     | Completed     |\n| 28 | **[Button Effect](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/29_Button_effect)**                               | **[Quick Review Project for JavaScript and CSS (clientX-Y offsetTop-Left) -29](https://youtu.be/O98SNt7rVAg)**                         | Completed     |\n| 29 | **[Hoverboard](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/30_Hoverboard)**                                     | **[15-Minute JavaScript Game for Beginners (mouseover - mouseout) • Project -30](https://youtu.be/ZGczNiN9V38)**                       | Completed     |\n| 30 | **[Box Switcher](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/31_Box_Switcher)**                                 | **[JavaScript Project for Beginners • HTML, CSS, JavaScript -31](https://youtu.be/EjRwyNPjc1Q)**                                      | Completed     |\n| 31 | **[Sticky Navbar](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/32_Stick_Navbar)**                              | **[Creating a Sticky Navbar • HTML, CSS \u0026 JS](https://youtu.be/esEYr6mrpqI)**                                                         | Completed     |\n| 32 | **[Feedback UI](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/33_Feedback_UI)**                                   | **[Creating a Feedback UI • HTML, CSS \u0026 JS](https://youtu.be/OLxRknJDEXA)**                                                            | Completed     |\n| 33 | **[Movie App](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/34_Movie_App)**                                       | **[Build a Movie Website in 50 Minutes - Responsive • JavaScript Fetch API](https://youtu.be/VcZErlRNuT4)**                            | Completed     |\n| 34 | **[GitHub Profile Card](https://github.com/ozantekin/50Days50Projects/tree/main/Projects/35_GitHub_Profil_Kart)**                    | **[Creating GitHub Profile Cards • Axios - JavaScript](https://youtu.be/jwQ-NcLQNfs)**                                                | Completed     |\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fozantekin%2F50days50projects","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fozantekin%2F50days50projects","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fozantekin%2F50days50projects/lists"}