{"id":28,"date":"2024-04-17T04:35:00","date_gmt":"2024-04-17T01:35:00","guid":{"rendered":"https:\/\/www.teknolojist.net\/?p=28"},"modified":"2024-04-17T04:35:00","modified_gmt":"2024-04-17T01:35:00","slug":"frontend-nedir-frontend-developer-ne-is-yapar","status":"publish","type":"post","link":"https:\/\/mehmetabaci.tr\/?p=28","title":{"rendered":"Frontend Nedir, Frontend Developer Ne \u0130\u015f Yapar?"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\" data-sourcepos=\"3:1-3:437\">\u0130nternetin hayat\u0131m\u0131zdaki yeri her ge\u00e7en g\u00fcn artarken, web siteleri ve uygulamalar da \u00f6nem kazanmaya devam ediyor. Dijital d\u00fcnyan\u0131n temellerini ise <strong>web programlama<\/strong> ve <strong>yaz\u0131l\u0131m geli\u015ftirme<\/strong> gibi alanlar olu\u015fturuyor.<\/p>\n<p data-sourcepos=\"3:1-3:437\">Yaz\u0131l\u0131mc\u0131l\u0131k alanlarda kar\u015f\u0131m\u0131za \u00e7\u0131kan terimlerden biri de <strong>frontend<\/strong>&#8216;dir. Peki, <strong>frontend nedir<\/strong> ve <strong>frontend developer ne i\u015f yapar<\/strong>?<\/p>\n<h2 data-sourcepos=\"5:1-5:19\"><strong>Frontend Nedir?<\/strong><\/h2>\n<p data-sourcepos=\"7:1-7:469\">Basit\u00e7e ifade etmek gerekirse, <strong>frontend<\/strong> bir web sitesinin veya uygulaman\u0131n kullan\u0131c\u0131n\u0131n do\u011frudan etkile\u015fimde bulundu\u011fu <strong>kullan\u0131c\u0131 aray\u00fcz\u00fc<\/strong> k\u0131sm\u0131d\u0131r. Kullan\u0131c\u0131lar\u0131n g\u00f6rd\u00fc\u011f\u00fc g\u00f6rseller, metinler, butonlar, men\u00fcler ve di\u011fer t\u00fcm etkile\u015fimli \u00f6\u011feler frontend kapsam\u0131ndad\u0131r. <strong>Web tasar\u0131m\u0131<\/strong> ve <strong>kullan\u0131c\u0131 deneyimi (UX)<\/strong> gibi alanlarla da yak\u0131ndan ili\u015fkili olan frontend, bir web sitesinin veya uygulaman\u0131n <strong>kullan\u0131labilirli\u011fi<\/strong> ve <strong>esteti\u011fi<\/strong> i\u00e7in olduk\u00e7a \u00f6nemlidir.<\/p>\n<h2 data-sourcepos=\"9:1-9:29\"><strong>Frontend Developer Nedir?<\/strong><\/h2>\n<p data-sourcepos=\"11:1-11:380\"><strong>Frontend developer<\/strong>, bir web sitesinin veya uygulaman\u0131n frontend k\u0131sm\u0131n\u0131 tasarlamak, geli\u015ftirmek ve bak\u0131m\u0131n\u0131 yapmakla sorumlu <strong>yaz\u0131l\u0131mc\u0131d\u0131r<\/strong>. Kullan\u0131c\u0131 aray\u00fcz\u00fcn\u00fc olu\u015fturmak i\u00e7in <strong>HTML<\/strong>, <strong>CSS<\/strong> ve <strong>JavaScript<\/strong> gibi programlama dillerini kullan\u0131rlar. <strong>Duyarl\u0131 tasar\u0131m<\/strong>, <strong>performans optimizasyonu<\/strong> ve <strong>eri\u015filebilirlik<\/strong> gibi konularda da bilgi sahibi olmalar\u0131 gerekir.<\/p>\n<h3 data-sourcepos=\"13:1-13:42\"><strong>Frontend Developer G\u00f6revleri Nelerdir?<\/strong><\/h3>\n<p data-sourcepos=\"13:1-13:42\"><strong>frontend developer<\/strong>&#8216;\u0131n temel g\u00f6revleri \u015funlard\u0131r:<\/p>\n<ul data-sourcepos=\"17:1-26:0\">\n<li data-sourcepos=\"17:1-17:84\"><strong>Kullan\u0131c\u0131 aray\u00fcz\u00fc tasar\u0131m\u0131:<\/strong>\u00a0Kullan\u0131c\u0131 dostu ve estetik bir aray\u00fcz tasarlarlar.<\/li>\n<li data-sourcepos=\"18:1-18:80\"><strong>HTML kodlama:<\/strong>\u00a0Web sayfalar\u0131n\u0131n temelini olu\u015fturan HTML kodlar\u0131n\u0131 yazarlar.<\/li>\n<li data-sourcepos=\"19:1-19:81\"><strong>CSS kodlama:<\/strong>\u00a0Web sayfalar\u0131n\u0131n g\u00f6r\u00fcn\u00fcm\u00fcn\u00fc ve tasar\u0131m\u0131n\u0131 CSS ile belirlerler.<\/li>\n<li data-sourcepos=\"20:1-20:100\"><strong>JavaScript kodlama:<\/strong>\u00a0Web sayfalar\u0131na interaktif \u00f6zellikler eklemek i\u00e7in JavaScript kullan\u0131rlar.<\/li>\n<li data-sourcepos=\"21:1-21:115\"><strong>Duyarl\u0131 tasar\u0131m:<\/strong>\u00a0Web sitesinin veya uygulaman\u0131n farkl\u0131 ekran boyutlar\u0131na uyumlu hale getirilmesini sa\u011flarlar.<\/li>\n<li data-sourcepos=\"22:1-22:110\"><strong>Performans optimizasyonu:<\/strong>\u00a0Web sitesinin veya uygulaman\u0131n h\u0131zl\u0131 ve sorunsuz \u00e7al\u0131\u015fmas\u0131n\u0131 optimize ederler.<\/li>\n<li data-sourcepos=\"23:1-23:114\"><strong>Eri\u015filebilirlik:<\/strong>\u00a0Web sitesinin veya uygulaman\u0131n engelli bireyler taraf\u0131ndan da kullan\u0131labilmesini sa\u011flarlar.<\/li>\n<li data-sourcepos=\"24:1-24:95\"><strong>Test etme ve hata ay\u0131klama:<\/strong>\u00a0Yazd\u0131klar\u0131 kodlar\u0131 test ederek hatalar\u0131 bulur ve d\u00fczeltirler.<\/li>\n<li data-sourcepos=\"25:1-26:0\"><strong>Yeni teknolojileri takip etme:<\/strong>\u00a0Web geli\u015ftirme alan\u0131ndaki yeni teknolojileri takip eder ve \u00f6\u011frenirler.<\/li>\n<\/ul>\n<h3 data-sourcepos=\"27:1-27:51\"><strong>Frontend Developer Nas\u0131l Olunur?<\/strong><\/h3>\n<p data-sourcepos=\"27:1-27:51\"><strong>Frontend developer<\/strong> olmak i\u00e7in gerekli temel beceriler \u015funlard\u0131r:<\/p>\n<ul data-sourcepos=\"31:1-37:0\">\n<li data-sourcepos=\"31:1-31:98\"><strong>Teknik beceriler:<\/strong>\u00a0HTML, CSS ve JavaScript gibi programlama dillerini \u00e7ok iyi bilmek gerekir.<\/li>\n<li data-sourcepos=\"32:1-32:96\"><strong>Problem \u00e7\u00f6zme becerileri:<\/strong>\u00a0Karma\u015f\u0131k problemleri analiz edip \u00e7\u00f6z\u00fcme kavu\u015fturabilmek gerekir.<\/li>\n<li data-sourcepos=\"33:1-33:95\"><strong>\u0130leti\u015fim becerileri:<\/strong>\u00a0Ekip arkada\u015flar\u0131 ve m\u00fc\u015fterilerle etkili ileti\u015fim kurabilmek gerekir.<\/li>\n<li data-sourcepos=\"34:1-34:74\"><strong>Ekip \u00e7al\u0131\u015fmas\u0131:<\/strong>\u00a0Ekip i\u00e7inde uyumlu bir \u015fekilde \u00e7al\u0131\u015fabilmek gerekir.<\/li>\n<li data-sourcepos=\"35:1-35:129\"><strong>Analitik d\u00fc\u015f\u00fcnme becerileri:<\/strong>\u00a0Web sitesinin veya uygulaman\u0131n i\u015fleyi\u015fini ve kullan\u0131c\u0131 ihtiya\u00e7lar\u0131n\u0131 analiz edebilmek gerekir.<\/li>\n<li data-sourcepos=\"36:1-37:0\"><strong>Yarat\u0131c\u0131l\u0131k:<\/strong>\u00a0Kullan\u0131c\u0131 dostu ve estetik tasar\u0131mlar \u00fcretebilmek gerekir.<\/li>\n<\/ul>\n<h4 data-sourcepos=\"38:1-38:31\"><strong>Frontend Developer Ara\u00e7lar\u0131<\/strong><\/h4>\n<p data-sourcepos=\"40:1-40:101\"><strong>Frontend developer<\/strong>&#8216;lar\u0131n i\u015flerini kolayla\u015ft\u0131ran bir\u00e7ok ara\u00e7 vard\u0131r. Bunlardan baz\u0131lar\u0131 \u015funlard\u0131r:<\/p>\n<ul data-sourcepos=\"42:1-46:0\">\n<li data-sourcepos=\"42:1-42:66\"><strong>Kod edit\u00f6rleri:<\/strong>\u00a0Visual Studio Code, Sublime Text, Atom gibi.<\/li>\n<li data-sourcepos=\"43:1-43:107\"><strong>Taray\u0131c\u0131 geli\u015ftirici ara\u00e7lar\u0131:<\/strong>\u00a0Chrome DevTools, Firefox Developer Tools, Safari Developer Tools gibi.<\/li>\n<li data-sourcepos=\"44:1-44:57\"><strong>S\u00fcr\u00fcm kontrol sistemleri:<\/strong>\u00a0Git, SVN, Mercurial gibi.<\/li>\n<li data-sourcepos=\"45:1-46:0\"><strong>Tasar\u0131m ara\u00e7lar\u0131:<\/strong>\u00a0Figma, Sketch, Adobe XD gibi.<\/li>\n<\/ul>\n<h4 data-sourcepos=\"47:1-47:31\"><strong>Frontend Developer Maa\u015flar\u0131<\/strong><\/h4>\n<p data-sourcepos=\"49:1-49:200\"><strong>Frontend developer<\/strong> maa\u015flar\u0131, tecr\u00fcbeye, yetkinliklere ve lokasyona g\u00f6re de\u011fi\u015fiklik g\u00f6stermektedir. 2024 y\u0131l\u0131 itibariyle T\u00fcrkiye&#8217;de ortalama <strong>frontend developer<\/strong> maa\u015f\u0131 25.000 TL civar\u0131ndad\u0131r.<\/p>\n<ul><\/ul>\n<!-- \/wp:post-content -->","protected":false},"excerpt":{"rendered":"<p>\u0130nternetin hayat\u0131m\u0131zdaki yeri her ge\u00e7en g\u00fcn artarken, web siteleri ve uygulamalar da \u00f6nem kazanmaya devam ediyor. Dijital d\u00fcnyan\u0131n temellerini ise web programlama ve yaz\u0131l\u0131m geli\u015ftirme gibi alanlar olu\u015fturuyor. Yaz\u0131l\u0131mc\u0131l\u0131k alanlarda kar\u015f\u0131m\u0131za \u00e7\u0131kan terimlerden biri de frontend&#8216;dir. Peki, frontend nedir ve frontend developer ne i\u015f yapar? Frontend Nedir? Basit\u00e7e ifade etmek gerekirse, frontend bir web sitesinin [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-28","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/mehmetabaci.tr\/index.php?rest_route=\/wp\/v2\/posts\/28","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mehmetabaci.tr\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mehmetabaci.tr\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mehmetabaci.tr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mehmetabaci.tr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=28"}],"version-history":[{"count":0,"href":"https:\/\/mehmetabaci.tr\/index.php?rest_route=\/wp\/v2\/posts\/28\/revisions"}],"wp:attachment":[{"href":"https:\/\/mehmetabaci.tr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=28"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mehmetabaci.tr\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=28"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mehmetabaci.tr\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=28"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}