• Buradasın

    Frontend

    Özetteki ilgi çekici içerikler

    • CSS Position Kavramı Eğitim Videosu

      Bu video, bir eğitim dersi formatında CSS position kavramını anlatan bir içeriktir. Eğitmen, position özelliğinin beş farklı değerini ve kullanımını detaylı şekilde açıklamaktadır. Video, CSS position kavramının ne olduğunu açıklayarak başlıyor ve ardından statik, relative, absolute, fixed ve sticky değerlerini örneklerle anlatıyor. Her bir position değeri için sayfa üzerindeki konumlandırma, hizalama ve scroll davranışları detaylı olarak gösteriliyor. Eğitmen, özellikle relative ve absolute değerlerinin arasındaki farkları, kapsayıcı elemanların position değerlerinin etkisini ve fix ile sticky değerlerinin kullanım alanlarını vurguluyor. Video, bir sonraki derste bu kavramların tarayıcı üzerinde gösterileceğini belirterek sona eriyor.

      • youtube.com

    • Angular'da Komponent Kavramı ve Kullanımı

      Bu video, Angular programlama dilinde komponent kavramını açıklayan bir eğitim içeriğidir. Eğitmen, Angular projelerinde komponentlerin temel konsept olduğunu ve her birinin bir sınıf olduğunu belirtiyor. Video, komponent kavramının tanımıyla başlayıp, web sayfasındaki farklı bölümlerin (header, sidebar, footer, content) komponent olarak nasıl kullanılabileceğini açıklıyor. Ardından Angular CLI ile yeni bir komponent oluşturma, komponent dosyalarının yapısı (ts, html, spec, style) ve komponent içinde değişken ve fonksiyon tanımlama işlemleri adım adım gösteriliyor. Eğitmen, ilerleyen videolarda gerçek bir proje üzerinden komponentlerle daha detaylı çalışılacağını belirtiyor.

      • youtube.com

    • Vue.js ile Ders Ekleme İşlemi Eğitimi

      Bu video, bir eğitim içeriği olup, izleyicilere Vue.js kullanarak ders ekleme işleminin nasıl yapılacağını adım adım göstermektedir. Video, ders ekleme işleminin tüm aşamalarını kapsamaktadır. Önce form oluşturma, input ekleme ve v-model kullanımı gösterilmektedir. Ardından form submit olayının default özelliğini kapatma, ders ekleme fonksiyonunun yazılması ve ders dizisine yeni obje ekleme işlemleri anlatılmaktadır. Son olarak, inputun CSS ile biçimlendirilmesi ve uygulamanın çalıştırılmasıyla ders ekleme işleminin başarıyla çalıştığı gösterilmektedir.

      • youtube.com

    • HTML5 Parcel View Kullanımı Eğitimi

      Bu video, bir web geliştirme eğitim içeriğidir. Eğitmen, önceki derste layout kavramını öğrendiklerini hatırlatarak, bu derste HTML5 parsel view kavramını anlatmaktadır. Video, büyüyen projelerde müdahale edilebilirliği artırmak ve gereksiz kod yazmanın önüne geçmek için parsel view'in nasıl kullanılacağını göstermektedir. Eğitmen, ana sayfadaki slider ve proje listelerini örnek olarak kullanarak, bu bölümleri ayrı parsel view dosyalarına nasıl taşıyabileceğimizi adım adım göstermektedir. Ayrıca, parsel view'lerin nasıl ekleneceği ve değiştirileceği pratik uygulamalarla anlatılmaktadır.

      • youtube.com

    • Frontend ve Backend Geliştirme Alanında Yapay Zeka Etkisi

      Bu podcast, konuşmacının frontend ve backend geliştirme alanlarında yapay zeka etkisinin nasıl olacağını ele aldığı bir içeriktir. Konuşmacı, yıllardır bu konuda sorular aldığını ve yapay zekanın bu alanlarda nasıl etkileyeceğini tartışmaktadır. Videoda konuşmacı, yapay zeka ile birlikte frontend ve backend geliştirme alanlarının nasıl etkileneceğini analiz ediyor. Kendisinin bu alanda full stack bakış açısını tercih ettiğini ve bunun nedenlerini açıklıyor. Frontend geliştirme alanının daha standartlı ve özgür olduğunu, backend geliştirme alanının ise daha karmaşık ve özel entegrasyonlara sahip olduğunu belirtiyor. Ayrıca, yapay zekanın her iki alanda da gelişmesiyle birlikte, full stack bakış açısına sahip geliştiricilerin iş bulma şansının daha yüksek olacağını vurguluyor.

      • youtube.com

    • Webpack Kurulum ve Yapılandırma Eğitimi

      Bu video, bir eğitmen tarafından sunulan web geliştirme eğitim serisinin bir bölümüdür. Video, webpack ile ilgili temel kurulum ve yapılandırma adımlarını kapsamlı şekilde ele almaktadır. İlk bölümde webpack projesi için gerekli paketlerin ve pluginlerin kurulumu, dosya yapısı, common.config.js dosyası oluşturma ve temel yapılandırmalar gösterilmektedir. İkinci bölümde ise CSS dosyalarının işlenmesi, imaj dosyalarının yönetimi ve hızlı band oluşturma yöntemleri anlatılmaktadır. Eğitim, hem lokal ortamda çalışma hem de production ortamları için farklı config dosyaları oluşturma, pluginler (clean, mini-extract, html-loader) ekleme ve projelerin nasıl çalıştırılacağı konularını içermektedir. Video, bir sonraki derste nasıl çalıştığı konusunun tekrar ele alınacağını belirterek sona ermektedir.

      • youtube.com

    • Frontal Kütüphaneleri Karşılaştırma Serisi: Vics

      Bu video, frontal kütüphanelerini karşılaştıran bir serinin üçüncü bölümüdür. Sunucu, Vics kütüphanesini tanıtmaktadır. Videoda Vics kütüphanesinin 2014 yılında Google çalışanı Avenu tarafından geliştirildiği ve GitHub'da yayınlandığı belirtiliyor. Vics, Angular ve React karışımı bir yapıya sahip olup, HTML ve CSS kodlarının JavaScript kodlarından ayrı tutulması, ES5, ES6 ve TypeScript ile kullanılabilmesi gibi avantajları ile router ve formalidasyon gibi paketlerin View paketi içinde yer almaması ve bağımlılık enjeksiyonu gibi konseptlerin olmaması gibi dezavantajları anlatılıyor. Video, bir sonraki bölümde üç framework'ün detaylı karşılaştırılacağını ve performans durumları, benchmarklar gibi konulara bakılacağını belirterek sona eriyor.

      • youtube.com

    • React ve Redux Eğitim Serisi: İlk Proje Oluşturma

      Bu video, bir eğitim serisinin üçüncü bölümü olup, bir eğitmen tarafından React ve Redux kullanarak basit bir web uygulaması oluşturma sürecini göstermektedir. Video, React ve Redux ile bir proje oluşturma sürecini adım adım anlatmaktadır. Eğitmen önce temel dosyaları (index.js, App.js, Store.js) oluşturup, React ve Redux kütüphanelerini import etmeyi, ardından React Router ile sayfa yönlendirmesini ve Redux store'larını oluşturmayı göstermektedir. Eğitim serisinin stratejisi, önce CC React classs yapısı ile projeyi oluşturup uçtan uca ayağa kaldırmak, sonra aynı projeyi birebir COCATE yapıp React hooks olarak dönüştürmek ve bu dönüşüm sırasında hook kullanımını öğrenmek şeklinde ilerlemektedir.

      • youtube.com

    • HTML ve CSS ile Web Sayfası Tasarımı Eğitimi

      Bu video, Tayfun Erbilen tarafından sunulan bir web tasarım eğitim içeriğidir. Eğitmen, izleyicilere HTML ve CSS kullanarak bir PSD tasarımını web sayfasına dönüştürme sürecini adım adım göstermektedir. Videoda, bir web sayfasının tüm bölümlerinin (logo, menü, blog, now, sağ ve sol bölümler, konu bölüm, sayfalaama, footer ve iletişim bilgileri) HTML ve CSS kodlarıyla nasıl oluşturulacağı detaylı olarak anlatılmaktadır. Eğitim, temel web tasarım tekniklerini kapsayan bir rehber niteliğindedir. Eğitimde ayrıca Cufon kullanılarak özel font uygulama, float ve clear gibi CSS özellikleri, farklı tarayıcı uyumluluğu testleri ve jQuery ile hover efektleri gibi ileri seviye konular da ele alınmaktadır. Video, HTML ve CSS bilgisi olanlar için blog tasarımı yapmak isteyenler için faydalı bir kaynak niteliğindedir.

      • youtube.com

    • AngularJS Eğitim Videosu

      Bu video, bir eğitmen tarafından sunulan AngularJS programlama dilini öğretmeyi amaçlayan kapsamlı bir eğitim içeriğidir. Video, AngularJS'in temel kavramlarını ve kullanımını adım adım göstermektedir. İlk bölümde AngularJS'in ne olduğu, temel bileşenleri (direktifler, expressionlar, filter'lar, controller'lar, modüller, HTTP, form validation, API, Bootstrap) ve öğrenme süreci tanıtılmaktadır. İkinci bölümde ise Angular expressionların nasıl kullanıldığı, double braces içinde yazılması, veri bağlama işlemleri ve int, ngInit gibi directive'lerin kullanımı örneklerle açıklanmaktadır. Eğitim, AngularJS'in HTML'i yeni özelliklerle geliştiren bir sistem olduğunu ve tek sayfa uygulamaları için mükemmel bir çözüm olduğunu vurgulamaktadır. Ayrıca Laravel'deki Blade sistemine benzer bir yapıya sahip olan Angular expressionların JavaScript operatörleri ve değişkenleri içermesi de anlatılmaktadır.

      • youtube.com

    • HTML ve CSS'de Block Level, Inline ve Inline Block Elementler Eğitimi

      Bu video, bir eğitmen tarafından sunulan HTML ve CSS dersidir. Eğitmen, elementlerin display özellikleri hakkında detaylı bilgiler vermektedir. Video, HTML'de satır içi seviyesi (inline) ve blok seviyesi (block) elementlerin temel farklarını açıklayarak başlamakta, ardından CSS'de elementlerin display block, inline ve inline block özelliklerini örneklerle anlatmaktadır. Eğitmen, teorik bilgileri vererek Visual Studio Code'da pratik uygulamalar yaparak konuyu pekiştirmektedir. Videoda ayrıca inline elementlerin dikey hizalama özelliği, inline block elementlerin hem inline hem block özelliklerini nasıl birleştirebileceği, float komutunun display block özelliğine nasıl dönüştürdüğü ve en çok kullanılan HTML etiketlerinin hangi display özelliğine sahip olduğu gibi pratik bilgiler de verilmektedir.

      • youtube.com

    • jQuery Mobile Tema Oluşturma Eğitimi

      Bu video, Savaş Çın Altun tarafından sunulan bir eğitim içeriğidir. Savaş, Jeky Mobile eğitim setinin ilerleyişini göstererek tema oluşturma özelliğini anlatmaktadır. Videoda jQuery Mobile'in tema oluşturma özelliği adım adım gösterilmektedir. Savaş, jQuery Mobile web sitesine giriş yaparak tema oluşturma menüsünü açıp, renk, gölge, arka plan, kenarlık gibi özelliklerin nasıl değiştirileceğini göstermektedir. Oluşturulan temanın nasıl indirileceği ve mevcut bir şablona nasıl entegre edileceği de anlatılmaktadır. Video, 14. ders olarak belirtilmiş olup, 15. derste görüşmek üzere sonlanmaktadır.

      • youtube.com

    • Yazılım Öğrenme Sürecinde Zorluklar ve Çözüm Yolları

      Bu video, bir konuşmacının kendi deneyimlerini paylaşarak yazılım öğrenme sürecindeki zorlukları anlattığı eğitim içeriğidir. Konuşmacı, Udemy platformunda back and front-end eğitimleri izleyen ancak kendi projelerini geliştirmekte zorlanan izleyicilere hitap ediyor. Video, yazılım öğrenme sürecinde karşılaşılan psikolojik zorlukları ve bunların nasıl aşılacağını ele alıyor. Konuşmacı, tutorial izleyerek kodlamayı öğrenmenin kolay olduğunu ancak kendi projelerini geliştirmekte zorlandığını anlatarak, bu durumu aşmak için kendi deneyimlerini paylaşıyor. Bisiklete binme benzetmesiyle öğrenme sürecinin adım adım ilerlediğini ve kendi kendine güvenmenin önemini açıklıyor. Konuşmacı ayrıca React öğrenme sürecinde yaşadığı zorlukları ve bu zorlukları nasıl aşmayı başardığını anlatıyor. Tutorial'ları takip etmenin önemini vurgularken, kendi projelerinizi yazmanın ve küçük parçalara bölmek gibi pratik tavsiyeler veriyor. Yazılım öğrenmenin zeki olmak değil, iş disiplini ve düzenli çalışma ile mümkün olduğunu belirtiyor ve izleyicilere umutsuzluğa düşmemeleri, doğru planlamalarını yapmaları ve kendilerini acımasızca eleştirmeleri konusunda destek oluyor.

      • youtube.com

    • React ve Next.js ile Web Uygulaması Geliştirme Eğitimi

      Bu video, Adem İltar tarafından sunulan bir web geliştirme eğitim serisinin bir bölümüdür. Eğitmen, izleyicilerden gelen yorumları ve sorunları ele alarak uygulamayı geliştirmektedir. Videoda, React ve Next.js framework'lerinde web uygulaması geliştirme süreci adım adım anlatılmaktadır. İçerik, side bar tamamlanması, buton komponenti oluşturma (link button ve base button), navigation komponenti stillendirilmesi, yeni sayfaların (explore, notification, messages, bookmark, list, profile) oluşturulması ve router kullanımı ile sayfa geçişlerinin yönetimi konularını kapsamaktadır. Eğitmen, kod hiyerarşisini düzenleyerek importları daha düzenli hale getirmekte, Twitter logosunun boyutunu düzeltmekte ve hover efektlerini ayarlamaktadır. Ayrıca, bir sonraki derste tema değiştirme özelliğinin nasıl ekleneceği hakkında bilgi verilmekte ve bu özelliğin sayfadaki değişkenler ve renklerle nasıl entegre edileceği açıklanmaktadır.

      • youtube.com

    • React'te Tablo Oluşturma Eğitimi

      Bu video, bir eğitim içeriği olup, izleyicilere React'te kütüphane kullanmadan tablo oluşturma sürecini adım adım göstermektedir.. Video, React'te tablo oluşturma sürecini detaylı bir şekilde anlatmaktadır. Önce React'in Strict Mode özelliğinin ne olduğunu ve nasıl devre dışı bırakılacağını açıklar, ardından veri oluşturma, useState hook kullanımı, Row ve Table bileşenlerinin oluşturulması ve map fonksiyonu ile tabloların nasıl render edileceği gösterilir. Ayrıca, tablo render edilirken dikkat edilmesi gereken noktalar (tbody kullanımı, key ekleme) ve sık yapılan hatalar (map fonksiyonunda brackets kullanımı) hakkında bilgiler verilmektedir.

      • youtube.com

    • CSS Display Özelliği Eğitim Videosu

      Bu video, bir eğitmen tarafından sunulan CSS dersinin bir bölümüdür. Eğitmen, display özelliğinin temel kavramlarını ve kullanımını anlatmaktadır. Videoda display özelliğinin üç temel değeri (block, inline ve inline-block) detaylı olarak açıklanmaktadır. Eğitmen, bu değerlerin nasıl çalıştığını örneklerle göstermekte, blok elemanların sayfanın tamamını kaplaması, inline elemanların kendi genişliği kadar alanı kaplaması ve inline-block elemanların hem blok hem de inline özelliklerini birleştirmesi gibi temel farkları anlatmaktadır. Ayrıca, CSS kodları yardımıyla elementlerin display özelliğinin nasıl değiştirilebileceği ve bu değişikliklerin genişlik ve yükseklik değerlerine etkisi de gösterilmektedir. Video, block ve inline elemanların listesiyle sonlanmaktadır.

      • youtube.com

    • Angular Direktifleri Eğitim Videosu

      Bu video, Angular framework'ünde kullanılan direktifleri anlatan bir eğitim içeriğidir. Eğitmen, direktiflerin temel kavramlarını ve kullanımını adım adım göstermektedir. Video, Angular'daki üç temel direktif türünü (structural, component ve attribute) tanıtarak başlıyor ve ardından ngClass, ngStyle, ngFor ve ngIf gibi yaygın kullanılan direktiflerin kullanımını örneklerle açıklıyor. Eğitmen, Home komponenti üzerinde kod yazarak, elementlere sınıf ekleme, stil uygulama, dizi elemanlarını gösterme ve koşullu ifadeler kullanma gibi temel işlemleri gösteriyor. Son olarak, kendi direktif oluşturma sürecini de anlatarak, bir elementin yazı rengini kırmızıya çeviren bir örnek sunuyor.

      • youtube.com

    • Angular'da Ürün Bilgilerini Güncelleme Eğitimi

      Bu video, bir Angular eğitim serisinin bir bölümüdür. Eğitmen, önceki derste seçilen bir ürünün detay bilgilerinin form üzerinde gösterildiğini hatırlatarak devam etmektedir. Video, seçilen bir ürünün detay bilgilerindeki değişiklikleri nasıl güncelleyeceğimizi adım adım göstermektedir. Önce enter tuşuna basıldığında bilgilerin form üzerine aktarılması, ardından "Save Changes" butonu eklenerek tüm bilgilerin aynı anda güncellenmesi anlatılmaktadır. Ayrıca, form ve butonların sadece seçilen ürün için gösterilmesi için ng-if kullanımı da gösterilmektedir. Video boyunca Samsung S5, S6 gibi telefon örnekleri üzerinden kodlama ve uygulama gösterilmektedir.

      • youtube.com

    • Angular CLI'ye Bootstrap Kurulum Eğitimi

      Bu video, bir eğitim içeriği olup, izleyicilere Angular CLI'ye Bootstrap entegrasyonunu adım adım göstermektedir. Video, Angular CLI'ye Bootstrap kurulumunun nasıl yapılacağını detaylı şekilde anlatmaktadır. Önce npm ile Bootstrap'in kurulumu, ardından Angular CLI.json dosyasına script ve style dosyalarının eklenmesi, Angular CLI sitesinden gerekli modüllerin yüklenmesi ve son olarak Bootstrap bileşenlerinin (örneğin buton) projeye nasıl entegre edileceği gösterilmektedir. Video, bir sonraki derste Bootstrap araçlarının daha detaylı kullanılacağını belirterek sonlanmaktadır.

      • youtube.com
  • Yazeka sinir ağı makaleleri veya videoları özetliyor