Zaman tuhaf bir şey. Hâlâ HTML, CSS ve JavaScript kodlamayı keşfettiğim günü hatırlıyorum. İlk üniversite programlama dersimi, ilk kodlama işimin ilk gününü, ikinci işimin ilk gününü ve Mozilla'daki ilk günümü hâlâ dün gibi anımsıyorum. MetaMask'te kod yazmaya başladığım ilk gün de hafızamda taze. Bu yıl, profesyonel bir yazılım mühendisi olarak 20. yılımı dolduruyorum ve her şey bir göz açıp kapayıncaya kadar geçti.
Arada bir, genç bir mühendise eski bir programlama referansı yapıyorum ve ne hakkında konuştuğumu anlamadıklarını fark ediyorum. O kadar yaşlandım ki... Web sayfası düzenlerietiketleriyle yapılırken, bu yeni 'CSS float' özelliği yeni standart olmaya başlamıştı. Yuvarlatılmış köşeler resimlerle ve Internet Explorer için VML hileleriyle elde ediliyordu. FTP, web sitesi değişikliklerini yüklemek için en iyi yöntemdi.
SVN ve onun trunk'ını kopyalamak en iyi sürüm kontrol aracıydı. alert ve confirm, 'modal' için standarttı. Firebug, mevcut en iyi hata ayıklama aracıydı. Videoları düzgün oynatmanın 'standardı', doğru codec'i bulmaktı. ActionScript bilgisi, JavaScript bilgisi kadar değerliydi. Dreamweaver, en iyi metin düzenleyici ve tasarım aracıydı. XML, veri yapılarının geleceğiydi.
Mobil öncelikli mi? Mobil yoktu. Reaktif navigasyon mu? Java Applet'leri deneyin... hatta mouseover ve mouseleave'de farklı
kullanmak! Web teknolojileriyle masaüstü uygulaması mı kodlamak istiyorsunuz? Adobe Air'i deneyin! NPM, 'performanslı değil, adamım' anlamına geliyordu. Bir ankete oy vermek, sayfanın yenilenmesi anlamına geliyordu. 'Sosyal medya' HotOrNot.com demekti.
Web'in sevgi sesi, 56k modem bağlantısının mırıltısıydı. Sağ tıklamayı devre dışı bırakmak, resim güvenliğini sağlıyordu. Bitmap (.bmp) geçerli bir resim formatıydı. JavaScript'in JScript adında bir rakibi vardı. SpyJax'ing, kullanıcınızın nerede olduğunu tespit etmenizi sağlıyordu. Çerezler, kullanıcı takibinin zirvesiydi. Sosyal medya duvarı mı? Buna 'misafir defteri' denirdi... ve arkadaş listesi mi? 'Web ring' denirdi. Arama motoru optimizasyonu,
etiketini anahtar kelimelerle doldurmaktı.</p><h3>Önemli Gelişmeler</h3><p>Vay be, işte o günlerdi. Siz web'de kaç yaşındasınız?</p><p class="post-source"><em>Kaynak: <a href="https://davidwalsh.name/im-so-old-1" target="_blank" rel="nofollow noopener">davidwalsh.name</a></em></p> </div> <!-- ADS SECTION — CLS için sabit yükseklik --> <div class="mt-5 mb-4 text-center"> <div id="container-2eb275699028da5a466582ba91a44bdd" style="min-height:280px;display:flex;align-items:center;justify-content:center"></div> <script async="async" data-cfasync="false" src="https://pl30155735.effectivecpmnetwork.com/2eb275699028da5a466582ba91a44bdd/invoke.js"></script> </div> <!-- TAGS --> <nav class="post-nav" aria-label="Yazı gezintisi"> <a href="https://niceblogger.net/blog/css-attribute-secicilerde-buyukkucuk-harf-duyarsizligi-attr-i-kullanimi" class="post-nav__link post-nav__link--prev"> <span class="post-nav__label">← Önceki Yazı</span> <span class="post-nav__title">CSS Attribute Seçicilerde Büyük/Küçük Harf Duyarsızlığı: [attr i] Kullanımı</span> </a> <a href="https://niceblogger.net/blog/web-sitenizdeki-cls-sorunlarini-nasil-cozersiniz-davidwalshblog-ornegi" class="post-nav__link post-nav__link--next"> <span class="post-nav__label">Sonraki Yazı →</span> <span class="post-nav__title">Web Sitenizdeki CLS Sorunlarını Nasıl Çözersiniz? DavidWalshBlog Örneği</span> </a> </nav> <div class="post-tags"> <span class="post-tags__label"> <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"/><line x1="7" y1="7" x2="7.01" y2="7"/></svg> Etiketler: </span> <div class="post-tags__list"> <a href="https://niceblogger.net/tag/hacker" class="tag-badge">hacker</a> <a href="https://niceblogger.net/tag/veri-tabani" class="tag-badge">veri tabanı</a> <a href="https://niceblogger.net/tag/sanal-gerceklik" class="tag-badge">sanal gerçeklik</a> <a href="https://niceblogger.net/tag/veri-bilimi" class="tag-badge">veri bilimi</a> <a href="https://niceblogger.net/tag/cloud" class="tag-badge">cloud</a> <a href="https://niceblogger.net/tag/macos" class="tag-badge">macos</a> </div> </div> <!-- SHARE --> <div class="post-share"> <span class="post-share__label">Paylaş:</span> <a href="https://twitter.com/intent/tweet?url=http%3A%2F%2Flocalhost%2Fblog%2Fwebin-ilk-caglarindan-gunumuze-bir-yazilim-gelistiricinin-nostalji-yolculugu&text=Web%27in+%C4%B0lk+%C3%87a%C4%9Flar%C4%B1ndan+G%C3%BCn%C3%BCm%C3%BCze%3A+Bir+Yaz%C4%B1l%C4%B1m+Geli%C5%9Ftiricinin+Nostalji+Yolculu%C4%9Fu" class="post-share__btn post-share__btn--twitter" target="_blank" rel="noopener noreferrer" aria-label="Twitter'da paylaş"> <svg width="17" height="17" viewBox="0 0 24 24" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-4.714-6.231-5.401 6.231H2.747l7.73-8.835L1.254 2.25H8.08l4.259 5.632zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg> </a> <a href="https://www.linkedin.com/sharing/share-offsite/?url=http%3A%2F%2Flocalhost%2Fblog%2Fwebin-ilk-caglarindan-gunumuze-bir-yazilim-gelistiricinin-nostalji-yolculugu" class="post-share__btn post-share__btn--linkedin" target="_blank" rel="noopener noreferrer" aria-label="LinkedIn'de paylaş"> <svg width="17" height="17" viewBox="0 0 24 24" fill="currentColor"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"/><rect x="2" y="9" width="4" height="12"/><circle cx="4" cy="4" r="2"/></svg> </a> <button class="post-share__btn post-share__btn--copy" id="js-copy-link" title="Bağlantıyı kopyala" aria-label="Bağlantıyı kopyala"> <svg width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg> </button> </div> </article> <!-- SIDEBAR: TOC --> </div> </div> <!-- RELATED POSTS --> <section class="section section--related"> <div class="container"> <div class="section-header"> <h2 class="section-header__title">İlgili Yazılar</h2> <span class="section-header__line"></span> </div> <div class="related-posts-grid"> <article class="post-card"> <a href="https://niceblogger.net/blog/shokz-openrun-pro-kulaklik-amazonda-tarihin-en-dusuk-fiyatinda-100-dolarin-altinda" class="post-card__image-wrap post-card__image-wrap--sm"> <img src="https://niceblogger.net/uploads/post_36075_1784277182.webp" alt="Shokz OpenRun Pro Kulaklık Amazon'da Tarihin En Düşük Fiyatında: 100 Doların Altında" class="post-card__image" loading="lazy"> </a> <div class="post-card__body"> <a href="https://niceblogger.net/category/yazilim" class="post-card__cat-link" style="color:#8b5cf6">Yazılım</a> <h3 class="post-card__title post-card__title--sm"> <a href="https://niceblogger.net/blog/shokz-openrun-pro-kulaklik-amazonda-tarihin-en-dusuk-fiyatinda-100-dolarin-altinda">Shokz OpenRun Pro Kulaklık Amazon'da Tarihin En Düşük Fiyatında: 100 Doların Altında</a> </h3> <p class="post-card__excerpt post-card__excerpt--sm">Shokz OpenRun Pro kemik iletimli kulaklık Amazon'da 99,95 dolara düştü. Tarihin en dü...</p> <div class="post-card__meta"> <span class="post-card__meta-item"> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg> 2 dk </span> <span class="post-card__meta-item"> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg> 2 </span> <span class="post-card__meta-item">3 saat önce</span> </div> </div> </article> <article class="post-card"> <a href="https://niceblogger.net/blog/interpoldan-dev-operasyon-97-ulkede-sosyal-muhendislik-dolandiriciligina-darbe" class="post-card__image-wrap post-card__image-wrap--sm"> <img src="https://niceblogger.net/uploads/post_45747_1783634687.webp" alt="INTERPOL'dan Dev Operasyon: 97 Ülkede Sosyal Mühendislik Dolandırıcılığına Darbe" class="post-card__image" loading="lazy"> </a> <div class="post-card__body"> <a href="https://niceblogger.net/category/yazilim" class="post-card__cat-link" style="color:#8b5cf6">Yazılım</a> <h3 class="post-card__title post-card__title--sm"> <a href="https://niceblogger.net/blog/interpoldan-dev-operasyon-97-ulkede-sosyal-muhendislik-dolandiriciligina-darbe">INTERPOL'dan Dev Operasyon: 97 Ülkede Sosyal Mühendislik Dolandırıcılığına Darbe</a> </h3> <p class="post-card__excerpt post-card__excerpt--sm">INTERPOL koordinasyonunda 97 ülkede eş zamanlı yürütülen operasyonda 5.811 kişi tut...</p> <div class="post-card__meta"> <span class="post-card__meta-item"> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg> 3 dk </span> <span class="post-card__meta-item"> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg> 17 </span> <span class="post-card__meta-item">1 hafta önce</span> </div> </div> </article> <article class="post-card"> <a href="https://niceblogger.net/blog/coleman-pro-45-litre-sert-sogutucu-amazonda-tarihinin-en-dusuk-fiyatinda-74-dolar-tasarruf-edin" class="post-card__image-wrap post-card__image-wrap--sm"> <img src="https://niceblogger.net/uploads/post_66202_1783600535.webp" alt="Coleman Pro 45 Litre Sert Soğutucu Amazon'da Tarihinin En Düşük Fiyatında: 74 Dolar Tasarruf Edin" class="post-card__image" loading="lazy"> </a> <div class="post-card__body"> <a href="https://niceblogger.net/category/yazilim" class="post-card__cat-link" style="color:#8b5cf6">Yazılım</a> <h3 class="post-card__title post-card__title--sm"> <a href="https://niceblogger.net/blog/coleman-pro-45-litre-sert-sogutucu-amazonda-tarihinin-en-dusuk-fiyatinda-74-dolar-tasarruf-edin">Coleman Pro 45 Litre Sert Soğutucu Amazon'da Tarihinin En Düşük Fiyatında: 74 Dolar Tasarruf Edin</a> </h3> <p class="post-card__excerpt post-card__excerpt--sm">Coleman Pro 45 litre sert soğutucu, Amazon'da 125,99 dolara düştü. 74 dolar tasarruf e...</p> <div class="post-card__meta"> <span class="post-card__meta-item"> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg> 2 dk </span> <span class="post-card__meta-item"> <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg> 9 </span> <span class="post-card__meta-item">1 hafta önce</span> </div> </div> </article> </div> </div> </section> </div><!-- /.blog-post --> <script> (function () { // TOC active link tracking var tocLinks = document.querySelectorAll('.toc-widget__nav a'); if (tocLinks.length) { var headings = []; tocLinks.forEach(function (link) { var id = link.getAttribute('href').replace('#', ''); var el = document.getElementById(id); if (el) headings.push({ el: el, link: link }); }); window.addEventListener('scroll', function () { var scrollY = window.scrollY + 120; var current = null; headings.forEach(function (h) { if (h.el.getBoundingClientRect().top + window.scrollY <= scrollY) { current = h; } }); tocLinks.forEach(function (l) { l.classList.remove('toc-active'); }); if (current) current.link.classList.add('toc-active'); }, { passive: true }); } // Copy link button var copyBtn = document.getElementById('js-copy-link'); if (copyBtn) { copyBtn.addEventListener('click', function () { navigator.clipboard.writeText(window.location.href).then(function () { copyBtn.title = 'Kopyalandı!'; setTimeout(function () { copyBtn.title = 'Bağlantıyı kopyala'; }, 2000); }); }); } // Lightbox Logic var lightbox = document.getElementById('lightbox-modal'); if (lightbox) { var triggers = document.querySelectorAll('.lightbox-trigger'); var lightboxImg = document.getElementById('lightbox-img'); var closeBtn = document.querySelector('.lightbox-close'); var prevBtn = document.querySelector('.lightbox-prev'); var nextBtn = document.querySelector('.lightbox-next'); var currentIndex = 0; var images = []; triggers.forEach(function(trigger, index) { images.push(trigger.getAttribute('href')); trigger.addEventListener('click', function(e) { e.preventDefault(); currentIndex = index; showImage(currentIndex); lightbox.classList.add('active'); document.body.style.overflow = 'hidden'; }); }); function showImage(index) { if (index < 0) index = images.length - 1; if (index >= images.length) index = 0; currentIndex = index; lightboxImg.src = images[currentIndex]; } closeBtn.addEventListener('click', function() { lightbox.classList.remove('active'); document.body.style.overflow = ''; }); lightbox.addEventListener('click', function(e) { if (e.target === lightbox) { lightbox.classList.remove('active'); document.body.style.overflow = ''; } }); prevBtn.addEventListener('click', function() { showImage(currentIndex - 1); }); nextBtn.addEventListener('click', function() { showImage(currentIndex + 1); }); document.addEventListener('keydown', function(e) { if (!lightbox.classList.contains('active')) return; if (e.key === 'Escape') closeBtn.click(); if (e.key === 'ArrowLeft') prevBtn.click(); if (e.key === 'ArrowRight') nextBtn.click(); }); } })(); </script> <!-- Lightbox HTML --> <div id="lightbox-modal" class="lightbox"> <button class="lightbox-close">×</button> <button class="lightbox-prev">❮</button> <img id="lightbox-img" src="" alt="Gallery Image"> <button class="lightbox-next">❯</button> </div> </main> <!-- Footer --> <footer class="site-footer"> <div class="footer-top container"> <div class="footer-brand"> <a href="https://niceblogger.net/" class="footer-logo"> <img src="https://niceblogger.net/assets/images/logo.webp?v=1783957360" alt="NiceBlogger Logo" width="50" height="50" loading="lazy" style="width:50px;height:50px;border-radius:50%;margin-right:15px;object-fit:cover;"> <span class="brand-name">L7WAF</span> </a> <p class="footer-tagline">En İyi Blog Deneyimi</p> <div class="footer-social"> <a href="https://twitter.com/devpulse" target="_blank" rel="noopener" aria-label="Twitter" class="social-link"> <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg> </a> <a href="https://github.com/devpulse" target="_blank" rel="noopener" aria-label="GitHub" class="social-link"> <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0 1 12 6.844a9.59 9.59 0 0 1 2.504.337c1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.02 10.02 0 0 0 22 12.017C22 6.484 17.522 2 12 2z"/></svg> </a> <a href="https://linkedin.com/company/devpulse" target="_blank" rel="noopener" aria-label="LinkedIn" class="social-link"> <svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6zM2 9h4v12H2z"/><circle cx="4" cy="4" r="2"/></svg> </a> </div> </div> <div class="footer-links"> <div class="footer-col"> <h3 class="footer-col-title">Kategoriler</h3> <ul class="footer-nav"> <li><a href="https://niceblogger.net/category/dunya-geneli" class="footer-link">Dünya Geneli</a></li> <li><a href="https://niceblogger.net/category/windows" class="footer-link">Windows</a></li> <li><a href="https://niceblogger.net/category/linux" class="footer-link">Linux</a></li> <li><a href="https://niceblogger.net/category/siber-guvenlik" class="footer-link">Siber Güvenlik</a></li> <li><a href="https://niceblogger.net/category/yazilim" class="footer-link">Yazılım</a></li> </ul> </div> <div class="footer-col"> <h3 class="footer-col-title">Sayfalar</h3> <ul class="footer-nav"> <li><a href="https://niceblogger.net/" class="footer-link">Ana Sayfa</a></li> <li><a href="https://niceblogger.net/qa.php" class="footer-link">Soru & Cevap</a></li> <li><a href="https://niceblogger.net/about.php" class="footer-link">Hakkında</a></li> <li><a href="https://niceblogger.net/contact.php" class="footer-link">İletişim</a></li> <li><a href="https://niceblogger.net/search.php" class="footer-link">Arama</a></li> <li><a href="https://www.effectivecpmnetwork.com/srnrwwub2?key=19f571f979be9f546b4050a2f5c46245" class="footer-link" rel="sponsored" target="_blank">Reklam Ver</a></li> </ul> </div> <div class="footer-col footer-col-tags"> <h3 class="footer-col-title">Popüler Etiketler</h3> <div class="footer-tags"> <a href="https://niceblogger.net/tag/docker" class="tag-badge">Docker</a> <a href="https://niceblogger.net/tag/linux" class="tag-badge">linux</a> <a href="https://niceblogger.net/tag/hacker" class="tag-badge">hacker</a> <a href="https://niceblogger.net/tag/teknoloji" class="tag-badge">teknoloji</a> <a href="https://niceblogger.net/tag/devops" class="tag-badge">devops</a> <a href="https://niceblogger.net/tag/malware" class="tag-badge">malware</a> <a href="https://niceblogger.net/tag/yatirim" class="tag-badge">yatırım</a> <a href="https://niceblogger.net/tag/agile" class="tag-badge">agile</a> <a href="https://niceblogger.net/tag/bilim" class="tag-badge">bilim</a> <a href="https://niceblogger.net/tag/ag-guvenligi" class="tag-badge">ağ güvenliği</a> <a href="https://niceblogger.net/tag/scrum" class="tag-badge">scrum</a> <a href="https://niceblogger.net/tag/donanim" class="tag-badge">donanım</a> </div> </div> </div> </div> <div class="footer-bottom container"> <p class="footer-copy">© 2026 NiceBlogger. Tüm hakları saklıdır.</p> </div> </footer> <!-- Prism.js — defer, yalnızca kod blokları olan sayfalarda aktif --> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/prism.min.js"></script> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-php.min.js"></script> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-javascript.min.js"></script> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-css.min.js"></script> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-bash.min.js"></script> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-yaml.min.js"></script> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-docker.min.js"></script> <!-- Main JS — defer --> <script defer src="https://niceblogger.net/assets/js/theme.min.js?v=1783957360"></script> <script defer src="https://niceblogger.net/assets/js/main.min.js?v=1783957360"></script> <script>window.POST_ID = 6964;</script> <!-- Social Bar Ad — window.load sonrası header'daki yükleyici ile enjekte edilir --> <div data-ad-src="https://pl30262757.effectivecpmnetwork.com/a7/85/ea/a785ea57e6a2e578134b71ada9686c21.js" style="display:none"></div> </body> </html>