• Buradasın

    Frontend Geliştirme

    Özetteki ilgi çekici içerikler

    • CSS Animasyonları Kullanarak Proje Geliştirme Eğitimi

      Bu video, bir eğitim içeriği olup, konuşmacı CSS animasyonlarının nasıl kullanılacağını göstermektedir. Önceki videoda CSS animasyonlarını incelemiş olan konuşmacı, bu videoda projeye hangi CSS animasyonlarını ekleyebileceğimizi anlatmaktadır.. Videoda, bir web projesine CSS animasyonları ekleme süreci adım adım gösterilmektedir. Öncelikle fare üzerine geldiğinde kartların büyümesi için transform ve transition özellikleri kullanılmaktadır. Ardından sayfa yüklendiğinde sol taraftan sağa doğru kayarak gelen bir sidebar ve yukarıdan aşağıya gelen bir video list için keyframes kullanılarak animasyonlar oluşturulmaktadır. Video, CSS animasyonlarının projelerde nasıl kullanılabileceğini gösteren pratik bir uygulama sunmaktadır.

      • youtube.com
    • CSS Dersinde Yeniden Boyutlandırma Özellikleri

      Bu video, bir CSS dersinin devamı niteliğindedir. Eğitmen, CSS'de yeniden boyutlandırma özelliklerini anlatmaktadır.. Videoda, text elementinde görülen yeniden boyutlandırma özelliğinin diğer form elementlerine nasıl uygulanacağı gösterilmektedir. Eğitmen önce bir paragraf etiketi oluşturarak, padding, border ve margin gibi CSS özellikleri ekleyerek bir eleman oluşturur, ardından overflow özelliğini auto yaparak yeniden boyutlandırma özelliğini aktif eder. Ayrıca, bu özelliği kapatmak için resize özelliğinin none olarak ayarlanması gerektiği de gösterilmektedir.

      • youtube.com
    • GitLab ve Vue.js ile Mergic Uygulaması Geliştirme Sunumu

      Bu video, GitLab'da sinir frontent engineer olarak çalışan ve Google Developer Expert on Web Technology olan Fatih Acet tarafından sunulan bir eğitim içeriğidir. Ayrıca Software Classmanship Turkey'de yaptığı sunumun tekrarını da içermektedir.. Video, GitLab'ın ne olduğu, şirketin yapısı ve Fatih'in GitLab'da yaklaşık iki buçuk yıl içinde yaşadığı front-end sürecini anlatmaktadır. İçerikte Vue.js framework'ünün Mergic uygulamasında sağladığı avantajlar, legacy codebase'den Vue.js'e geçiş süreci ve GitLab'ın geliştirme süreci detaylı olarak ele alınmaktadır.. Sunumda ayrıca GitLab'ın code review sistemi, düzenli toplantılar (her hafta salı günü front-end takım toplantısı, her ayın belirli günlerinde front-end ve UI-UX takımı toplantıları), sürüm yönetimi ve retrospektif değerlendirmeler hakkında bilgiler de sunulmaktadır. Mergic uygulamasında kullanılan view komponentleri, Vx store yapısı ve mimari yapısı hakkında da detaylı açıklamalar yapılmaktadır.

      • youtube.com
    • Software Developer Mesleği ve Gereklilikleri

      Software developer, kullanıcı ihtiyaçlarına yönelik uygulamalar tasarlayan ve geliştiren uzmandır. Uygulamalar ve sistemler olmak üzere iki ana türü vardır. Kodlama, test ve bakım süreçlerini yürütür

      • techcareer.net
    • Gog.js Kurulum ve Dosya Hiyerarşisi Oluşturma Eğitimi

      Bu video, bir eğitim içeriği olup, izleyicilere Gog.js kurulumunu adım adım göstermektedir.. Video, Gog.js kurulumuna başlamadan önce gerekli dosya hiyerarşisinin oluşturulmasını anlatmaktadır. Önce masaüstünde veya terminalden klasör hiyerarşisi oluşturulur, ardından Sublime Text ile gerekli dökümanlar (coffee, scss, js, index.html ve package.json) eklenir. Daha sonra konsol üzerinden Gog.js ve gerekli pluginler (coffee, concat, ruby-sass, aglify, live-reload ve ten-alar) kurulur. Video, bir sonraki bölümde test yazma ve otomatik hale getirme konularının ele alınacağını belirterek sona erer.

      • youtube.com
    • CSS'de Tek Satırda Geçiş Animasyonu Yazma Eğitimi

      Bu video, bir eğitim dersi formatında olup, bir eğitmen tarafından CSS'de geçiş animasyonlarının nasıl yazılacağı anlatılmaktadır.. Videoda, CSS'de geçiş animasyonlarının tek satırda nasıl yazılacağı gösterilmektedir. Eğitmen, önceki derslerde öğretilen transition özelliğinin yanı sıra, property, duration, timing function ve delay gibi dört özelliği tek satırda nasıl kullanabileceğimizi açıklamaktadır. Bu yöntem, projelerin ilerledikçe ve daha fazla animasyon yapmak istendiğinde kodun daha düzenli ve hızlı yazılmasını sağlar. Ayrıca, ilerleyen derslerde transform, 2D ve 3D transform animasyon derslerinin ekleneceği belirtilmektedir.

      • youtube.com
    • CSS Kursu: Overflow Kullanımı

      Bu video, CSS kursunun on birinci dersi olup, bir eğitmen tarafından sunulan bir eğitim içeriğidir.. Videoda overflow özelliğinin nasıl kullanılacağı adım adım gösterilmektedir. Eğitmen, bir div etiketi içine metin ekleyerek overflow'un hidden ve scroll değerlerini uygulamalı olarak anlatmaktadır. Ayrıca, overflow'un content kısmında ve yan menü gibi farklı tasarımlarda nasıl kullanılabileceği açıklanmaktadır. Video, yatay scrollbar'ı kaldırma ve sadece dikey scrollbar'ı aktif etme gibi ileri seviye kullanım örnekleriyle sonlanmaktadır.

      • youtube.com
    • CSS Yazı Tipleri ve Özellikleri

      Doğru yazı tipi seçimi web sitesi deneyimini ve marka kimliğini etkiler. CSS'de beş temel yazı tipi türü vardır: serif, sans-serif, monospace, cursive ve fantasy. Sans-serif yazı tipleri bilgisayar ekranlarında seriflerden daha kolay okunur

      • onurkul.com.tr
    • React'ta Redux Kullanımı ve Yapısı

      React component'leri sürekli birbirleriyle etkileşim halindedir. Component drilling sorunu üst katmanlara bağımlılığı artırır. Redux, state'leri store yapısında tutarak yönetilebilirlik sağlar

      • medium.com
    • Redux State Management Kütüphanesi

      State, uygulamadaki bileşenlerin anlık özellikleri ve bilgileridir. State management, bu durumların organizasyonunu sağlar. Redux, React'ın kurucusu Dan Abramov tarafından oluşturulan açık kaynak kodlu kütüphanedir

      • medium.com
    • Vue.js ile Google Cloud Platform'da Frontend Geliştirme Eğitimi

      Bu video, bir eğitim serisinin parçası olup, konuşmacı Vue.js kullanarak frontend uygulaması geliştirme sürecini anlatmaktadır.. Video, Vue.js'in kurulumundan başlayarak, Node.js ve npm paket yöneticisinin önemi, Vue.js CLI'nin kurulumu ve bir Vue.js projesi oluşturma sürecini göstermektedir. Ayrıca, Vue.js'in temel komutları (start, build, lint), dependency'leri ve proje yapısı detaylı olarak anlatılmaktadır. Eğitim, mikro servis mimarisi ve birden fazla programlama dili kullanılarak geliştirilen bir alışveriş sitesi örneği üzerinden ilerlemektedir.. Konuşmacı, bir sonraki bölümde veritabanı kurulumu ve frontend'de component oluşturma konularına değineceğini belirtmektedir. Video, TypeScript ile geliştirilen kodların JavaScript'e dönüştürülmesi ve bu JavaScript'in index.js dosyası üzerinden nasıl çalıştırıldığı konusunda temel bilgiler sunmaktadır.

      • youtube.com
    • CSS Örnek Kullanım Kılavuzu

      CSS ile div etiketleri renk, boyut ve stil özellikleri değiştirilebilir. Color özelliği yazı rengini, background-color arka plan rengini belirler. Width ve height özellikleri kutu boyutlarını ayarlar

      • yazilimkodlama.com
    • CSS'de Border (Kenarlık) Özellikleri Eğitimi

      Bu video, bir eğitmen tarafından sunulan CSS dersidir. Eğitmen, CSS'de border (kenarlık) özelliğinin kullanımını detaylı şekilde anlatmaktadır.. Video, CSS'de border özelliğinin temel özelliklerini ve kullanım şekillerini göstermektedir. Eğitmen önce border-style özelliğini (çizgili, noktalı, çift kenarlı, inset, solid) açıklar, ardından border-width özelliğini (kenarlık kalınlığı) anlatır. Daha sonra border-color özelliği, kenarlık stilleri (border-right-style, border-bottom-style) ve kısa kullanım şekilleri gösterilir. Son olarak border-radius özelliği ile kenarlıkların ovalleştirilmesi anlatılır. Video boyunca eğitmen, kod örnekleri üzerinden konuyu görsel olarak da desteklemektedir.

      • youtube.com
    • CSS Temel Özellikleri Eğitim Videosu

      Bu video, bir eğitmen tarafından sunulan kapsamlı bir CSS eğitim içeriğidir. Eğitmen, kod örnekleri üzerinden CSS özelliklerini adım adım göstermektedir.. Video, CSS'in temel mantığını açıklayarak başlıyor ve tarayıcıların varsayılan stil değerlerini anlatıyor. Ardından CSS'in nasıl dahil edileceği, seçiciler (class ve id), font özellikleri, border özellikleri, kutu model özellikleri (width, height, margin, padding, box-sizing), yazı ayarları (text-align, text-decoration, text-shadow, line-height, letter-spacing), overflow, display, position, z-index, box-shadow, text-shadow, border-radius, vertical-align, background-image, background-size, background-repeat ve background-position gibi temel CSS özellikleri detaylı şekilde açıklanmaktadır.. Eğitmen, bazı özelliklerin (CSS Grid ve Flex) ayrı videolarda detaylı olarak ele alınacağını belirtmektedir. Video boyunca Google Fonts'tan font family seçimi, taşma sorunlarını çözmek için box-sizing özelliğinin önemi ve farklı display ve position değerlerinin nasıl kullanılacağı gibi pratik bilgiler de sunulmaktadır.

      • youtube.com
    • Tailwind CSS Text Özellikleri Eğitimi

      Bu video, bir eğitim içeriği olup, konuşmacı Tailwind CSS ile ilgili temel text özelliklerini anlatmaktadır.. Video, Tailwind CSS'in normal kurulumunu açıklayarak başlıyor ve ardından text class'larının kullanımını örneklerle gösteriyor. İçerikte text boyutu, italik, kalın, font seçimi, spacing, line height, text hizalama, renk, altı çizili, üstü çizili ve harf büyük/küçük ayarları gibi temel text özellikleri detaylı olarak anlatılıyor. Konuşmacı, Tailwind CSS'in doktrini hakkında daha fazla bilgi edinmek isteyenler için bir kaynak da paylaşıyor.

      • youtube.com
    • CSS Temel Özellikleri ve Kullanımları

      Font-face özelliği ile özel yazı tipleri kullanılabilir. Font-size ve font-style ile yazı tipi ve stili ayarlanabilir. Font-variant ile küçük harfler büyük harfe dönüştürülebilir. Font-weight ile yazıların kalınlığı ayarlanabilir

      • mehsatek.com
    • CSS Padding Özellikleri Eğitim Videosu

      Bu video, bir eğitim içeriği olup, bir eğitmen tarafından CSS'in padding özellikleri hakkında bilgi verilmektedir.. Videoda padding özelliğinin ne olduğu ve nasıl kullanılacağı adım adım gösterilmektedir. Eğitmen, önceki derste CSS'in font özelliklerinden bahsettiğini belirterek, bu derste padding özelliğine odaklanmaktadır. Padding'in farklı yazılış şekilleri (top, right, bottom, left) ve piksel cinsinden nasıl ayarlanacağı pratik örneklerle anlatılmaktadır. Ayrıca, padding'in bir etiket için tüm yönlerde eşit boşluk bırakma veya farklı yönlerde farklı boşluk bırakma seçenekleri de gösterilmektedir.

      • youtube.com
    • CSS ile Yazı Stilleri Eğitimi

      Bu video, bir eğitim içeriği olup, bir eğitmen tarafından CSS ile yazı stilleri konusu anlatılmaktadır.. Videoda, CSS ile yazı stilleri oluşturma teknikleri gösterilmektedir. Eğitmen önce CSS dosyası oluşturarak "yazı bir" ve "yazı iki" adlı iki sınıf tanımlar, ardından Dreamweaver programında bu sınıfları HTML'e uygular. Ayrıca, CSS kodlarının nasıl yazılacağı, font boyutu, yazı tipi ve renk gibi özelliklerin nasıl ayarlanacağı adım adım gösterilmektedir. Video, bir sonraki derste yazı biçimleri, font biçimleri, altını çizme ve italik yapma gibi konuların anlatılacağı bilgisiyle sonlanmaktadır.

      • youtube.com
    • React Native Eğitim Serisi: İlk Ders

      Bu video, kendi şirketinde React Native üzerinde çalışan bir eğitmen tarafından sunulan eğitim serisinin ilk bölümüdür.. Video, React Native'in ne olduğu, popülerliği ve kullanım alanları hakkında bilgiler vererek başlıyor, ardından kurulum sürecini anlatıyor. Daha sonra React Native'in temel bileşenleri (platform, device, textview, text input, scroll view, dimension, asenkron storage), flex yapısı, fontlar ve animasyonlar gibi tasarım özellikleri tanıtılmaktadır. Ayrıca React Navigation ve Material Tep gibi navigasyon kütüphaneleri, kod düzenleme ayarları ve Android cihazında uygulama çalıştırma süreci de gösterilmektedir.. Eğitmen, React Native'in temel komutlarını, test yazma yöntemlerini ve Redux gibi state management yapılarını da ele almayı planladığını belirtiyor. Video, bir React Native projesinin nasıl oluşturulduğu ve çalıştırıldığı pratik bir örnekle devam ediyor.

      • youtube.com
    • CSS Border Radius Eğitimi

      Bu video, bir eğitmen tarafından sunulan CSS dersinin bir bölümüdür. Eğitmen, border radius özelliğini detaylı bir şekilde anlatmaktadır.. Videoda border radius özelliğinin nasıl kullanılacağı adım adım gösterilmektedir. Eğitmen önce temel bir div oluşturarak başlayıp, border radius özelliğini kullanarak kutunun kenarlarını yuvarlama işlemini uygulamalı olarak anlatmaktadır. Ayrıca, border radius değerlerinin nasıl ayarlanacağı, köşelerin yarıçaplarının nasıl belirleneceği ve farklı köşelere farklı yarıçap değerleri verilerek kutunun şeklinin nasıl değiştirilebileceği örneklerle açıklanmaktadır.

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