{"id":1561,"date":"2026-05-24T13:26:08","date_gmt":"2026-05-24T10:26:08","guid":{"rendered":"https:\/\/mudosdigital.com\/tr\/?p=1561"},"modified":"2026-05-24T13:26:09","modified_gmt":"2026-05-24T10:26:09","slug":"yerel-web-sitenizi-gercek-bir-telefonda-nasil-test-edersiniz","status":"publish","type":"post","link":"https:\/\/mudosdigital.com\/tr\/yerel-web-sitenizi-gercek-bir-telefonda-nasil-test-edersiniz\/","title":{"rendered":"Yerel Web Sitenizi Ger\u00e7ek Bir Telefonda Nas\u0131l Test Edersiniz?"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Yerel bilgisayarda bir web sitesi geli\u015ftirirken ilk \u00f6nizleme genellikle ayn\u0131 bilgisayardaki taray\u0131c\u0131da yap\u0131l\u0131r. Bu faydal\u0131d\u0131r, fakat \u00e7ok pratik bir soruyu tek ba\u015f\u0131na cevaplamaz: site ger\u00e7ek bir telefonda nas\u0131l hissettiriyor?<\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:50%\">\n<figure class=\"wp-block-video\"><video autoplay controls loop muted src=\"https:\/\/mudosdigital.com\/wp-content\/uploads\/2026\/05\/ScreenRecording_05-24-2026-12-27-46_1.webm\" playsinline><\/video><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:50%\">\n<p class=\"wp-block-paragraph\">Ayn\u0131 yerel a\u011fa ba\u011fl\u0131 ger\u00e7ek bir telefondan al\u0131nm\u0131\u015f ekran kayd\u0131. Video, yerel olarak geli\u015ftirilen web sitesinin bilgisayar\u0131n LAN IP adresi \u00fczerinden a\u00e7\u0131ld\u0131\u011f\u0131n\u0131 g\u00f6sterir ve geli\u015ftirme sunucusuna ger\u00e7ek bir mobil cihazdan eri\u015filebildi\u011fini do\u011frular.<\/p>\n<\/div>\n<\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Native mobil uygulama geli\u015ftirirken bu t\u00fcr bir test ak\u0131\u015f\u0131 zaten beklenen bir \u015feydir. iOS uygulamas\u0131 geli\u015ftiriyorsan\u0131z Xcode, sim\u00fclat\u00f6rler ve ger\u00e7ek cihaz testleri s\u00fcrecin do\u011fal par\u00e7as\u0131d\u0131r. Android taraf\u0131nda da Android Studio, em\u00fclat\u00f6rler ve USB ya da kablosuz cihaz debugging ak\u0131\u015f\u0131 genellikle normal geli\u015ftirme d\u00f6ng\u00fcs\u00fcne dahildir.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Web geli\u015ftirme ise \u00e7o\u011fu zaman daha rahat ba\u015flar: <code>localhost<\/code> a\u00e7\u0131l\u0131r, taray\u0131c\u0131 daralt\u0131l\u0131r, belki DevTools i\u00e7indeki responsive mod kullan\u0131l\u0131r ve devam edilir. Bu pratik bir y\u00f6ntemdir, fakat ger\u00e7ek mobil problemleri projenin sonuna kadar saklayabilir. Daha iyi bir web geli\u015ftirme ak\u0131\u015f\u0131, ger\u00e7ek cihaz testini de yerel geli\u015ftirme s\u00fcrecinin par\u00e7as\u0131 haline getirmektir.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Bu rehber yaln\u0131zca Django i\u00e7in ge\u00e7erli de\u011fildir. Ayn\u0131 y\u00f6ntem \u00e7o\u011fu yerel web geli\u015ftirme teknolojisinde kullan\u0131labilir: Django, Laravel, Rails, Express, Vite, Next.js, Flask, FastAPI ve daha fazlas\u0131.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Temel fikir basittir:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Bilgisayar\u0131n yerel a\u011f IP adresini bulun.<\/li>\n\n\n\n<li>Geli\u015ftirme sunucusunu yaln\u0131zca <code>127.0.0.1<\/code> yerine <code>0.0.0.0<\/code> \u00fczerinde \u00e7al\u0131\u015ft\u0131r\u0131n.<\/li>\n\n\n\n<li>Framework host do\u011frulamas\u0131 yap\u0131yorsa LAN hostuna izin verin.<\/li>\n\n\n\n<li>Telefondan <code>http:\/\/BILGISAYAR_IP:PORT\/<\/code> adresini a\u00e7\u0131n.<\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">Bu yaz\u0131da Django test edilen \u00f6rnek projedir, fakat a\u011f y\u00f6ntemi framework ba\u011f\u0131ms\u0131zd\u0131r.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Bu kurulumda telefondan a\u00e7\u0131lan son adres \u015fudur:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>http:&#47;&#47;192.168.1.113:8000\/<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Sizin IP adresiniz muhtemelen farkl\u0131 olacakt\u0131r, ancak y\u00f6ntem ayn\u0131d\u0131r.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">1. Bilgisayar\u0131n Yerel A\u011f IP Adresini Bulun<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Telefon, bilgisayar\u0131n\u0131zdaki geli\u015ftirme sunucusuna ula\u015fmak i\u00e7in <code>127.0.0.1<\/code> adresini kullanamaz. Telefonda <code>127.0.0.1<\/code>, telefonun kendisi anlam\u0131na gelir.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Bu y\u00fczden ilk ad\u0131m bilgisayar\u0131n LAN IP adresini bulmakt\u0131r.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Windows PowerShell \u00fczerinde:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>Get-NetIPAddress -AddressFamily IPv4 |\n  Where-Object { $_.IPAddress -notlike '127.*' -and $_.IPAddress -notlike '169.254*' } |\n  Select-Object InterfaceAlias, IPAddress, PrefixLength<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Bu projede kullan\u0131labilir a\u011f aray\u00fcz\u00fc \u015fuydu:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>Ethernet 3    192.168.1.113    \/24<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Bu, telefon ayn\u0131 a\u011fdaysa \u015fu adresi kullanmas\u0131 gerekti\u011fi anlam\u0131na gelir:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>http:&#47;&#47;192.168.1.113:8000\/<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">2. Geli\u015ftirme Sunucusunu 0.0.0.0 \u00dczerinde \u00c7al\u0131\u015ft\u0131r\u0131n<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Bir\u00e7ok geli\u015ftirme sunucusu varsay\u0131lan olarak <code>127.0.0.1<\/code> adresine ba\u011flan\u0131r. Bu yaln\u0131zca ayn\u0131 bilgisayardan gelen ba\u011flant\u0131lar\u0131 kabul eder.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Telefondan test etmek i\u00e7in sunucunun t\u00fcm a\u011f aray\u00fczlerini dinlemesi gerekir:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>0.0.0.0<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Temel fark \u015fudur:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>127.0.0.1:8000   yaln\u0131zca bilgisayar\n0.0.0.0:8000     yerel a\u011fdan eri\u015fim m\u00fcmk\u00fcn<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Komut, kullan\u0131lan teknolojiye g\u00f6re de\u011fi\u015fir.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Django \u00f6rnek projesi i\u00e7in:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>$env:DJANGO_ALLOWED_HOSTS=\"127.0.0.1,localhost,192.168.1.113\"\npython manage.py runserver 0.0.0.0:8000<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Di\u011fer teknolojilerde komut farkl\u0131 g\u00f6r\u00fcn\u00fcr, fakat fikir ayn\u0131d\u0131r:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code># Vite \/ React \/ Vue \/ Svelte\nnpm run dev -- --host 0.0.0.0\n\n# Next.js\nnext dev -H 0.0.0.0\n\n# Express\napp.listen(3000, \"0.0.0.0\")\n\n# Laravel\nphp artisan serve --host=0.0.0.0 --port=8000\n\n# Rails\nbin\/rails server -b 0.0.0.0\n\n# Flask\nflask run --host=0.0.0.0\n\n# FastAPI\nuvicorn main:app --host 0.0.0.0 --port 8000<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Ara\u00e7lar farkl\u0131d\u0131r, a\u011f prensibi ayn\u0131d\u0131r.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">3. Framework Host Do\u011frulamas\u0131n\u0131 Y\u00f6netin<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Baz\u0131 frameworkler, sunucu <code>0.0.0.0<\/code> \u00fczerinde \u00e7al\u0131\u015ft\u0131\u011f\u0131 anda LAN isteklerini kabul eder. Baz\u0131lar\u0131 ise ek host do\u011frulamas\u0131 yapar.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Django bu konuda daha s\u0131k\u0131 \u00f6rneklerden biridir. Gelen <code>Host<\/code> header de\u011ferini kontrol eder. Telefon <code>http:\/\/192.168.1.113:8000\/<\/code> adresini a\u00e7t\u0131\u011f\u0131nda Django \u015funu g\u00f6r\u00fcr:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>Host: 192.168.1.113:8000<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Bu host izinli de\u011filse Django iste\u011fi reddedebilir.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Tek bir IP adresini do\u011frudan <code>settings.py<\/code> i\u00e7ine yazmak yerine, Django \u00f6rnek projesi izinli hostlar\u0131 environment variable \u00fczerinden okuyacak \u015fekilde g\u00fcncellendi:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>import os\nfrom pathlib import Path\n\nALLOWED_HOSTS = &#91;\n    host.strip()\n    for host in os.environ.get(\"DJANGO_ALLOWED_HOSTS\", \"127.0.0.1,localhost\").split(\",\")\n    if host.strip()\n]<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Bu yakla\u015f\u0131m projeyi esnek tutar. Bug\u00fcn IP adresi <code>192.168.1.113<\/code> olabilir; yar\u0131n farkl\u0131 bir de\u011fer olabilir.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ba\u015fka bir framework kullan\u0131yorsan\u0131z benzer ayarlar\u0131 aray\u0131n:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>allowed hosts<\/li>\n\n\n\n<li>trusted hosts<\/li>\n\n\n\n<li>host header validation<\/li>\n\n\n\n<li>dev server host allowlist<\/li>\n\n\n\n<li>telefon ayr\u0131 bir API \u00e7a\u011f\u0131r\u0131yorsa CORS veya origin ayarlar\u0131<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u0130simler de\u011fi\u015fir, fakat neden ayn\u0131d\u0131r: framework, telefonun kulland\u0131\u011f\u0131 host adresine g\u00fcvenmek zorunda olabilir.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">4. Sunucunun Dinledi\u011fini Do\u011frulay\u0131n<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Sunucuyu ba\u015flatt\u0131ktan sonra yaln\u0131zca localhost \u00fczerinde \u00e7al\u0131\u015fmad\u0131\u011f\u0131n\u0131 do\u011frulay\u0131n.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Windows \u00fczerinde:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>Get-NetTCPConnection -LocalPort 8000<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Sonu\u00e7 \u015funa benzer olmal\u0131d\u0131r:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>LocalAddress    LocalPort    State\n0.0.0.0         8000         Listen<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Bu projede sunucunun \u015fu adreste dinledi\u011fi do\u011fruland\u0131:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>0.0.0.0:8000<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Bu, firewall izin verdi\u011fi s\u00fcrece LAN ba\u011flant\u0131lar\u0131n\u0131n s\u00fcrece ula\u015fabilece\u011fi anlam\u0131na gelir.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">5. Host Davran\u0131\u015f\u0131n\u0131 Test Edin<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u00d6rnek proje Django oldu\u011fu i\u00e7in host davran\u0131\u015f\u0131 do\u011frudan test edildi.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u0130lk test, LAN hostuna izin verildi\u011finde ana sayfan\u0131n render edildi\u011fini kan\u0131tlar:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>@override_settings(ALLOWED_HOSTS=&#91;\"192.168.1.113\"])\ndef test_lan_host_can_render_homepage_when_allowed(self):\n    response = self.client.get(\n        reverse(\"services:service_list\"),\n        HTTP_HOST=\"192.168.1.113:8000\",\n    )\n\n    self.assertEqual(response.status_code, 200)\n    self.assertContains(response, \"Professional Cleaning Services\")<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u0130kinci test tersini kan\u0131tlar: ayn\u0131 host izinli de\u011filse reddedilir.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>@override_settings(ALLOWED_HOSTS=&#91;\"127.0.0.1\"])\ndef test_lan_host_is_rejected_when_not_allowed(self):\n    response = self.client.get(\n        reverse(\"services:service_list\"),\n        HTTP_HOST=\"192.168.1.113:8000\",\n    )\n\n    self.assertEqual(response.status_code, 400)<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Bu, Django \u00f6rne\u011findeki g\u00fcvenlik s\u0131n\u0131r\u0131n\u0131 a\u00e7\u0131k\u00e7a belgelendirir. Telefon URL&#8217;i yaln\u0131zca LAN hostu a\u00e7\u0131k\u00e7a izinli oldu\u011funda \u00e7al\u0131\u015f\u0131r.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ba\u015fka bir frameworkte ayn\u0131 davran\u0131\u015f\u0131 farkl\u0131 \u015fekilde test edebilirsiniz. \u00d6rne\u011fin geli\u015ftirme sunucusunun LAN URL&#8217;ine cevap verdi\u011fini, API&#8217;nin origin de\u011ferini kabul etti\u011fini veya host allowlist i\u00e7inde LAN IP adresinin bulundu\u011funu kontrol edebilirsiniz.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">6. Test Paketini \u00c7al\u0131\u015ft\u0131r\u0131n<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">LAN host testleri eklendikten sonra t\u00fcm test paketi \u00e7al\u0131\u015ft\u0131r\u0131ld\u0131:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>python manage.py test<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Sonu\u00e7:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>Found 13 test(s).\nSystem check identified no issues (0 silenced).\n.............\n----------------------------------------------------------------------\nRan 13 tests in 0.834s\n\nOK<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u00d6rnek proje art\u0131k hem normal web sitesi davran\u0131\u015f\u0131 hem de yerel a\u011f eri\u015fimi i\u00e7in otomatik test kapsam\u0131na sahip.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">7. Localhost, LAN ve TCP Eri\u015fimini Do\u011frulay\u0131n<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u00d6nce yerel bilgisayardan kontrol yap\u0131ld\u0131:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>Invoke-WebRequest -UseBasicParsing http:\/\/127.0.0.1:8000\/<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Sonu\u00e7:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>localhost status=200 contains=True<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Ard\u0131ndan ayn\u0131 bilgisayardan LAN IP adresi kontrol edildi:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>Invoke-WebRequest -UseBasicParsing http:\/\/192.168.1.113:8000\/<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Sonu\u00e7:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>lan status=200 contains=True<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Son olarak TCP portu kontrol edildi:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>Test-NetConnection -ComputerName 192.168.1.113 -Port 8000<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Sonu\u00e7:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>TcpTestSucceeded: True<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Bu noktada geli\u015ftirme sunucusu do\u011fru aray\u00fcz\u00fc dinliyor, \u00f6rnek framework LAN hostuna izin veriyor ve port cevap veriyor.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">8. Siteyi Telefonda A\u00e7\u0131n<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Ayn\u0131 Wi-Fi veya yerel a\u011fa ba\u011fl\u0131 bir telefonda \u015fu adresi a\u00e7\u0131n:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>http:&#47;&#47;192.168.1.113:8000\/<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Sayfa a\u00e7\u0131l\u0131yorsa ayn\u0131 yerel web sitesini ger\u00e7ek bir mobil cihazdan g\u00f6r\u00fcyorsunuz demektir.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">A\u00e7\u0131lm\u0131yorsa \u015funlar\u0131 kontrol edin:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Telefon ve bilgisayar ayn\u0131 a\u011fda m\u0131?<\/li>\n\n\n\n<li>Geli\u015ftirme sunucusu yaln\u0131zca <code>127.0.0.1<\/code> \u00fczerinde de\u011fil, <code>0.0.0.0<\/code> \u00fczerinde mi \u00e7al\u0131\u015f\u0131yor?<\/li>\n\n\n\n<li>Framework host do\u011frulamas\u0131 yap\u0131yorsa bilgisayar\u0131n LAN IP adresine izin veriyor mu?<\/li>\n\n\n\n<li>Windows Firewall ilgili process veya porta gelen ba\u011flant\u0131ya izin veriyor mu?<\/li>\n\n\n\n<li>A\u011f private\/trusted m\u0131, yoksa izole bir guest Wi-Fi m\u0131?<\/li>\n\n\n\n<li>Frontend ayr\u0131 bir API \u00e7a\u011f\u0131r\u0131yorsa o API de telefondan eri\u015filebilir mi?<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">9. Bu Neden \u00d6nemli?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Taray\u0131c\u0131daki responsive mod faydal\u0131d\u0131r, fakat yine de bir yakla\u015f\u0131md\u0131r. Ger\u00e7ek telefon, masa\u00fcst\u00fc taray\u0131c\u0131 ara\u00e7lar\u0131n\u0131n ka\u00e7\u0131rabilece\u011fi detaylar\u0131 g\u00f6sterebilir:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Dokunma alanlar\u0131n\u0131n boyutu<\/li>\n\n\n\n<li>Ger\u00e7ek font render davran\u0131\u015f\u0131<\/li>\n\n\n\n<li>Mobil taray\u0131c\u0131 aray\u00fcz\u00fc<\/li>\n\n\n\n<li>A\u011f gecikmesi<\/li>\n\n\n\n<li>Scroll davran\u0131\u015f\u0131<\/li>\n\n\n\n<li>Sticky header veya form \u00e7evresindeki layout problemleri<\/li>\n\n\n\n<li>Ger\u00e7ek cihaz klavyesinin davran\u0131\u015f\u0131<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">LAN eri\u015fimi, deploy etmeden \u00f6nce yerel siteyi ger\u00e7ek cihazda test etmeyi m\u00fcmk\u00fcn k\u0131lar. Bu k\u00fc\u00e7\u00fck bir kurulum de\u011fi\u015fikli\u011fidir, fakat geri bildirim kalitesini ciddi \u015fekilde art\u0131r\u0131r.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Bu yakla\u015f\u0131m web geli\u015ftirmeyi, mobil uygulama geli\u015ftirmede zaten beklenen test disiplinine yakla\u015ft\u0131r\u0131r. Bir web sitesini telefonda test etmek i\u00e7in Xcode veya Android Studio gerekmez, fakat yerel bir cihaz test yoluna ihtiya\u00e7 vard\u0131r. Geli\u015ftirme sunucusunu kendi telefonunuzdan a\u00e7mak bunu \u00e7ok d\u00fc\u015f\u00fck maliyetle sa\u011flar.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u00d6zellikle aktif geli\u015ftirme s\u0131ras\u0131nda faydal\u0131d\u0131r:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Mobil bo\u015fluk ve hizalama sorunlar\u0131n\u0131 m\u00fc\u015fteri g\u00f6rmeden yakalayabilirsiniz.<\/li>\n\n\n\n<li>Navigasyon, butonlar, formlar ve sticky header gibi alanlar\u0131 ger\u00e7ek dokunma girdisiyle test edebilirsiniz.<\/li>\n\n\n\n<li>Tasar\u0131m\u0131n mobil taray\u0131c\u0131 aray\u00fcz\u00fc i\u00e7inde hala iyi hissettirip hissettirmedi\u011fini g\u00f6rebilirsiniz.<\/li>\n\n\n\n<li>Yerel API \u00e7a\u011fr\u0131lar\u0131n\u0131n ve frontend davran\u0131\u015f\u0131n\u0131n masa\u00fcst\u00fc taray\u0131c\u0131 d\u0131\u015f\u0131nda da \u00e7al\u0131\u015ft\u0131\u011f\u0131n\u0131 do\u011frulayabilirsiniz.<\/li>\n\n\n\n<li>Dok\u00fcmantasyon, QA veya m\u00fc\u015fteri g\u00fcncellemeleri i\u00e7in ger\u00e7ek ekran g\u00f6r\u00fcnt\u00fcleri alabilirsiniz.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u00d6nemli olan zamanlamad\u0131r. Mobil test son cilalama ad\u0131m\u0131 olmamal\u0131d\u0131r. Web sitesi h\u00e2l\u00e2 geli\u015ftirilirken yap\u0131lmal\u0131d\u0131r.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">10. M\u00fc\u015fteri Ayn\u0131 A\u011fda De\u011filse Ne Yap\u0131l\u0131r?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">LAN y\u00f6nteminin net bir s\u0131n\u0131r\u0131 vard\u0131r: <code>192.168.1.113<\/code> \u00f6zel bir a\u011f adresidir. Yaln\u0131zca ayn\u0131 yerel a\u011fa ba\u011fl\u0131 cihazlarda \u00e7al\u0131\u015f\u0131r.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">M\u00fc\u015fteri sizin Wi-Fi veya yerel a\u011f\u0131n\u0131zda de\u011filse \u015fu adresi a\u00e7amaz:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>http:&#47;&#47;192.168.1.113:8000\/<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Uzaktaki bir m\u00fc\u015fteri i\u00e7in public veya payla\u015f\u0131lan bir eri\u015fim yolu gerekir. Yayg\u0131n se\u00e7enekler \u015funlard\u0131r.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Se\u00e7enek 1: Ge\u00e7ici T\u00fcnel<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">H\u0131zl\u0131 bir demo i\u00e7in Ngrok, Cloudflare Tunnel, Tailscale Funnel veya LocalTunnel gibi bir t\u00fcnel arac\u0131 kullan\u0131labilir.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Fikir \u015fudur:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>local port 8000 -&gt; public HTTPS tunnel URL -&gt; m\u00fc\u015fteri taray\u0131c\u0131s\u0131<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u00d6rnek:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>ngrok http 8000<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">M\u00fc\u015fteri \u015funa benzer bir URL al\u0131r:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>https:&#47;&#47;example-subdomain.ngrok-free.app<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Bu genellikle yerel \u00e7al\u0131\u015fmay\u0131 uzaktaki bir m\u00fc\u015fteriye g\u00f6stermenin en h\u0131zl\u0131 yoludur. K\u0131sa demolar, tasar\u0131m incelemeleri ve h\u0131zl\u0131 geri bildirim oturumlar\u0131 i\u00e7in uygundur.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Dikkatli kullan\u0131n:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>T\u00fcneli yaln\u0131zca ihtiya\u00e7 oldu\u011funda a\u00e7\u0131k tutun.<\/li>\n\n\n\n<li>Ger\u00e7ek secret de\u011ferlerini veya production verilerini a\u00e7\u0131\u011fa \u00e7\u0131karmay\u0131n.<\/li>\n\n\n\n<li>HTTPS t\u00fcnel URL&#8217;lerini tercih edin.<\/li>\n\n\n\n<li>Ara\u00e7 destekliyorsa basic authentication ekleyin.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">Se\u00e7enek 2: \u00d6zel A\u011f veya VPN<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Siteyi public olarak a\u00e7madan uzaktan eri\u015fim vermek istiyorsan\u0131z Tailscale, ZeroTier veya geleneksel VPN gibi \u00f6zel a\u011f ara\u00e7lar\u0131 kullan\u0131labilir.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">M\u00fc\u015fteri kontroll\u00fc bir \u00f6zel a\u011fa kat\u0131l\u0131r ve geli\u015ftirme sunucunuzu bu \u00f6zel rota \u00fczerinden a\u00e7ar.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Bu public t\u00fcnele g\u00f6re daha g\u00fcvenlidir, fakat m\u00fc\u015fterinin bir \u015fey kurmas\u0131n\u0131 veya yap\u0131land\u0131rmas\u0131n\u0131 gerektirir.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u015eu durumlarda iyi \u00e7al\u0131\u015f\u0131r:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>m\u00fc\u015fteri teknikse,<\/li>\n\n\n\n<li>eri\u015fim yaln\u0131zca onayl\u0131 ki\u015filerle s\u0131n\u0131rl\u0131 olmal\u0131ysa,<\/li>\n\n\n\n<li>proje public olarak eri\u015filebilir olmamal\u0131ysa,<\/li>\n\n\n\n<li>d\u00fczenli \u00f6zel incelemeler gerekiyorsa.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">Se\u00e7enek 3: Staging Deployment<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">M\u00fc\u015fteri onay\u0131, QA ve ger\u00e7ek\u00e7i testler i\u00e7in \u00e7o\u011fu zaman en profesyonel se\u00e7enek staging ortam\u0131d\u0131r.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Laptop&#8217;\u0131n\u0131z\u0131 d\u0131\u015far\u0131 a\u00e7mak yerine projeyi staging ortam\u0131na deploy edersiniz:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>Git repository -&gt; staging server -&gt; staging URL -&gt; m\u00fc\u015fteri incelemesi<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u00d6rnek:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>https:&#47;&#47;staging.example.com<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Staging ortam\u0131 \u015fu durumlarda daha iyidir:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>m\u00fc\u015fteri tekrar tekrar eri\u015fecekse,<\/li>\n\n\n\n<li>birden fazla ki\u015fi siteyi inceleyecekse,<\/li>\n\n\n\n<li>ger\u00e7ek HTTPS\/domain davran\u0131\u015f\u0131 gerekiyorsa,<\/li>\n\n\n\n<li>deployment loglar\u0131 isteniyorsa,<\/li>\n\n\n\n<li>sabit bir URL gerekiyorsa,<\/li>\n\n\n\n<li>inceleme s\u00fcreci g\u00fcnler veya haftalar s\u00fcrecekse.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Bu proje i\u00e7in PostgreSQL ve environment variable deste\u011fi olan y\u00f6netilen bir platform iyi bir staging hedefi olur.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Se\u00e7enek 4: Router Port Forwarding<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Teknik olarak router port forwarding ayarlayarak bilgisayar\u0131n\u0131z\u0131 do\u011frudan d\u0131\u015far\u0131 a\u00e7abilirsiniz.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Bu genellikle \u015fu anlama gelir:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>public router IP -&gt; forwarded port -&gt; local computer -&gt; dev server<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">M\u00fc\u015fteri demolar\u0131 i\u00e7in \u00e7o\u011fu durumda en zay\u0131f se\u00e7enektir.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ka\u00e7\u0131nma nedenleri:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>ev veya ofis IP adresi de\u011fi\u015febilir,<\/li>\n\n\n\n<li>HTTPS otomatik de\u011fildir,<\/li>\n\n\n\n<li>firewall kurallar\u0131 k\u0131r\u0131lgan olabilir,<\/li>\n\n\n\n<li>bilgisayar\u0131n\u0131z\u0131n a\u00e7\u0131k kalmas\u0131 gerekir,<\/li>\n\n\n\n<li>geli\u015ftirme sunucusu daha do\u011frudan d\u0131\u015far\u0131 a\u00e7\u0131l\u0131r,<\/li>\n\n\n\n<li>a\u00e7\u0131k portu unutmak kolayd\u0131r.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Bunun yerine t\u00fcnel, \u00f6zel a\u011f veya staging deployment kullanmak daha sa\u011fl\u0131kl\u0131d\u0131r.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Karar Tablosu<\/h3>\n\n\n\n<figure class=\"wp-block-table\"><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Kural basittir: kendi cihazlar\u0131n\u0131z i\u00e7in LAN eri\u015fimini, h\u0131zl\u0131 uzaktan demolar i\u00e7in t\u00fcneli, ciddi m\u00fc\u015fteri incelemesi i\u00e7in staging ortam\u0131n\u0131 kullan\u0131n.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Sonu\u00e7<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Yerel bir web sitesini telefondan a\u00e7mak i\u00e7in \u00fc\u00e7 \u015feyin ayn\u0131 anda do\u011fru olmas\u0131 gerekir:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Bilgisayar\u0131n LAN IP adresi bilinmelidir.<\/li>\n\n\n\n<li>Geli\u015ftirme sunucusu <code>0.0.0.0<\/code> \u00fczerinde dinlemelidir.<\/li>\n\n\n\n<li>Framework host do\u011frulamas\u0131 yap\u0131yorsa LAN hostuna izin verilmelidir.<\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">Bu projede \u00e7al\u0131\u015fan telefon URL&#8217;i \u015fudur:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>http:&#47;&#47;192.168.1.113:8000\/<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Kurulum framework testleri, HTTP kontrolleri ve TCP port kontrol\u00fc ile do\u011fruland\u0131. Django test edilen \u00f6rnekti, fakat y\u00f6ntem yerel web geli\u015ftirme i\u00e7in geni\u015f \u015fekilde uygulanabilir.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">A\u011f\u0131n\u0131z d\u0131\u015f\u0131ndaki m\u00fc\u015fteriler i\u00e7in LAN URL&#8217;i yeterli de\u011fildir. H\u0131zl\u0131 demolar i\u00e7in ge\u00e7ici t\u00fcnel, kontroll\u00fc eri\u015fim i\u00e7in \u00f6zel a\u011f, profesyonel m\u00fc\u015fteri incelemesi i\u00e7in staging deployment kullan\u0131n.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Evidence<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Yerel a\u011f IP adresi 192.168.1.113 olarak tespit edildi<\/li>\n\n\n\n<li>Geli\u015ftirme sunucusu 0.0.0.0:8000 \u00fczerinde ba\u015flat\u0131ld\u0131<\/li>\n\n\n\n<li>Django \u00f6rnek projesinde 127.0.0.1, localhost ve 192.168.1.113 hostlar\u0131na izin verildi<\/li>\n\n\n\n<li>Localhost iste\u011fi 200 d\u00f6nd\u00fcrd\u00fc<\/li>\n\n\n\n<li>LAN IP iste\u011fi 200 d\u00f6nd\u00fcrd\u00fc<\/li>\n\n\n\n<li>192.168.1.113:8000 i\u00e7in TCP testi ba\u015far\u0131l\u0131 oldu<\/li>\n\n\n\n<li>Test paketi ge\u00e7ti: 13 test<\/li>\n\n\n\n<li>Uzaktaki m\u00fc\u015fteri eri\u015fimi i\u00e7in t\u00fcnel, VPN\/\u00f6zel a\u011f, staging ve production deployment se\u00e7enekleri kavramsal olarak belgelendi<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>A practical walkthrough for making any local development website accessible from a real phone, so mobile testing becomes part of the build process instead of a final guess.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[22],"tags":[],"class_list":["post-1561","post","type-post","status-publish","format-standard","hentry","category-blog"],"_links":{"self":[{"href":"https:\/\/mudosdigital.com\/tr\/wp-json\/wp\/v2\/posts\/1561","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mudosdigital.com\/tr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mudosdigital.com\/tr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mudosdigital.com\/tr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mudosdigital.com\/tr\/wp-json\/wp\/v2\/comments?post=1561"}],"version-history":[{"count":1,"href":"https:\/\/mudosdigital.com\/tr\/wp-json\/wp\/v2\/posts\/1561\/revisions"}],"predecessor-version":[{"id":1562,"href":"https:\/\/mudosdigital.com\/tr\/wp-json\/wp\/v2\/posts\/1561\/revisions\/1562"}],"wp:attachment":[{"href":"https:\/\/mudosdigital.com\/tr\/wp-json\/wp\/v2\/media?parent=1561"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mudosdigital.com\/tr\/wp-json\/wp\/v2\/categories?post=1561"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mudosdigital.com\/tr\/wp-json\/wp\/v2\/tags?post=1561"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}