Html Css ve JavaScript ile E-Ticaret Sitesi Yapımı 2024

Html, Css, JavaScript, localStorage, Responsive Web Design ile sıfırdan Modern E-Ticaret Sitesi Yapımı

4.66 (463 reviews)
Udemy
platform
Türkçe
language
Web Development
category
instructor
2,539
students
23.5 hours
content
Feb 2024
last update
$59.99
regular price

What you will learn

Html, Css ve JavaScript ile bir profesyonel web sitesinin sıfırdan nasıl geliştirildiğini öğreneceksiniz.

Web Tasarımınızı sıfırdan kendiniz adım adım yapabileceksiniz.

Kurs sonunda freelance olarak web sitesi geliştirip bundan kazanç elde edebilecek seviyeye geleceksiniz.

Bu kurs ile JavaScript becerilerinizi geliştireceksiniz.

Responsive web sitelerinin nasıl geliştirildiğini öğreneceksiniz.

Bu kurs ile Css becerilerinizi geliştireceksiniz.

Bir e-ticaret sitesinde bulunan yapıları tanıyacaksınız.

Bir kütüphane kullanmadan JavaScript ile neler yapılabildiğini öğreneceksiniz.

Bir JavaScript kütüphanesi nasıl kurulup çalıştırıldığını öğreneceksiniz.

İş başvurularında sizi öne çıkaracak bir projeye sahip olacaksınız.

Bir e-ticaret sitesini baştan sona birlikte hazırlayacağız. Böylelikle karşılaşılan sorunların nasıl çözüldüğünü öğreneceksiniz.

Description

HTML, CSS ve JavaScript ile E-Ticaret Sitesi Geliştirme Kursu

Eğer HTML, CSS ve JavaScript'e yeni başlıyorsanız ve Front-End Developer olmayı hedefliyorsanız, doğru yerdesiniz. Bu kurs, sıfırdan bir web sitesi nasıl geliştirileceğini öğrenmek için E-Ticaret Sitesi yaparak size rehberlik edecek.

Kurs Hedefleri

  • Beğendiğiniz temaları kodlamak konusundaki becerilerinizi geliştireceksiniz.

  • Responsive web siteleri tasarlama ve tüm cihazlara uyumlu hale getirme yeteneklerinizi artıracaksınız.

  • Projelerinize dinamizm kazandırmak için JavaScript'i aktif bir şekilde kullanmayı öğreneceksiniz.

  • JavaScript ile yapılan değişikliklerin sayfa yenilendiğinde kaybolmaması için tarayıcı depolama alanı olan localeStorage'i nasıl kullanacağınızı öğreneceksiniz.

Kurs İçeriği

Bu kurs, hiç JavaScript bilgisine sahip olmayanlar için bile uygundur. Kursun içeriği aşağıdaki konuları içerir:

  • HTML ve CSS ile tasarımı kodlamaya başlama.

  • Tüm sayfaları HTML ve CSS ile kodlama.

  • JavaScript temelini atıp, JavaScript ile profesyonel projeler geliştirmeye başlama.

  • Beğendiğiniz temaları kodlamaya dökme yeteneği kazanma.

  • Temanızı SEO için HTML5 kullanarak optimize etme.

  • Tüm cihazlara uyumlu, responsive web siteleri geliştirme.

  • JavaScript kullanarak web sitelerini dinamikleştirme.

  • localStorage'i kullanarak verileri tarayıcıda saklama.

  • Kütüphane kullanmadan özgün slider oluşturma.

  • JavaScript kütüphanelerini kullanmayı öğrenme.

  • Ürünlere yorum eklemeyi öğrenme.

  • E-Ticaret sitesinde ürün arama (search) özelliği geliştirme.

  • E-Ticaret sitesinde sepete ürün ekleme ve silme işlemleri.

  • JavaScript modül sistemini ustalıkla kullanma.

  • Projenizi canlıya alma.

Kurs Sonrası Fırsatlar

Bu kursu başarıyla tamamladığınızda:

  • Freelance olarak tema geliştirme ve bu alandan kazanç elde etme yeteneğine sahip olacaksınız.

  • İş başvurularında öne çıkacaksınız.

  • React öğrenmeye hazır hale geleceksiniz.

  • Bu temaya sıfırdan bir admin paneli ekleyip Back-End tarafını yazmayı öğretecek başka bir kursa katılma fırsatınız olacak. Böylece Full Stack Developer olma yolunda ilk adımı atmış olacaksınız.

Bu kurs, sizi web geliştirme dünyasına adım atmaya ve kendi e-ticaret projelerinizi hayata geçirmeye hazırlayacak. Şimdi kaydolun ve kendi başarı hikayenizi yazmaya başlayın!

Content

Giriş

Giriş

Proje Geliştirme Ortamı

Visual Studio Code ile Geliştirme Ortamının Hazırlanması

Proje Öncesi

Freelancer İş Potansiyeli
Referans Alınacak Siteleri Bulma

Proje Kurulumu

Proje Kurulum
Base Css
Html Class İsimlerini Bulma

Header Oluşturma

Kursta Kullanacağımız Referans Tema Linki
Header İskelet Yapısı
Header Html Element
Header Left Center Css
Header Right Css
Header Center Active Class
Header Dropdown Menu
Header Mega Menu

Proje Yapı Ayarları

Button ve Input Stillendirmeleri

Modal Search Html

Modal Search Html
Modal Search Css

Header Responsive

Container Responsive
Header Responsive

SASS 7-1 Pattern

SASS 7-1 Pattern
Css Klasör Mimarisi

Slider Yapımı

Slider Html
Slider Image
Slider Description
Slider Buttons

Proje Kategori Bölümü

Categories Html ve Css

Product Item Bölümü

Product Item Html
Product Item Css

Kampanyalar

Campiagns Html
Campaigns Css

Blog Alanı

Blogs Html
Blogs Css

Markalar

Brands Html
Brands Css

Tekli Kampanya Bölümü

Campaign Single Html
Campaign Single Css

Proje Politika Alanı

Policy Html
Policy Css

Footer Alanı

Footer Yapı Anlatımı
Footer Subscribe Html
Footer Subscribe Css
Footer Widgets Html
Footer Widgets Css
Footer Copyright Html
Footer Copyright Css

İletişim Sayfası

Contact Top Html
Contact Top Css
Contact Bottom Html
Contact Bottom Css

Shop Sayfası

Shop Sayfası

Account Sayfası

Account Html
Account Css

Cart(Sepet) Sayfası

Cart Sayfası Tanıtım
Cart Page Progress Bar Html
Cart Page Progress Bar Css
Cart Page Table Html
Cart Page Table Css
Cart Page Cart Total Html
Cart Page Cart Total Css

Ürün Detay Sayfası

60- Single Product Tanıtımı
Breadcrumb Html
Breadcrumb Css
Product Gallery Html
Product Gallery Css
Product Info Html
Product Info Css
Tab List Html
Tab List Css
Tab Panel Descriptions Html
Tab Panel Descriptions Css
Tab Panel Information Html
Tab Panel Information Css
Comment Item Html
Comment Item Css
Comment Form Html
Comment Form Css
Single Product Page Refactoring

Blog Sayfası

Blog Sayfası

Single Blog Sayfası

Single Blog Html
Single Blog Css

JavaScript Bölümü Tanıtımı

JavaScript Bölümü Tanıtımı
Proje JavaScript Kurulumu

JavaScript ile Header

Header Sidebar
Sidebar Click Outside
Search Modal

Kütüphanesiz Slider

Kütüphanesiz Slider

Kütüphane Kullanarak Slider Yapımı

Glide.js Kurulumu
Product Items Glide.js Entegrasyonu

Proje Data İşlemleri

localStorage Nedir?
Data Tanıtımı
localStorage'e Ürün Kaydetme

JavaScript Modül Sistemi

JavaScript Modül Sistemi
Projeyi Modül Sistemine Geçirme
Datadan Ürün Listeleme

JavaScript ile Sepet İşlemleri

Sepete Ekleme Fonksiyonu
Button Disabled
Product Listeme Düzenlemesi
Cart Sayfası Ürün Listeleme
Sepetten Ürün Silme
Cart Fiyat Hesaplama İşlemleri

JavaScript ile Ürün Detayı İşlemleri

Tıklanan Ürüne Gitme
Ürün Detayını Getirme
Single Product Thumbnails İşlemleri
Single Product Zoom
Active Classları
Sepete Ekle İşlemleri
Tabs İşlemleri

JavaScript ile Yorum İşlemleri

Reviews Active Class
Yorum Ekleme

Ürün Arama İşlemleri

Search Ürünleri Listeleme
Tıklanılan Ürüne Gitme
Ürün Arama

Modal Dialog

Modal Dialog Html
Modal Dialog Css
Modal Dialog JavaScript

Refactoring (Kod Düzenlemeleri)

Refactoring1
Refactoring2
Refactoring3

Deployment (Projeyi Canlıya Alma)

Deployment

Screenshots

Html Css ve JavaScript ile E-Ticaret Sitesi Yapımı 2024 - Screenshot_01Html Css ve JavaScript ile E-Ticaret Sitesi Yapımı 2024 - Screenshot_02Html Css ve JavaScript ile E-Ticaret Sitesi Yapımı 2024 - Screenshot_03Html Css ve JavaScript ile E-Ticaret Sitesi Yapımı 2024 - Screenshot_04

Reviews

Burak
October 16, 2023
İşin mantiğini anlatiyor. Bu kursu izlemeden önce biraz html ve CSS tavsiye ederim.Arkasindan bur kurs ile güzel projelere imza atılabilir.
Emre
September 24, 2023
Gerçekten çok başarılı bir kurstu benim için, başlangıç üzerinden çok daha ileri bir seviyeye taşıyan bir kurs olduğunu düşünüyorum. Kesinlikle düzgün bir alt yapı gerektiriyor, iyice kavradıktan sonra bir iş tecrübesi bile denilebilir bu kurs için.
Doğancan
August 28, 2023
Kurs gayet başarılı tek eksiği back-end kısmının farklı videoda olması onun dışında hocamızın anlatımı efsane diyebilirim.
Miyase
August 6, 2023
Güzel ve öğretici, bence tek sorun hoca biraz hızlı konuşuyor fakat bu sorunu videoyu yavaşlatarak çözebilirler.
Mahir
July 30, 2023
Emeğine sağlık hocam, gerçekten bir şeyler öğrenmek istiyorum bu kurstan ama anlatım tarzın beni soğuttu kurstan. Yazdığınız kodlar biraz sizin ezberinizde olan şeyler gibi, incele kısmında element style bölümünde yazıp, ondan sonra code'a geçirsek her şey çok daha güzel olurmuş. İstediğimi bulamadım açıkçası
Şuayb
June 14, 2023
Emin hocamın anlatış tarzı ve detaylara girmesi gayet güzel. Her seviyede insanın anlayabileceği şekilde anlatıyor. JS kursunu tamamlamadıysanız bir yere kadar yapabilirsiniz, sonra kursu tamamlayıp geri gelin diyor ama bana kalırsa hiç JS bilmeyen birisi bile projenin JS kısmına devam etse çok az anlayamadığı yer olur sanırım, zira o kadar detaylı anlatıyor. Ancak eksik gördüğüm husus olarak, sorulara cevap alamıyorsunuz maalesef. Sanırım düzenli sıklıkta girip topluca cevaplamak istiyor. Dolayısıyla bazen 2 günde cevap alıyorsunuz, bazen 2 hafta geçse de cevap alamıyorsunuz. Discord'a yönlendiriyor ama orada da cevap alamıyorsunuz. Zira oradaki insanlar da sizin gibi kursiyer.
Murat
May 30, 2023
Emin hoca sayesinde çok farklı şeyler öğrendim. Hocanın bazı hatalarda videoyu kesmeden hataları bulup düzeltmesi çok faydalı oldu. Teşekkürler Emin Hocam özellikle sizden React kursu bekliyorum.
Phyton
May 16, 2023
Benim için iyi bir kurs, bahsedildiği gibi html css temelinizin biraz olması lazım o şekilde gayet iyi ilerleniyor.
Ömer
April 18, 2023
gerçekten harika bir kurs almanızı tavsiye ediyorum paranız yoksa da youtubede birsürü videosu var kanal ismi=bilgisayar genetiği
Taha
April 17, 2023
Öncelikle Emin hocama teşekkür ediyorum,onca kurs aldım fakat bu kurs oldukça faydalı bilgiler içeriyor temel seviye html,css,js bilginiz varsa düşünmeden alın. Sabredin anlayarak yapın size çok şey katacaktır.
Kerem23
April 13, 2023
görüp görebilceğiniz en iyi kurslardan biri eğitmen hem bilgili hemde pratiği iyi herşeyi düşünmüş udmey üzerinde böyle bir kurs yok 0 dan başladım şuan ilerleme kaydetmeye devam ediyorum herekese başarılar teşşekürler hocam cansın
Furkan
April 4, 2023
Aslında Emin hocayı youtube'den tanıdım, oradada mükemmel bir anlatım biçimi vardı ve buradada aynı şekilde devam ediyor.
Sinan
March 30, 2023
Her konunun en ince ayrıntısına kadar örneklerle, özellikle gerçek bir proje üzerinde gösterilmesi sayesinde hemen hemen tüm eksiklerimi sayenizde kapattım. Emekleriniz için teşekkürler. Diğer tüm kurslarınızı aldım, onlara devam edeceğim. Yeni kurslarınızı büyük bir sabırsızlıkla bekliyor olacağım.
Ayşenur
March 25, 2023
Yazılıma yeni adım atan biri olarak bu kursa başladığımda bilgim vardı, ama pratiğe dökemiyordum. Şimdi kursu bitirmek üzereyim ve diyebilirim ki bu kurs beni her anlamda geliştirdi. Emin hoca gerçekten detaylı anlatıyor. Örneğin bugüne kadar class isimlerinin nasıl verileceğine böyle detaylı değinen bir eğitim görmemiştim. Kendinizi geliştirmek istiyorsanız kesinlikle bu kursa katılmalısınız. Teşekkürler Emin Hocam.
Melike
January 6, 2023
Udemy de gördüğüm en detaylı kurs. Gerçekten her noktası titizlikle anlatılmış. Daha 2.videodayım. Çok özenli anlatılmış. Html css js ile ilgili tüm sorunlarımı geride bu kursla bırakacağıma eminim

Charts

Price

Html Css ve JavaScript ile E-Ticaret Sitesi Yapımı 2024 - Price chart

Rating

Html Css ve JavaScript ile E-Ticaret Sitesi Yapımı 2024 - Ratings chart

Enrollment distribution

Html Css ve JavaScript ile E-Ticaret Sitesi Yapımı 2024 - Distribution chart
4915472
udemy ID
10/6/2022
course created date
10/20/2022
course indexed date
Bot
course submited by