PySimpleGUI ile KOLAY PYTHON GUI

2. Bölüm >>

Merhaba , karantina günlerinde Rails için yazılar yazarken internette gözüme takılan bir şey çok ilgimi çekti. PySimpleGUI adında bir Python GUI kütüphanesi. Aynı Ruby'nin Shoes kütüphanesi gibi kolayca GUI uygulaması yapılabiliyor. Hatta bir konsol uygulamasında bile kullanıcıya soru sormak, dosya seçtirmek vs işler için kolayca kullanılabilir.

Hadi beraber kurcalayalım. İlk önce kurulum tabi ki.

    
    pip install pysimplegui
    veya
    pip3 install pysimplegui
    

Reçete-1A Tek Atımlık Pencere (en basit tasarım)

ORTA SEVİYE BİR RAİLS TUTORIAL - 6

Önceki bölümü okumadan buraya geldiyseniz hiç kasmayın geri dönün

• ORTA SEVİYE BİR RAİLS TUTORIAL - 1 (Kurulum, ilk stiller)
• ORTA SEVİYE BİR RAİLS TUTORIAL - 2 (Kullanıcı girişi - Bootstrap CSS)
• ORTA SEVİYE BİR RAİLS TUTORIAL - 3 (Blog altyapısı)
• ORTA SEVİYE BİR RAİLS TUTORIAL - 4 (JavaScript stiller)
• ORTA SEVİYE BİR RAİLS TUTORIAL - 5 (Kolleksiyon sayfaları)

Ana sayfa güncellemesi

Hali hazırda ana sayfada birkaç rastgele gönderi görebiliyoruz. Tüm kolleksiyonlardan birkaç gönderi gösterebilmek için ana sayfayı değiştirelim.

_main_content.html.erb dosyasının içeriğini şöyle değiştirelim:

app/views/pages/index/_main_content.html.erb

<div id="main-content" class="col-sm-9">
    <h3 class="page-name"><%= link_to "Hobi Arkadaşı", hobby_posts_path %></h3>
    <div class="row">
        <%= render @hobby_posts %>
        <%= render no_posts_partial_path(@hobby_posts) %>
    </div><!-- row -->

    <h3 class="page-name"><%= link_to "Çalışma Arkadaşı", study_posts_path %></h3>
    <div class="row">
        <%= render @study_posts %>
        <%= render no_posts_partial_path(@study_posts) %>
    </div><!-- row -->

    <h3 class="page-name"><%= link_to "Takım Arkadaşı", team_posts_path %></h3>
    <div class="row">
        <%= render @team_posts %>
        <%= render no_posts_partial_path(@team_posts) %>
    </div><!-- row -->

</div><!-- ana içerik -->

ORTA SEVİYE BİR RAİLS TUTORIAL - 5

Önceki bölümü okumadan buraya geldiyseniz hiç kasmayın geri dönün

• ORTA SEVİYE BİR RAİLS TUTORIAL - 1 (Kurulum, ilk stiller)
• ORTA SEVİYE BİR RAİLS TUTORIAL - 2 (Kullanıcı girişi - Bootstrap CSS)
• ORTA SEVİYE BİR RAİLS TUTORIAL - 3 (Blog altyapısı)
• ORTA SEVİYE BİR RAİLS TUTORIAL - 4 (JavaScript stiller)

Tasarım Değişikliği

Bu yazıda kolleksiyon sayfalarında gönderiler için başka bir stil deneyeceğiz. Ana sayfada kart tasarımını kullanmıştık. Kolleksiyonlarda liste tasarımı kullanalım. Böylece kullanıcı çok daha fazla gönderiyi görebilir ve içlerinde daha etkili gezinebilir.

Görsellerin olduğu posts klasöründe post adında bir alt klasör tanımlayalım ve içne _home_page.html.erb adında bir parça görsel dosyası tanımlayalım.

Daha önce yazdığımız _post.html.erb parça görselindeki kodu kesip buraya yapıştıralım.

app/views/posts/post/_home_page.html.erb

<div class="col-sm-3 single-post-card" id=<%= post_path(post.id) %>>
    <div class="card">
        <div class="card-block">
            <h4 class="post-text">
                <%= truncate( post.title, :length => 60 ) %>
            </h4>
            <div class="post-content">
                <div class="posted-by">Gönderen <%= post.user.name %></div>
                <h3><%= post.title %></h3>
                <p><%= post.content %></p>
                <%= link_to "İlgileniyorum", post_path( post.id ),
                    class: "interested" %>
            </div>
        </div>
    </div><!-- card -->
</div><!-- col-sm-3 -->

ORTA SEVİYE BİR RAİLS TUTORIAL - 4

Önceki bölümü okumadan buraya geldiyseniz hiç kasmayın geri dönün

• ORTA SEVİYE BİR RAİLS TUTORIAL - 1 (Kurulum, ilk stiller)
• ORTA SEVİYE BİR RAİLS TUTORIAL - 2 (Kullanıcı girişi - Bootstrap CSS)
• ORTA SEVİYE BİR RAİLS TUTORIAL - 3 (Blog altyapısı)

JavaScript Stiller

Ana sayfamız hala sade bir görüntüye sahip. Biraz kontrast yaratmak için gönderileri renklendireceğiz. Fakat CSS yardımıyla sabit renk vermek yerine sayfa her yenilendiğinde başka renk paterni alması için JavaScript kullanacağız (ki öğrenmiş olalım).

assets klasörü altındaki javascripts klasörü içine posts adında bir alt klasör ekleyelim ve içine style.js adında bir yeni dosya ekleyelim. Ayrıca javascripts klasöründeki default .coffee dosyalarını da silebiliriz çünkü kullanmayacağız.

ORTA SEVİYE BİR RAİLS TUTORIAL - 3

Önceki bölümü okumadan buraya geldiyseniz hiç kasmayın geri dönün

• ORTA SEVİYE BİR RAİLS TUTORIAL - 1 (Kurulum, ilk stiller)
• ORTA SEVİYE BİR RAİLS TUTORIAL - 2 (Kullanıcı girişi - Bootstrap CSS)

Ana Sayfa Listesi

Ana sayfada gönderiler listesi yayınlamak istiyoruz. Bu listede tüm gönderileri kart formatında göstereceğiz.

İşe gönderileri kaydedecek Post modelini tanımlayarak başlıyoruz. Konsolda

rails g model post

ORTA SEVİYE BİR RAİLS TUTORIAL - 2

Önceki bölümü okumadan buraya geldiyseniz hiç kasmayın geri dönün

• ORTA SEVİYE BİR RAİLS TUTORIAL - 1 (Kurulum, ilk stiller)

Gönderiler

Artık blog özelliğini eklemeye başlayabiliriz. Uygulamamızın amacı aynı fikirde olan insanları bir araya getirmek olduğundan, bu mesajların yazarlarının tanımlanması gerekiyor. Bunun için kullanıcı yetkilendirme sistemi gerekiyor (authentication).

Kullanıcı Yetkilendirmesi

Kullanıcı yetkilendirme sistemi kurmak için Devise gem kullanacağız. Kendi kendimize de yetkilendirme sistemi kurabiliriz ama bu çok vakit ve kod alacaktır. Bu kolay bir yol ve Rails topluluğu tarafından çok kullanılıyor.

ORTA SEVİYE BİR RAİLS TUTORIAL - 1

Merhaba,

Öğrenirken sizlerle paylaşmaya devam ediyorum. Çoook uzun bir çalışma olacak bu yazı bir sürü bölümlerden oluşuyor. Amacımızda sadece bir yönü öne alarak Ruby on Rails uygulaması yapmak değil görsel stillleri JavaScript kodları vs. ile gelişmiş bir web sitesi tasarımı nasıl yapılır. Santim santim orta seviye bir uygulama nasıl gelişir göreceğiz. Ben bu tutorial'ı freecodecamp'ta buldum. Hadi birlikte devam edelim.