Ne öğreneceğim?
- jQuery sunucusu üzerinde, tam buton kurulumu için gereken kodların (input, type, value,click) hangi kodlarla nasıl kullanılacağını öğreneceksiniz.
- jQuery localhost sunucusu üzerinde, NotePad++'da yazılan kodları HTML Açıklama Satırı özelliğiyle (
< !-- kodlar -->) nasıl kullanılacağını öğreneceksiniz. - jQuery sunucusu üzerinde oluşturduğumuz butonun üzerindeki yazıyı düzenlemeyi, butona basıldığında uyarı mesajı çıkartmayı ve çıkan uyarı mesajındaki mesajı nasıl düzenleyeceğinizi öğreneceksiniz.
Gereksinimler
- jQuery 3.3.1.min.js
- MySQL 5.7.17 (full veya developer serisi)
- XAMPP Server
- Javascript destekli bir Internet Tarayıcısı
- Filezilla (Şu anlık sunucunun çalışması için)
- Notepad++
- Ortalama bir bilgisayar
Zorluk
- Orta düzey
Açıklama
Merhaba arkadaşlar, eğitimimizin bu bölümünde, HTML Açıklama satırı ile istediğimiz kodları, diğer kullanıcılardan gizlemeyi ve buton ekleyip, eklediğimiz butonun hem yazısını hemde özelliklerini nasıl istediğimiz gibi özelleştirebileceğimizi uygulamalı olarak öğreneceksiniz. Butonumuzun üzerindeki yazıyı belirledikten sonra, tıklandığı takdirde önümüze bir uyarı mesajı çıkarması için (alert).('yazilacakmetin') komutundan yararlandık. Bu eğitimimizde 2 konuya değindik fakat, yaklaşık 5-6 tane kodun kullanımı ve bağlantıları ile ilgili teknik bilgileri uygulamalı olarak gösterdim. Eğitim serimiz orta düzeyden zora doğru ilerleyecektir.
Videoda anlatılan tüm programlar (jQuery, FileZilla, Notepad++, XAMPP Server, MySQL) açık kaynak kodludur ve hepsinin github repository'leri bağlantılar kısmında yer almaktadır. Dilerseniz bu programların web sayfalarına ve Windows için direkt indirme bağlantılarına bağlantılar bölümünden erişebilirsiniz.
Eğitimde kullanılan kodlar;
<html lang="tr">
<head>
<meta charset="utf-8">
<title>Sargoon Utopian jQuery Egitim Serisi</title>
<head>
<body>
<!-- <p id="mesaj"> Kaydol </p> -->
<!-- <input id="al" type="text" value="Başarıyla Kayıt Oldunuz"> -->
<input id="click" type="button" value="Kaydol">
<script type="text/javascript" src="js/jqueryders.js"></script>
<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
<script>
$('#click').click(function() {
alert('Başarıyla Kayıt Oldunuz');
});
/*var ad = $('#text').text();
alert(ad);
*/
</script>
</body>
</html>
Video Tutorial
Müfredat
Bağlantılar
- jQuery GitHub Repo
- MySQL GitHub Repo
- FileZilla GitHub Repo
- Notepad++ GitHub Repo
- jQuery Web Sayfası
- jQuery (Windows) Direkt İndirme Bağlantısı
- MySQL Web Sayfası
- MySQL (Windows için) indirme sayfası
- XAMPP Server Web Sitesi
- XAMPP Server(Windows için) indirme sayfası
- FileZilla Web Sayfası
- FileZilla (Windows) Direkt İndirme Sayfası
- Notepad++ Web Sayfası
- Notepad++ (Win 64-bit) Direkt İndirme Bağlantısı
Posted on Utopian.io - Rewarding Open Source Contributors
Thank you for the contribution. It has been approved.
You can contact us on Discord.
[utopian-moderator]
Hey @sametceylan, I just gave you a tip for your hard work on moderation. Upvote this comment to support the utopian moderators and increase your future rewards!
Nice your posting @sargoon
thanks :)
Hey @sargoon I am @utopian-io. I have just upvoted you!
Achievements
Community-Driven Witness!
I am the first and only Steem Community-Driven Witness. Participate on Discord. Lets GROW TOGETHER!
Up-vote this comment to grow my power and help Open Source contributions like this one. Want to chat? Join me on Discord https://discord.gg/Pc8HG9x