| Genel Açıklama | Front-end | Back-end] | Teknolojiler | Terimler | Kaynaklar | Kolay öğrenme yolları |
Front-end, bir web sitesinin veya uygulamanın arayüzünü kullanıcılarla etkileşime sokmak için oluşturulan kısım olarak tanımlanabilir. Front-end geliştiricileri, HTML, CSS ve JavaScript gibi dilleri kullanarak sitenin kullanıcı arayüzünü oluştururlar. UI (User Interface) frameworkleri de kullanarak, hazır şablonlarla veya bileşenlerle arayüzün tasarımını hızlı bir şekilde oluşturabilirler.
Back-end, bir web sitesinin veya uygulamanın arka tarafındaki işlemleri yönetir. Back-end geliştiricileri, sunucu tarafı programlama dilleri (örn. Node.js, PHP, Python, Ruby, Java, C#, Go) kullanarak, sunucuda veritabanlarına erişim, dosya yükleme ve işleme, kullanıcı kimlik doğrulama ve yetkilendirme gibi işlemleri gerçekleştirirler.
Front-end ve back-end, bir web sitesinin veya uygulamanın temelini oluştururlar ve birbiriyle etkileşim halinde çalışırlar.
Framework, bir yazılım veya uygulama geliştirmede kullanılan temel yapı veya çatıdır. UI (User Interface) frameworkleri, front-end geliştiricilerinin hazır bileşenler veya şablonlar kullanarak hızlıca arayüz tasarlamasını sağlar. Back-end frameworkleri ise sunucu tarafı işlemlerini yönetmek için kullanılır ve belirli işlevleri gerçekleştirmek için gerekli yapıları ve araçları sağlar. Frameworkler, geliştirme sürecini hızlandırmak, tekrar kullanılabilir kod oluşturmak ve proje yönetimini kolaylaştırmak gibi avantajlar sağlar.Web geliştirme, kendi içinde iki alana ayrılır: Front-end (site arayüzü geliştirme) ve Back-end (sunucu tarafı geliştirme).
Front-end geliştirmek için kullanabileceğiniz diller ve stylesheetler aşağıdaki gibidir:
Frameworklerin birden fazla türü vardır ancak burada iki türden bahsedeceğim: UI frameworkleri ve Front-end frameworkleri.
UI frameworkleri şunlardır :
Front-end frameworkleri ise şunlardır :
Back-end tarafında ise istediğiniz programlama dilinde yazabilirsiniz. Bazı popüler back-end frameworkleri şunlardır:
- JS: Express, Fastify, Adonis
- Golang: Gin, Go-fiber
- Java: Spring, Javalin
- C#: .NET
- Rust: Rocket
- Nim: Jester
- Ruby: Ruby on Rails
- Lua: Lapis, OpenResty
- Python : Django, Flask
- PHP
PHP de kullanabileceğiniz bir diğer seçenek olabilir. Mikroservisler, direkt viewport kullanımı ya da Laravel kullanımı gibi farklı PHP kullanım alanları bulunmaktadır.
- SPA (Single Page Application): Tek sayfa uygulamaları anlamına gelir. Kullanıcının sayfa yenilemesine gerek kalmadan arka planda dinamik olarak sayfa içeriği değiştirilebilir.
- CSR (Client Side Rendering): İstemci taraflı renderleme anlamına gelir. Sayfa içeriği istemci tarafında (tarayıcıda) hazırlanır.
- AJAX (Asynchronous JavaScript and XML): Sayfa yenilemeden veri alışverişi yapmak için kullanılan bir tekniktir.
- Cache: Tarayıcıda kaydedilen verilerin tekrar kullanımını sağlayan bir mekanizmadır.
- Cookie: Kullanıcının tarayıcısına kaydedilen küçük bir veri parçasıdır. Genellikle kullanıcı tercihlerini, giriş bilgilerini veya alışveriş sepetini tutmak için kullanılır.
- LocalStorage: Tarayıcının yerel depolama alanıdır. Kullanıcı tercihlerini, sepet bilgilerini veya diğer verileri tutmak için kullanılabilir.
- SessionStorage: Tarayıcının oturum depolama alanıdır. Kullanıcı oturumu boyunca geçerli olan verileri tutmak için kullanılır.
- Responsive Design: Web sitesinin farklı ekran boyutlarına uyumlu olacak şekilde tasarlanmasıdır.
- Navbar: Web sitesindeki gezinme menüsüdür.
- Footer: Web sitesinin alt kısmındaki alan. Genellikle iletişim bilgileri, sosyal medya bağlantıları ve site haritası gibi bilgiler içerir.
- UI (User Interface): Kullanıcı arayüzü anlamına gelir. Kullanıcının siteye etkileşimli bir şekilde erişimini sağlayan tasarım ve kullanıcı deneyimi unsurlarını kapsar.
- UX (User Experience): Kullanıcı deneyimi anlamına gelir. Kullanıcının siteyle etkileşimini, siteye erişimini ve kullanımını kapsayan tüm deneyimi içerir.
- WYSIWYG (What You See Is What You Get): Kullanıcının içerik oluşturma sürecinde gerçek zamanlı olarak nasıl göründüğünü görebildiği bir arayüz anlamına gelir.
- Debugging: Kodun hatalarını tespit etmek
- Sunucu: İstemci bilgisayarların isteklerini işleyen ve cevap veren bir bilgisayardır.
- API (Uygulama Programlama Arayüzü): İki farklı yazılım uygulaması arasında veri alışverişine izin veren bir arabirimdir.
- Veritabanı: Verilerin depolandığı ve yönetildiği bir sistemdir.
- Framework: Yazılım geliştirmede kullanılan, genel problemleri çözmek için tasarlanmış bir çerçeve veya temel yapıdır.
- MVC (Model-View-Controller): Web uygulamalarının kodunun organizasyonunu sağlamak için kullanılan bir mimaridir.
- ORM (Nesne İlişkisel Eşleştirme): Veritabanı nesnelerinin programlama dili nesnelerine eşleştirilmesine izin veren bir teknolojidir.
- Depolama: Verilerin uzun vadeli saklanması ve yönetilmesi için kullanılan bir sistemdir.
- Güvenlik: Web uygulamalarının güvenliği ile ilgili konuları ele alır, örneğin kimlik doğrulama, yetkilendirme ve saldırı tespiti ve koruması gibi konuları içerir.
- HTML
- CSS
- Sass
- Less
- JS
- React
- Vue
- Svelte
- Solid
- Lit
- Qwik
- Marko
- Angular
- Alpine
- Ember
- Bootstrap
- Tailwind
- UIKit
- w3.css
- Chakra UI
- Sematic UI
- HTML,CSS,JS,BOOTSTRAP,JQUERY Dersleri (172 video)
- React dersleri (35 video)
- Svelte dersleri (13 video)
- Vue Bootcamp (23 video)
- CSS Dersleri (103 video)
- Javascript
- Karabük üniversitesi Javascript ders notları
- İmmi bilişim Javascript
- CSS Ders Notları
- Harran ünversitesi CSS Ders notları
- Murat KARA HTML,CSS
- BOOTSTRAP HAZIR CSS-JS KÜTÜPHANESİ İLE HIZLI WEB SAYFASI TASARIMI
- Tailwind
- React
- Svelte
- Vue
- alternative-front-ends
- awesome react
- awesome svelte
- awesome sveltekit
- awesome vue
- CSS PROTIPS
- awesome tailwind
- awesome bootstrap
- awesome html5
- awesome js - videolu anlatımlar
- Express, Fastify, Adonis
- Gin, Go-fiber
- Spring, Javalin
- .NET
- Rocket
- Jester
- Ruby on Rails
- Lapis, OpenResty
- Django, Flask
- PHP
- SQL
- MongoDB
Programlama dilini veya bir paketi öğrenmek için en kolay yol, Github'da "awesome" etiketi ile arama yapmaktır. Bu şekilde, ilgili paket veya programlama dili ile ilgili terimleri, paketleri ve kodları görürsünüz. Ayrıca, pdf okumayı tercih edenler için, Google'da
"-filetype:pdf" şeklinde arama yaparak örnek olarak "Javascript -filetype:pdf" gibi aramalar yapabilirsiniz. Eğer yazılım öğrenmek için videoları tercih ediyorsanız, Youtube veya freecodecamp gibi platformlarda arama yapabilirsiniz. Ancak, freecodecamp gibi kaynaklar daha verimli sonuçlar verebilir.