Tailwind CSS: Uygulamalı Projelerle Web Siteni Tasarla
Tailwind CSS’i en temelden öğrenin, modern ve mobil uyumlu arayüzler oluşturun. Projelerle konuları pekiştirin.
Kurs Hakkında
Modern web tasarımında hız, esneklik ve sadelik her zamankinden daha önemli. İşte bu noktada Tailwind CSS devreye giriyor!
Bu kurs, Tailwind CSS’i sıfırdan öğrenmek isteyen herkes için hazırlandı. Klasik CSS yazımından farklı olarak, utility-first yaklaşımını benimseyen Tailwind ile, hem hızlı hem de ölçeklenebilir arayüzler tasarlamayı öğreneceksiniz.
Bu Kursta Neler Öğreneceksiniz?
- Tailwind CSS’in temelleri: Utility class’lar, responsive tasarım, renkler, tipografi ve spacing sistemleri
- Tailwind ile tema ve tasarım özelleştirmeleri
- Component mantığı ve tekrar kullanılabilir yapıların oluşturulması
- Proje bazlı uygulamalar: Gerçek dünyadan ilham alınmış arayüzler (örneğin portfolyo sitesi, e-ticaret proje tasarımı)
- Tailwind ile performans optimizasyonu
Kimler Katılmalı?
- CSS bilgisi olan ve modern yaklaşımlarla arayüz tasarımı yapmak isteyen geliştiriciler
- Frontend dünyasına adım atmak isteyen yeni başlayanlar
- React, Vue, Angular gibi frameworklerle çalışan ama Tailwind CSS’i projelerinde etkili şekilde kullanmak isteyenler
- Tasarım ve kod arasındaki bağı güçlendirmek isteyen herkes
Projelerle Öğrenin
Teorik bilgiyle yetinmiyoruz. Her bölüm sonunda öğrendiklerinizi pekiştirecek uygulamalı mini projeler ve gerçek dünya arayüzleri tasarlıyoruz.
Kurs sonunda siz de mobil uyumlu, modern, şık ve hızlı kullanıcı arayüzleri oluşturabilecek seviyeye geleceksiniz.
Şimdi öğrenmeye başla ve modern web arayüzleri tasarlamada bir adım öne geç!
Sadece izleyen değil, uygulayan biri ol. Projelerle kendini geliştir!
Tailwind CSS’i öğren, sade ama etkileyici arayüzler oluşturmayı keşfet!
Hemen kaydol, tasarım ve kod dünyasını birleştiren bu yolculukta yerini al!
Ders İçerikleri
6 bölüm · 49 ders · 8 saat 31 dk toplam süre
Giriş
3 ders
Giriş
3 ders
| Ders | Durum | Süre |
|---|---|---|
|
Tailwind CSS Nedir? Kilitli · 5:48 |
Kilitli |
5:48
|
|
Gerekli Kurulumlar Kilitli · 5:17 |
Kilitli |
5:17
|
|
Kaynak Dosyalar Kilitli · 2:45 |
Kilitli |
2:45
|
Tailwind Temelleri-1
11 ders
Tailwind Temelleri-1
11 ders
| Ders | Durum | Süre |
|---|---|---|
|
Utility First Uygulaması Kilitli · 9:32 |
Kilitli |
9:32
|
|
Tailwind Çalışma Ortamı Kilitli · 9:07 |
Kilitli |
9:07
|
|
Colors Kilitli · 13:50 |
Kilitli |
13:50
|
|
Typography Kilitli · 10:04 |
Kilitli |
10:04
|
|
Sizing Kilitli · 14:41 |
Kilitli |
14:41
|
|
Spacing Kilitli · 9:40 |
Kilitli |
9:40
|
|
Position Kilitli · 8:49 |
Kilitli |
8:49
|
|
Background & Shadow Kilitli · 11:11 |
Kilitli |
11:11
|
|
Borders Kilitli · 5:18 |
Kilitli |
5:18
|
|
Buttons Kilitli · 12:52 |
Kilitli |
12:52
|
|
Tables Kilitli · 9:21 |
Kilitli |
9:21
|
Tailwind Temelleri-2
8 ders
Tailwind Temelleri-2
8 ders
| Ders | Durum | Süre |
|---|---|---|
|
Breakpoints Kilitli · 11:19 |
Kilitli |
11:19
|
|
Container Queries Kilitli · 8:46 |
Kilitli |
8:46
|
|
Columns Kilitli · 7:40 |
Kilitli |
7:40
|
|
Flexbox-1 Kilitli · 7:40 |
Kilitli |
7:40
|
|
Flexbox-2 Kilitli · 20:14 |
Kilitli |
20:14
|
|
Grids Kilitli · 5:09 |
Kilitli |
5:09
|
|
Transition & Animations Kilitli · 13:17 |
Kilitli |
13:17
|
|
Transforms Kilitli · 9:24 |
Kilitli |
9:24
|
Tailwind Components
7 ders
Tailwind Components
7 ders
| Ders | Durum | Süre |
|---|---|---|
|
Pricing Tables Kilitli · 12:28 |
Kilitli |
12:28
|
|
Products Cards Kilitli · 12:06 |
Kilitli |
12:06
|
|
Register Form Kilitli · 13:28 |
Kilitli |
13:28
|
|
Uygulama: Product Create Form Kilitli · 8:10 |
Kilitli |
8:10
|
|
Navbar Kilitli · 12:15 |
Kilitli |
12:15
|
|
Accordion Kilitli · 9:27 |
Kilitli |
9:27
|
|
Tabs Kilitli · 6:48 |
Kilitli |
6:48
|
#Proje 1: Portfolio
9 ders
#Proje 1: Portfolio
9 ders
| Ders | Durum | Süre |
|---|---|---|
|
Proje Tanıtımı Kilitli · 1:50 |
Kilitli |
1:50
|
|
Proje Ayarları Kilitli · 3:35 |
Kilitli |
3:35
|
|
Navbar Kilitli · 15:34 |
Kilitli |
15:34
|
|
Intro Kilitli · 11:05 |
Kilitli |
11:05
|
|
About Kilitli · 15:10 |
Kilitli |
15:10
|
|
Skills Kilitli · 14:39 |
Kilitli |
14:39
|
|
Services Kilitli · 13:54 |
Kilitli |
13:54
|
|
Projects Kilitli · 17:04 |
Kilitli |
17:04
|
|
Contact Kilitli · 18:32 |
Kilitli |
18:32
|
#Proje 2: E-Commerce
11 ders
#Proje 2: E-Commerce
11 ders
| Ders | Durum | Süre |
|---|---|---|
|
Proje Tanıtımı Kilitli · 2:20 |
Kilitli |
2:20
|
|
React ve Tailwind Entegrasyonu Kilitli · 10:30 |
Kilitli |
10:30
|
|
Navbar Kilitli · 12:25 |
Kilitli |
12:25
|
|
Dropdown Menu Kilitli · 9:09 |
Kilitli |
9:09
|
|
Jumbotron Kilitli · 7:32 |
Kilitli |
7:32
|
|
Categories Kilitli · 8:55 |
Kilitli |
8:55
|
|
Featured Products Kilitli · 13:56 |
Kilitli |
13:56
|
|
Tooltips Kilitli · 6:59 |
Kilitli |
6:59
|
|
Footer Kilitli · 10:42 |
Kilitli |
10:42
|
|
React Component Files Kilitli · 12:15 |
Kilitli |
12:15
|
|
Product Details Kilitli · 19:06 |
Kilitli |
19:06
|
Yorumlar
Eğitmen
Yazılım Geliştirici & Eğitmen
Merhaba, Ben Sadık Turan
Yaklaşık 20 yıllık yazılım sektörü deneyimimle, edindiğim bilgi ve tecrübeyi sade, anlaşılır ve uygulama odaklı eğitimlerle paylaşmaktayım.
Eğitim anlayışımın temelinde; yalnızca teorik bilgi vermek değil, gerçek projeler geliştirerek öğrenmeyi sağlamak yer alır. Hazırladığım tüm içerikler, sıfırdan başlayan bir öğrencinin bile kısa sürede kendi projelerini geliştirebilecek seviyeye ulaşmasını hedefler.
Amacım; karmaşık konuları basitleştirerek, öğrenme sürecinizi daha verimli ve keyifli hale getirmek, sizi özgüvenli bir yazılımcı haline getirmektir.
Bugüne kadar farklı platformlarda 600.000’e yakın öğrenciye ulaşan eğitimlerimle, yazılım dünyasına nitelikli geliştiriciler kazandırmaya devam ediyorum. Öğrencilerimin kariyer yolculuğuna katkı sağlamak, benim için en büyük motivasyon kaynağıdır.
Eğer;
✅ Uygulamalı öğrenmeyi
✅ Kalıcı bilgi edinmeyi
✅ Sade ve net anlatımı
önemsiyorsanız, doğru yerdesiniz.
“Tüm eğitim içeriklerimi Kod Atölyem çatısı altında hazırlıyor ve sizlerle buluşturuyorum.”
Birlikte öğrenmek ve gelişmek dileğiyle.