FSD is an architectural methodology for front-end application scaffolding. It provides rules and conventions for organizing code. Includes linter, folder generators, and examples library
Bu video, bir teknoloji içerik üreticisinin Surge adlı CDN ve front-end geliştirme aracı hakkında kısa bir unboxing ve kullanım rehberidir. İçerik üreticisi, Surge'ü bir seneden fazla süredir kullanarak memnun kaldığını belirtiyor.. Video, Surge'ün npm ile kurulabilen bir CLI (komut satırı arayüzü) olduğunu ve front-end projelerinin kolayca yayınlanabileceğini anlatıyor. Surge, geliştirme aşamasındaki arayüzleri yayınlamak için ücretsiz kullanılabiliyor, ancak production için SSL kullanmak istenirse ücret gerektiriyor. İçerik üreticisi, Surge'ün nasıl kurulacağını, statik dosyaların nasıl yayınlanacağını ve custom domain kullanımı gibi temel özelliklerini gösteriyor. Ayrıca, Surge'ün her ölçekte arayüz projelerini yayınlayabildiğini ve her build işleminde otomatik olarak test çalıştırılabilmesini sağladığını vurguluyor.
Front-end developers create user interfaces (UI) for websites and applications. They use HTML, CSS, and JavaScript to design and layout websites. UI determines what parts of applications do and how they look
Bu video, bir konuşmacının React'teki useMemo hook'unu anlattığı eğitim içeriğidir. Konuşmacı, React'in kendi dokümantasyonundan ve bir front-end yazılımcının makalesinden yola çıkarak konuyu açıklamaktadır.. Video, useMemo hook'unun ne olduğunu, nasıl kullanıldığını ve performans optimizasyonu için nasıl faydalı olduğunu detaylı şekilde anlatmaktadır. İlk bölümde teorik bilgiler verilirken, ikinci bölümde bir uygulama örneği üzerinden useMemo'nun pratik kullanımını göstermektedir. Özellikle pahalı hesaplamaları hatırlamak için kullanılan useMemo'nun, render aşamasında nasıl çalıştığı ve dependency array'in işlevi açıklanmaktadır.. Videoda ayrıca useMemo'nun useCallback'ten farkı, sadece performans artırımı için kullanılabileceği ve her zaman avantajlı olmayabileceği vurgulanmaktadır. Her input değişikliğinde filtreleme işleminin sürekli yeniden hesaplandığı bir örnek üzerinden, useMemo'nun sadece search state değiştiğinde filtreleme işlemini yeniden çalıştırmasını nasıl sağladığı adım adım gösterilmektedir.
Bu video, deneyim tasarımcısı Furkan Açıkgöz ile yapılan bir röportajdır. Furkan, Kocaeli'de doğup büyüyen, İstanbul'da yaklaşık on yıldır yaşayan ve şu an Iyzico'da çalışan bir deneyim tasarımcısıdır.. Röportajda Furkan'ın kariyer hikayesi, kullanıcı deneyimi ve tasarım alanına nasıl yöneldiği anlatılmaktadır. Ayrıca tasarım süreci, tasarımın iş ve kullanıcı ihtiyaçlarını nasıl karşıladığı, araştırmaların, kullanıcı testlerinin ve veri analizlerinin önemi ele alınmaktadır.. Röportajda Furkan'ın Markafoni'de front-end developer olarak çalışırken UX konusuna ilgi duyması, kullanıcı testleri deneyimleri ve şu anki Iyzico'daki çalışma süreci hakkında detaylı bilgiler paylaşılmaktadır. Tasarmanın sadece estetik değil aynı zamanda iş ve kullanıcı ihtiyaçlarını da karşılaması gerektiği vurgulanmaktadır.
HTML provides structure, CSS controls style for web pages. HTML 5 is latest version with powerful features. CSS allows quick style changes without structure changes
No degree or prior experience required for 7-month, 6-hour weekly training. 335,690 learners have already completed the program. Includes 9 course series covering front-end development skills
CSS transitions are the most fundamental animation tool for front-end developers. Default CSS changes happen instantly, transitions enable gradual movement. Transition requires property name and duration, multiple properties can be animated
Bu video, bir eğitim serisinin bir parçası olup, bir eğitmen tarafından sunulan front-end geliştirme dersidir.. Video, önceki derste yapılan bir hata düzeltmesiyle başlayıp, Git ile build klasörünün yönetimi ve Search SSH ile kodun canlı sunucuya deploy edilmesi konularını ele almaktadır. Eğitmen, build klasörünün Git'ten nasıl gizleneceğini, dosyaların nasıl commit edileceğini ve Search SSH ile kodun nasıl canlı sunucuya gönderileceğini adım adım göstermektedir. Video, front-end geliştirme serisinin başlangıç kısmını tamamlamakta ve bir sonraki derslerde CSS ve JavaScript odaklı modüler web uygulaması yazmanın detaylarına değinileceğini belirtmektedir.
HTML, web sayfalarının içeriğini düzenlemek için kullanılan yaygın bir dildir. HTML etiketleri (<>) açılış ve kapanış etiketleri arasında kullanılır. HTML tek başına nadiren kullanılır, CSS ile birlikte öğrenilmelidir
Bu video, Ankara Üniversitesi Bilgisayar Mühendisliği mezunu bir front-end geliştiricisinin Opsie şirketindeki kariyeri ve teknolojik gelişim süreci hakkında yaptığı bir teknik sunum ve ardından soru-cevap oturumudur.. Sunum, konuşmacının kendi tanıtımı, Opsie'deki teknolojik değişimler, front-end yapısının tarihsel gelişimi ve AWS web yapılandırması olmak üzere dört ana başlıkta yapılandırılmıştır. Konuşmacı, 2015'ten günümüze kadar Opsie'de kullandıkları teknolojileri (Java, AngularJS, ReactJS, TypeScript) ve Amazon Web Servisleri (AWS) kullanarak front-end yapısına nasıl adapte olduklarını anlatmaktadır.. Soru-cevap bölümünde, Mustafa, İlker, Tanrı, Arif ve Selçuk gibi katılımcılar, farklı frontend framework'lerinin (Angular, React, Vue) kullanımı, TypeScript'in avantajları, statik dosyaların S3 üzerinde yönetimi, frontend ve backend entegrasyonu, test stratejileri ve cloud platform kullanımı gibi konulara değinmektedir. Konuşmacılar ayrıca CORS sorunları, CloudFront CDN çözümü, API Gateway kullanımı ve farklı domainler için yapılandırma zorlukları gibi teknik konuları da ele almaktadır.
Bu video, Prototurk.com için hazırlanmış bir eğitim içeriğidir. Bir eğitmen tarafından sunulan front-end dersinin bir bölümüdür.. Videoda, CSS Flexbox kullanarak sosyal platform UI bileşenlerinin nasıl tasarlanacağı adım adım gösterilmektedir. Eğitmen, Google Fonts'tan Mulish fontunu ekleyerek başlayıp, sıfırlama yaparak tasarım sürecini anlatmaktadır. Tasarım, "Front-End Değil" adlı bir site için hazırlanmış olup, komponentler, yazar listesi ve avatarlar gibi bölümlerden oluşmaktadır.. Video boyunca flexbox özellikleri (display flex, align items, flex wrap, border radius, transition) ve CSS stilleri detaylı olarak açıklanmaktadır. Ayrıca, sosyal platform UI bileşenleri (follow button, like button, location) gibi tasarım elemanlarının nasıl oluşturulacağı da gösterilmektedir.
Bu eğitim videosunda Hatice Edis, Proteintech şirketinde front-end developer olarak çalışan bir yazılım geliştirici, Amazon Web Services'in Amplify toolunu ve GraphQL API geliştirme sürecini anlatmaktadır.. Video, Amplify toolunun ne olduğu, nasıl indirileceği ve temel komutlarının (amplify head, configure, console, init, run, push, status, pull, environment, publish, logat, mock, category, update, remove) açıklanmasıyla başlıyor. Ardından GraphQL API oluşturma, authentication ayarları, DynamoDB entegrasyonu ve Epify kullanarak backend servisi oluşturma adımları gösteriliyor. Son bölümde ise oluşturulan API'nin bir todo uygulaması üzerinden nasıl kullanılacağı, hata ayıklama, güncelleme işlemleri ve servisin fiyatlandırması anlatılıyor.. Eğitim yaklaşık 10 dakika daha devam edecek ve son beş dakikada soru-cevap bölümü olacak şekilde planlanmıştır. Ayrıca, farklı cihazlarda geliştirme ortamlarını nasıl lokalize edebileceğiniz ve servisin diğer AWS servisleriyle nasıl entegre edilebileceği de videoda ele alınan konular arasındadır.
Bu video, "The Code Father" tarafından sunulan bir web tasarım eğitim serisinin bir bölümüdür. Eğitmen, sıfırdan başlayarak bir web sitesi tasarımı sürecini adım adım göstermektedir.. Videoda, hayali bir kayak merkezi sitesinin tasarım süreci devam etmektedir. Eğitmen, önceki bölümde tamamlanan header (üst menü) kısmının ardından, hero veya slider olarak adlandırılan ana bölümün nasıl oluşturulacağını göstermektedir. Figma programında resim düzenleme, metin ekleme, gölge ekleme ve sayfa boyutlarını ayarlama gibi temel tasarım işlemleri detaylı olarak anlatılmaktadır. Video, web tasarım serisinin bir parçası olup, ilerleyen bölümlerde HTML, CSS, JavaScript ile front-end kısmının ve My Secure Database ile PP kullanarak backend kısmının nasıl yazılacağı gösterilecektir.
Bu video, bir tasarımcının ve Panda Network'in kurucusunun kendi projeleri hakkında yaptığı bir sunum formatındadır. Konuşmacı, tasarım alanında deneyimli biri olarak kendi yolculuğunu ve Panda Network'in gelişimini anlatmaktadır.. Sunumda öncelikle konuşmacının 2000'li yıllardan günümüze kadar olan tasarım yolculuğu kronolojik olarak ele alınmakta, ardından Panda uygulamasının özellikleri, kullanıcı istatistikleri ve gelecek planları paylaşılmaktadır. Video, Panda Network'in 2015'te kurulduğu, tasarım ve geliştirme odaklı projelerin tek çatı altında toplandığı bilgisiyle devam etmekte ve son olarak Panda Focus uygulamasının gelecekteki gelişim planları hakkında sohbet edilmektedir.. Sunumda ayrıca Panda uygulamasının 166 ülkeden kullanıcı aldığı, UX designer ve front-end developer'ların en çok kullandığı, 17 milyon tekil kullanıcıya ulaştığı ve ekran koruyucu olarak kullanılabileceği belirtilmektedir. Konuşmacı, Panda Max projesi, Panda Premium, Flexib MacBook, kendi jobboard'u, Gmail ile login olan uygulama ve Asmating uygulaması gibi gelecek projeleri hakkında da bilgi vermektedir.
Bu video, Fatih Kadir Akın tarafından sunulan bir eğitim içeriğidir. Fatih, Protel'de yazılım geliştiricisi olarak çalışmakta, C: Istanbul Org topluluğuna üyesidir ve "Modern JavaScript" adlı bir kitabın yazarıdır.. Video, atomik tasarım kavramını, tasarım tarihindeki gelişim sürecini ve Brad Frost'un bu kavramı sistematikleştirmesini anlatmaktadır. İçerikte atomik tasarımın temel prensipleri (atom, molekül, organizma, şablon), style guide kavramı ve tasarım dilinin önemi detaylı olarak ele alınmaktadır. Ayrıca, React, Vue.js ve Angular gibi farklı framework'lerde komponent yapısının nasıl uygulanabileceği ve dosya dizin yapısının nasıl ayarlanacağı konuları da işlenmektedir.. Videoda ayrıca tasarım analizi süreci Instagram örneği üzerinden gösterilmekte, kendi şirketinde geliştirilen bir style guide örneği paylaşılmakta ve atomik tasarımın iş akışını nasıl değiştirdiği anlatılmaktadır. Son bölümde ise Suat Bey ile yapılan bir teknik sohbet formatında dosya dizin yapısı hakkında bilgiler paylaşılmaktadır.
Bu video, bir yazılımcının kendi deneyimlerinden yola çıkarak front-end geliştirme yolculuğunu anlattığı eğitim içeriğidir. Konuşmacı, izleyicilerden gelen "front-end developer olmak için hangi dilleri öğrenmem gerekiyor?" sorusuna yanıt veriyor.. Video, front-end geliştirme yolculuğunu adım adım anlatan bir roadmap sunuyor. İçerik, internet çalışma prensiplerinden başlayarak HTML, CSS ve JavaScript gibi temel dilleri, responsive design, version control sistemleri, commandline kullanımı, package managers ve pre-processors gibi konuları kapsamaktadır. Konuşmacı, kendi öğrenme sürecini paylaşarak, temel teknolojileri öğrendikten sonra kendi projeleriyle pratik yapmanın önemini vurguluyor.. Videoda ayrıca profesyonel yazılım geliştirme ve hobi olarak öğrenme arasındaki farklar, "tutorial tuzağı" kavramı ve Google, Stack Overflow gibi kaynakların kullanımı gibi konular da ele alınıyor. Konuşmacı, şu anda JavaScript, HTML, CSS gibi temel teknolojileri öğrendiğini ve gelecekte framework'leri ve veritabanı kullanımını öğrenmek istediğini belirtiyor.
Bu video, Beşiktaş'ta gerçekleşen bir teknoloji etkinliğinde Markföy'de front-end geliştiricisi olarak çalışan bir konuşmacının Angular.js ve Firebase entegrasyonu hakkında yaptığı kapsamlı bir eğitim sunumudur. Sunum, Bahattin adında bir konuşmacının ERP konusunda çalışma yaptığı bir soru-cevap oturumuyla sonlanmaktadır.. Sunum, Angular.js'in temel özellikleri ve avantajları ile başlayıp, Firebase'in ne olduğu, özellikleri ve kullanım alanları hakkında detaylı bilgiler sunmaktadır. Ardından Angular ile Firebase'in entegrasyonu, AngularFire kütüphanesinin kullanımı, veritabanı işlemleri için kod örnekleri ve veri modellemesi anlatılmaktadır. Son bölümde ise katılımcıların soruları yanıtlanmakta ve Firebase'in ölçeklenebilirlik özellikleri, maliyet politikası ve farklı veritabanı sistemleriyle karşılaştırması yapılmaktadır.. Sunumda ayrıca Firebase'in gerçek zamanlı veri aktarımı, platform bağımsızlığı, güvenli yapısı, hızlı performansı ve farklı dil desteği gibi avantajları vurgulanmakta, veri çekme, güncelleme, silme işlemleri ve asenkron işlemlerin yönetimi örneklerle gösterilmektedir.
Bu video, 6 yaşından beri yazılım yapan ve 30 yıllık deneyime sahip bir uzmanla yapılan soru-cevap formatındadır.. Videoda yazılım kariyeri, front-end geliştirme, junior front-end pozisyonlarına başvuru, React ve Angular gibi front-end framework'leri, veritabanı teknolojileri ve mikro servisler gibi konular ele alınmaktadır. Konuşmacı, yazılım kariyerinde başarılı olmak için çalışma, domain design ve sürekli öğrenme gibi önemli noktaları vurgulamaktadır.. Ayrıca videoda staj başvurusu yaparken dikkat edilmesi gereken noktalar, farklı mühendislik dallarından yazılım kariyerine geçiş, not ortalamasının iş hayatındaki önemi ve kod yazım tarzı geliştirme yöntemleri gibi konular da tartışılmaktadır. Konuşmacı, kendi deneyimlerinden yola çıkarak kod okumak ve farklı yazılımcıların kodlarını incelemek gibi tavsiyelerde bulunmaktadır.