{"id":12888,"date":"2025-02-19T04:30:11","date_gmt":"2025-02-19T01:30:11","guid":{"rendered":"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/"},"modified":"2025-02-19T04:30:11","modified_gmt":"2025-02-19T01:30:11","slug":"html-css-ve-javascript-ile-30-yaratici-proje-2-bolum","status":"publish","type":"post","link":"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/","title":{"rendered":"HTML, CSS ve JavaScript ile 30 Yarat\u0131c\u0131 Proje &#8211; 2. B\u00f6l\u00fcm"},"content":{"rendered":"<p><body><\/p>\n<p>HTML, CSS ve JavaScript ile 30 Yarat\u0131c\u0131 Proje &#8211; 2. B\u00f6l\u00fcm<\/p>\n<p>Merhaba! Fatih Soysal olarak,  30days30projects serisinin ikinci b\u00f6l\u00fcm\u00fcnde sizlerle birlikteyim.  Bir \u00f6nceki b\u00f6l\u00fcmde temel seviye projelerden bahsetmi\u015ftik.  \u015eimdi ise, daha geli\u015fmi\u015f ve yarat\u0131c\u0131 HTML, CSS ve JavaScript projelerini ele alaca\u011f\u0131z. Bu projeler, becerilerinizi geli\u015ftirmenize ve portf\u00f6y\u00fcn\u00fcze ekleyebilece\u011finiz etkileyici \u00e7al\u0131\u015fmalar olu\u015fturman\u0131za yard\u0131mc\u0131 olacakt\u0131r.  \u00d6nceki yaz\u0131da oldu\u011fu gibi, bu b\u00f6l\u00fcmde de her proje i\u00e7in ayr\u0131nt\u0131l\u0131 a\u00e7\u0131klamalar ve kod \u00f6rnekleri sunaca\u011f\u0131m.<\/p>\n<p>Bu projelerde kullanaca\u011f\u0131m\u0131z temel teknolojiler HTML, CSS ve JavaScript&#8217;tir.  Ancak, baz\u0131 projelerde daha geli\u015fmi\u015f teknikler ve k\u00fct\u00fcphaneler de kullanabiliriz.  \u00d6rne\u011fin, baz\u0131 projelerde animasyonlar i\u00e7in JavaScript k\u00fct\u00fcphaneleri kullanabilir veya daha geli\u015fmi\u015f aray\u00fczler i\u00e7in framework&#8217;lerden faydalanabiliriz.  Bu projeler, sadece  temel web geli\u015ftirme bilginizi test etmenize de\u011fil, ayn\u0131 zamanda  daha karma\u015f\u0131k web uygulamalar\u0131 geli\u015ftirme konusunda deneyim kazanman\u0131za da yard\u0131mc\u0131 olacakt\u0131r.  Unutmay\u0131n ki, en iyi \u00f6\u011frenme yolu pratik yapmakt\u0131r. Bu projelerle kendinizi deneyin ve ortaya harika i\u015fler \u00e7\u0131kar\u0131n!<\/p>\n<h2>Proje \u00d6rnekleri:<\/h2>\n<p>\u0130kinci b\u00f6l\u00fcmdeki projeler aras\u0131nda etkile\u015fimli kartlar, geli\u015fmi\u015f animasyonlu men\u00fcler,  veri g\u00f6rselle\u015ftirme uygulamalar\u0131 ve daha fazlas\u0131 yer al\u0131yor.  \u00d6rne\u011fin, bir projede, kullan\u0131c\u0131n\u0131n girdi\u011fi veriler do\u011frultusunda dinamik olarak g\u00fcncellenen bir grafik olu\u015fturmay\u0131 \u00f6\u011frenebilirsiniz.  Ba\u015fka bir projede ise, kullan\u0131c\u0131n\u0131n etkile\u015fimleriyle de\u011fi\u015fen bir animasyonlu arka plan olu\u015fturmay\u0131 deneyimleyebilirsiniz.  Bu projeler size, sadece statik web sayfalar\u0131 olu\u015fturman\u0131n \u00f6tesine ge\u00e7erek,  dinamik ve etkile\u015fimli web uygulamalar\u0131 geli\u015ftirme konusunda b\u00fcy\u00fck bir avantaj sa\u011flayacakt\u0131r.  Ayr\u0131ca, bu projelerin kaynak kodlar\u0131n\u0131 GitHub&#8217;da bulabilirsiniz.<\/p>\n<h3>\u00d6rnek Kod Par\u00e7as\u0131 (JavaScript):<\/h3>\n<pre><code>\n\/\/ \u00d6rnek bir JavaScript fonksiyonu\nfunction selamla(isim) {\n  console.log(\"Merhaba, \" + isim + \"!\");\n}\n\nselamla(\"Fatih\");\n<\/code><\/pre>\n<p>Bu kod par\u00e7as\u0131, basit bir &#8220;Merhaba D\u00fcnya&#8221; \u00f6rne\u011fidir.  Daha geli\u015fmi\u015f projelerde daha karma\u015f\u0131k kodlar kullanaca\u011f\u0131z.  Bu projeler size JavaScript&#8217;in g\u00fcc\u00fcn\u00fc ve yeteneklerini g\u00f6sterecektir. Bu sayede,  daha karma\u015f\u0131k ve etkileyici projeler geli\u015ftirme yetene\u011finizi \u00f6nemli \u00f6l\u00e7\u00fcde art\u0131racaks\u0131n\u0131z.  Projelerle ilgili daha detayl\u0131 bilgi ve kod \u00f6rnekleri i\u00e7in l\u00fctfen <a href=\"https:\/\/dev.to\/km-js\/30-creative-projects-created-with-html-css-and-javascript-part-2-30days30projects-56o4\">buraya<\/a> t\u0131klayabilirsiniz.<\/p>\n<p>Bu projelerin tamamlanmas\u0131,  web geli\u015ftirme yolculu\u011funuzda \u00f6nemli bir ad\u0131m olacakt\u0131r.  \u0130\u015fte bu y\u00fczden,  bu projeleri tamamlamaya \u00e7al\u0131\u015fman\u0131z\u0131 ve kod \u00f6rneklerini inceleyerek \u00f6\u011frenmenizi \u015fiddetle tavsiye ederim.  Ba\u015far\u0131ya ula\u015fmak i\u00e7in sab\u0131r ve azim gereklidir. Unutmay\u0131n ki,  her ba\u015far\u0131l\u0131 geli\u015ftirici,  ba\u015flang\u0131\u00e7ta ayn\u0131 zorluklarla kar\u015f\u0131la\u015fm\u0131\u015ft\u0131r.  Siz de bu zorluklar\u0131 a\u015farak ba\u015far\u0131l\u0131 bir web geli\u015ftirici olabilirsiniz.<\/p>\n<p>Daha fazla web geli\u015ftirme i\u00e7eri\u011fi i\u00e7in kendi web sitemi <a href=\"https:\/\/fatihsoysal.com\">fatihsoysal.com<\/a> adresini ziyaret edebilirsiniz.<\/p>\n<p>Umar\u0131m bu makale size faydal\u0131 olmu\u015ftur.  Ba\u015fka bir yaz\u0131da g\u00f6r\u00fc\u015fmek \u00fczere!<\/p>\n<p><\/body><br \/>\n<\/html><\/p>\n<p>#Etiketler: HTML, CSS, JavaScript, Web Geli\u015ftirme, 30days30projects, Proje, Kodlama, E\u011fitim,  Web Uygulamalar\u0131, JavaScript K\u00fct\u00fcphaneleri, Animasyon,  Veri G\u00f6rselle\u015ftirme,  Dinamik Web Sayfalar\u0131, Fatih Soysal<\/p>\n","protected":false},"excerpt":{"rendered":"HTML, CSS ve JavaScript ile 30 Yarat\u0131c\u0131 Proje &#8211; 2. B\u00f6l\u00fcm Merhaba! Fatih Soysal olarak, 30days30projects serisinin ikinci&hellip;","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"csco_page_header_type":"","csco_page_load_nextpost":"","csco_page_subscribe_form":"","csco_page_contact_form":"","footnotes":""},"categories":[1],"tags":[],"class_list":{"0":"post-12888","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-genel","7":"cs-entry","8":"cs-video-wrap"},"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v20.5 (Yoast SEO v25.3.1) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>HTML, CSS ve JavaScript ile 30 Yarat\u0131c\u0131 Proje - 2. B\u00f6l\u00fcm<\/title>\n<meta name=\"description\" content=\"Merhaba! Fatih Soysal olarak, 30days30projects serisinin ikinci b\u00f6l\u00fcm\u00fcnde sizlerle birlikteyim. Bir \u00f6nceki b\u00f6l\u00fcmde temel seviye projelerden bahsetmi\u015ftik. \u015eimdi ise, daha geli\u015fmi\u015f ve yarat\u0131c\u0131 HTML, CSS ve JavaScript projelerini ele alaca\u011f\u0131z. Bu projeler, becerilerinizi geli\u015ftirmenize ve portf\u00f6y\u00fcn\u00fcze ekleyebilece\u011finiz etkileyici \u00e7al\u0131\u015fmalar olu\u015fturman\u0131za yard\u0131mc\u0131 olacakt\u0131r. \u00d6nceki yaz\u0131da oldu\u011fu gibi, bu b\u00f6l\u00fcmde de her proje i\u00e7in ayr\u0131nt\u0131l\u0131 a\u00e7\u0131klamalar ve kod \u00f6rnekleri sunaca\u011f\u0131m.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"HTML, CSS ve JavaScript ile 30 Yarat\u0131c\u0131 Proje - 2. B\u00f6l\u00fcm\" \/>\n<meta property=\"og:description\" content=\"Merhaba! Fatih Soysal olarak, 30days30projects serisinin ikinci b\u00f6l\u00fcm\u00fcnde sizlerle birlikteyim. Bir \u00f6nceki b\u00f6l\u00fcmde temel seviye projelerden bahsetmi\u015ftik. \u015eimdi ise, daha geli\u015fmi\u015f ve yarat\u0131c\u0131 HTML, CSS ve JavaScript projelerini ele alaca\u011f\u0131z. Bu projeler, becerilerinizi geli\u015ftirmenize ve portf\u00f6y\u00fcn\u00fcze ekleyebilece\u011finiz etkileyici \u00e7al\u0131\u015fmalar olu\u015fturman\u0131za yard\u0131mc\u0131 olacakt\u0131r. \u00d6nceki yaz\u0131da oldu\u011fu gibi, bu b\u00f6l\u00fcmde de her proje i\u00e7in ayr\u0131nt\u0131l\u0131 a\u00e7\u0131klamalar ve kod \u00f6rnekleri sunaca\u011f\u0131m.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/\" \/>\n<meta property=\"og:site_name\" content=\"Kodlar\u0131n Gizemli D\u00fcnyas\u0131\" \/>\n<meta property=\"article:published_time\" content=\"2025-02-19T01:30:11+00:00\" \/>\n<meta name=\"author\" content=\"Fatih Soysal\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Yazan:\" \/>\n\t<meta name=\"twitter:data1\" content=\"Fatih Soysal\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tahmini okuma s\u00fcresi\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/\"},\"author\":{\"name\":\"Fatih Soysal\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"headline\":\"HTML, CSS ve JavaScript ile 30 Yarat\u0131c\u0131 Proje &#8211; 2. B\u00f6l\u00fcm\",\"datePublished\":\"2025-02-19T01:30:11+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/\"},\"wordCount\":534,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/#respond\"]}],\"copyrightYear\":\"2025\",\"copyrightHolder\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/\",\"name\":\"HTML, CSS ve JavaScript ile 30 Yarat\u0131c\u0131 Proje - 2. B\u00f6l\u00fcm\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\"},\"datePublished\":\"2025-02-19T01:30:11+00:00\",\"description\":\"Merhaba! Fatih Soysal olarak, 30days30projects serisinin ikinci b\u00f6l\u00fcm\u00fcnde sizlerle birlikteyim. Bir \u00f6nceki b\u00f6l\u00fcmde temel seviye projelerden bahsetmi\u015ftik. \u015eimdi ise, daha geli\u015fmi\u015f ve yarat\u0131c\u0131 HTML, CSS ve JavaScript projelerini ele alaca\u011f\u0131z. Bu projeler, becerilerinizi geli\u015ftirmenize ve portf\u00f6y\u00fcn\u00fcze ekleyebilece\u011finiz etkileyici \u00e7al\u0131\u015fmalar olu\u015fturman\u0131za yard\u0131mc\u0131 olacakt\u0131r. \u00d6nceki yaz\u0131da oldu\u011fu gibi, bu b\u00f6l\u00fcmde de her proje i\u00e7in ayr\u0131nt\u0131l\u0131 a\u00e7\u0131klamalar ve kod \u00f6rnekleri sunaca\u011f\u0131m.\",\"breadcrumb\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Anasayfa\",\"item\":\"https:\/\/fatihsoysal.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"HTML, CSS ve JavaScript ile 30 Yarat\u0131c\u0131 Proje &#8211; 2. B\u00f6l\u00fcm\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/\",\"name\":\"Fatihsoysal.com\",\"description\":\"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim\",\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"tr\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\",\"name\":\"Fatih Soysal\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"tr\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"contentUrl\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"width\":512,\"height\":512,\"caption\":\"Fatih Soysal\"},\"logo\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\"},\"description\":\"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"HTML, CSS ve JavaScript ile 30 Yarat\u0131c\u0131 Proje - 2. B\u00f6l\u00fcm","description":"Merhaba! Fatih Soysal olarak, 30days30projects serisinin ikinci b\u00f6l\u00fcm\u00fcnde sizlerle birlikteyim. Bir \u00f6nceki b\u00f6l\u00fcmde temel seviye projelerden bahsetmi\u015ftik. \u015eimdi ise, daha geli\u015fmi\u015f ve yarat\u0131c\u0131 HTML, CSS ve JavaScript projelerini ele alaca\u011f\u0131z. Bu projeler, becerilerinizi geli\u015ftirmenize ve portf\u00f6y\u00fcn\u00fcze ekleyebilece\u011finiz etkileyici \u00e7al\u0131\u015fmalar olu\u015fturman\u0131za yard\u0131mc\u0131 olacakt\u0131r. \u00d6nceki yaz\u0131da oldu\u011fu gibi, bu b\u00f6l\u00fcmde de her proje i\u00e7in ayr\u0131nt\u0131l\u0131 a\u00e7\u0131klamalar ve kod \u00f6rnekleri sunaca\u011f\u0131m.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/","og_locale":"tr_TR","og_type":"article","og_title":"HTML, CSS ve JavaScript ile 30 Yarat\u0131c\u0131 Proje - 2. B\u00f6l\u00fcm","og_description":"Merhaba! Fatih Soysal olarak, 30days30projects serisinin ikinci b\u00f6l\u00fcm\u00fcnde sizlerle birlikteyim. Bir \u00f6nceki b\u00f6l\u00fcmde temel seviye projelerden bahsetmi\u015ftik. \u015eimdi ise, daha geli\u015fmi\u015f ve yarat\u0131c\u0131 HTML, CSS ve JavaScript projelerini ele alaca\u011f\u0131z. Bu projeler, becerilerinizi geli\u015ftirmenize ve portf\u00f6y\u00fcn\u00fcze ekleyebilece\u011finiz etkileyici \u00e7al\u0131\u015fmalar olu\u015fturman\u0131za yard\u0131mc\u0131 olacakt\u0131r. \u00d6nceki yaz\u0131da oldu\u011fu gibi, bu b\u00f6l\u00fcmde de her proje i\u00e7in ayr\u0131nt\u0131l\u0131 a\u00e7\u0131klamalar ve kod \u00f6rnekleri sunaca\u011f\u0131m.","og_url":"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/","og_site_name":"Kodlar\u0131n Gizemli D\u00fcnyas\u0131","article_published_time":"2025-02-19T01:30:11+00:00","author":"Fatih Soysal","twitter_card":"summary_large_image","twitter_misc":{"Yazan:":"Fatih Soysal","Tahmini okuma s\u00fcresi":"3 dakika"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/#article","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/"},"author":{"name":"Fatih Soysal","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"headline":"HTML, CSS ve JavaScript ile 30 Yarat\u0131c\u0131 Proje &#8211; 2. B\u00f6l\u00fcm","datePublished":"2025-02-19T01:30:11+00:00","mainEntityOfPage":{"@id":"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/"},"wordCount":534,"commentCount":0,"publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"inLanguage":"tr","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/#respond"]}],"copyrightYear":"2025","copyrightHolder":{"@id":"https:\/\/fatihsoysal.com\/blog\/#organization"}},{"@type":"WebPage","@id":"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/","url":"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/","name":"HTML, CSS ve JavaScript ile 30 Yarat\u0131c\u0131 Proje - 2. B\u00f6l\u00fcm","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/#website"},"datePublished":"2025-02-19T01:30:11+00:00","description":"Merhaba! Fatih Soysal olarak, 30days30projects serisinin ikinci b\u00f6l\u00fcm\u00fcnde sizlerle birlikteyim. Bir \u00f6nceki b\u00f6l\u00fcmde temel seviye projelerden bahsetmi\u015ftik. \u015eimdi ise, daha geli\u015fmi\u015f ve yarat\u0131c\u0131 HTML, CSS ve JavaScript projelerini ele alaca\u011f\u0131z. Bu projeler, becerilerinizi geli\u015ftirmenize ve portf\u00f6y\u00fcn\u00fcze ekleyebilece\u011finiz etkileyici \u00e7al\u0131\u015fmalar olu\u015fturman\u0131za yard\u0131mc\u0131 olacakt\u0131r. \u00d6nceki yaz\u0131da oldu\u011fu gibi, bu b\u00f6l\u00fcmde de her proje i\u00e7in ayr\u0131nt\u0131l\u0131 a\u00e7\u0131klamalar ve kod \u00f6rnekleri sunaca\u011f\u0131m.","breadcrumb":{"@id":"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/#breadcrumb"},"inLanguage":"tr","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fatihsoysal.com\/blog\/html-css-ve-javascript-ile-30-yaratici-proje-2-bolum\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Anasayfa","item":"https:\/\/fatihsoysal.com\/blog\/"},{"@type":"ListItem","position":2,"name":"HTML, CSS ve JavaScript ile 30 Yarat\u0131c\u0131 Proje &#8211; 2. B\u00f6l\u00fcm"}]},{"@type":"WebSite","@id":"https:\/\/fatihsoysal.com\/blog\/#website","url":"https:\/\/fatihsoysal.com\/blog\/","name":"Fatihsoysal.com","description":"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim","publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"tr"},{"@type":["Person","Organization"],"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1","name":"Fatih Soysal","image":{"@type":"ImageObject","inLanguage":"tr","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","contentUrl":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","width":512,"height":512,"caption":"Fatih Soysal"},"logo":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/"},"description":"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.","url":"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/"}]}},"yoast_meta":{"yoast_wpseo_title":"","yoast_wpseo_metadesc":"","yoast_wpseo_canonical":""},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/12888","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/comments?post=12888"}],"version-history":[{"count":0,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/12888\/revisions"}],"wp:attachment":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/media?parent=12888"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/categories?post=12888"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/tags?post=12888"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}