"Öğrenci ders alma sistemi nasıl yapılır? İstenen özellikler nelerdir?"

Soru: Sizden öğrenci otomasyonunda kullanılmak üzere öğrenci ders alma sistemi yapmanız istenmektedir.

İstenenler:

  1. Öğrenci sayfayı açtığı zaman karşısına derslerin olduğu sayfa açılacaktır. (10 Puan)
  2. Ders Ekle butonuna bastığı zaman Okul No, Ad Soyad ve kaç ders alacağı bilgisini yazabileceği bir ekran gelecektir. (5 Puan)
  3. Alacağı ders sayısını girip Ders Ekle butonuna tıkladığı zaman formun hemen altına dersleri yazabileceği alanlar açılacaktır. (15 Puan)
  4. Dersleri gireceği alan açıldığı zaman Ders Ekle butonu kaybolacaktır. (5 Puan)
  5. Dersleri gireceği alan açıldığı zaman daha önce girilen Okul No, Ad Soyad ve Ders Sayısı formda görünecektir. (5 Puan)
  6. Kaydet butonuna basıldığı zaman hem girilen öğrenci bilgisi hem de aldığı dersler Soru l’de verilen resimdeki gibi ekrana yazdırılacaktır. (20 Puan)
  7. Eklenen öğrenci bilgileri ve aldığı dersler dizide tutulacak; tabloya diziden veri alınarak yazdırılacaktır. (25 Puan)
  8. Yukanıdaki işlemler tek bir php sayfasında yapılacaktır. (15 Puan)
  9. Html sayfalar Boostrap kullanılarak yapılacaktır. (10 Puan)

NOT: Bu soru İstanbul Üniversitesi - Cerrahpaşa Hasan Ali Yücel Eğitim Fakültesi Bilgisayar ve Öğretim Teknolojileri Eğitimi Bölümü’nün Web Tabanlı Programlama Dersi Vize sınavına aittir. Sınav tarihi: 09.11.2022

Tabii, size yardımcı olmaktan mutluluk duyarım. Bu taleplerinizi karşılayacak bir öğrenci ders alma sistemi kodları aşağıda verilmiştir.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Öğrenci Ders Alma Sistemi</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
</head>
<body>
    <div class="container">
        <h1>Öğrenci Ders Alma Sistemi</h1>

        <div id="dersler">
            <button id="dersEkle" class="btn btn-primary">Ders Ekle</button>
        </div>
        
        <form id="dersFormu" style="display:none">
            <h3>Öğrenci Bilgileri</h3>
            <div class="form-group">
                <label for="okulNo">Okul No:</label>
                <input type="text" class="form-control" id="okulNo">
            </div>
            <div class="form-group">
                <label for="adSoyad">Ad Soyad:</label>
                <input type="text" class="form-control" id="adSoyad">
            </div>
            <div class="form-group">
                <label for="dersSayisi">Ders Sayısı:</label>
                <input type="number" class="form-control" id="dersSayisi">
            </div>
            <button type="button" id="kaydet" class="btn btn-primary">Kaydet</button>
        </form>

        <div id="sonuclar"></div>
    </div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("#dersEkle").click(function(){
                $("#dersler").hide();
                $("#dersFormu").show();
            });

            $("#kaydet").click(function(){
                var okulNo = $("#okulNo").val();
                var adSoyad = $("#adSoyad").val();
                var dersSayisi = $("#dersSayisi").val();

                var dersler = "";
                for (var i = 1; i <= dersSayisi; i++) {
                    dersler += '<div class="form-group">' +
                                    '<label for="ders' + i + '">Ders ' + i + ':</label>' +
                                    '<input type="text" class="form-control" id="ders' + i + '">' +
                                '</div>';
                }

                var sonuclar = '<h3>Öğrenci Bilgileri</h3>' +
                                '<p>Okul No: ' + okulNo + '</p>' +
                                '<p>Ad Soyad: ' + adSoyad + '</p>' +
                                '<h3>Dersler</h3>' +
                                dersler;

                $("#dersFormu").hide();
                $("#sonuclar").html(sonuclar).show();
            });
        });
    </script>
</body>
</html>

Bu kod, öğrencinin ders almasını sağlayan bir web sayfası oluşturur. Anahtar noktaları aşağıda açıklandığı gibidir:

  • dersEkle butonuna tıklandığında, dersler alanına eklenen dersleri gösteren bir form gösterilir.
  • Öğrenci bilgileri (Okul No, Ad Soyad ve Ders Sayısı) girildikten sonra, kaydet butonuna tıklanarak girilen bilgiler ve dersler sonuclar alanında görüntülenir.
  • Form gizlendikten sonra öğrenci, daha önce girilen bilgileri ve dersleri görmek için dersEkle butonuna tekrar tıklayabilir.
  • 'sonuclar' alanı, girilen bilgileri ve dersleri içeren bir HTML ile doldurulur.

TERİMLER:

  • Bootstrap: Bootstrap, web siteleri ve web uygulamaları için HTML ve CSS tabanlı bir UI framework’üdür. Bootstrap, web tasarımını hızlı ve kolay hale getirmek için bir dizi stiller ve bileşenler sunar.
1 Beğeni

Çok teşekkür ederim.

Öğrenci Ders Alma Sistemi

Bu projede, İstanbul Üniversitesi - Cerrahpaşa Hasan Ali Yücel Eğitim Fakültesi Bilgisayar ve Öğretim Teknolojileri Eğitimi Bölümü’nden bir Web Tabanlı Programlama dersi için öğrenci ders alma sistemi oluşturulmalıdır. Süreç aşağıdaki gibidir:

Ana Sayfa (10 Puan)

Öğrenci sayfayı açtığında, çeşitli derslerin listelendiği bir sayfa ile karşılanmalıdır. Bu, sistemde kayıtlı olan her dersin görüntülenmesini hızlı ve kolay bir şekilde sağlar.

Ders Ekleme Ekranı (5 Puan)

‘Bir Ders Ekle’ butonuna tıklandığında, kullanıcıyı Okul Numarası, Ad Soyad ve alınacak ders sayısını girebileceği bir ekran karşılar. Bu bilgiler sisteme girildikten sonra, öğrenci seçmek istediği dersleri ekleyebilir.

Ders Alınacak Alanların Açılması (15 Puan)

Öğrenci ‘Ders Ekle’ butonuna tıkladığında, seçtiği derslerin listesini girebileceği bir formun altında ders alanları açılır. Öğrenci, buraya girilen dersler ile ilgili bilgileri ekleyebilir.

Ders Ekle Butonu Kayboluyor (5 Puan)

Öğrenci, derslerinin listesini girmeden önce ‘Ders Ekle’ butonunun kaybolduğunu görecektir. Bu, derslerin eklenmesi gereken alanın olduğu bir işarettir.

Önceki Form Verileri Gösteriliyor (5 Puan)

Derslerini gireceği alanın açılmasının ardından, öğrenci daha önce girilen Okul numarası, Ad Soyad ve Ders sayısını görür. Bu, ders eklemeye devam etmesi için gereken bilgileri sağlar.

Kaydet Butonu İşlemi (20 Puan)

Öğrenci ‘Kaydet’ butonuna tıkladığında, hem öğrenci bilgileri hem de öğrencinin aldığı dersler ekrana yazdırılır. Bu, öğrencinin dersleri başarıyla seçtiği ve eklediği zaman verilecek olan geri dönüşü ifade eder.

Dizi Üzerindeki Öğrenci Bilgileri ve Dersler (25 Puan)

Öğrenci bilgileri ve ders seçimleri, daha sonra tablo biçimindeki ekrana yazdırmak için bir dizi içinde saklanır. Bu, verilerin daha sonra kolayca kullanılmasını ve manipülasyonunu sağlar.

Tek Bir PHP Sayfası (15 Puan)

Yukarıdaki tüm işlemler yalnızca bir PHP sayfasında yapılabilir. Bu, kodun yeniden kullanılabilir olmasını ve daha temiz, daha okunabilir kod yapısına sahip olmasını sağlar.

Bootstrap Kullanımı (10 Puan)

Son olarak, tüm HTML sayfaları, modern ve kullanıcı dostu bir arayüz sağlamak için Bootstrap’i kullanarak oluşturulur. Bu, sayfaların duyarlı ve uyumlu olmasını sağlar ve çeşitli ekran boyutlarına uyarlanabilir.

TERİMLER

PHP: PHP, web geliştirme için kullanılan bir server-side scripting dilidir. PHP kodları bir web server tarafından işlenir ve sonucunda HTML kodu üretilir.

Bootstrap: Bootstrap, responsive web sayfası geliştirme için kullanılan popüler bir HTML, CSS, ve JavaScript framework’üdür.

Dizi: Dizi, birden fazla değeri tek bir değişken adı altında saklayan bir veri yapısıdır. PHP’de, diziler indisli (dizinli), ilişkisel (anahtarlı), çok boyutlu veya bir Nesne olarak oluşturulabilir.

Scripting dili (Betik dili): Script dil ya da betik dili, isimlerini Belirli bir programı, uygulamayı veya ortamı kontrol etmek için script ya da betik adı verilen programlardan alır.

Server-side scripting: Upuzun bir süre bilgisayar dünyasında kullanıcılar uygulamaları yani programları bilgisayarlarına indirip oradan kullanırlardı. Bu durum zaman geçtikçe yerini online tabanlı uygulamalara bıraktı.

Bu durumun oluşmasında script dillerin büyük bir rolü bulunmaktaydı. Script diller, kısaca uygulamaların çalışma hızını arttırmak için kullanılmaktadır.