Ana içeriğe atla

BLOG PROJESİ - Detay Sayfası "Slug" Oluşturulması, Resim ve Video İçeriğinin Eklenmesi ve Düzenlenmesi



Detay Sayfasının Oluşturulması Projemizde yazılmış olan gönderilerin ayrıntılı bir şekilde gösterileceği bir sayfa oluşturarak başlıyoruz. ilk olarak templates dizini altına bir adet "detay.html" adında sayfa oluşturuyoruz. Bu sayfada blogta yer alan gönderiye ait video, resim gibi içerikleri görüntülenecek. Ardından blog uygulamamızın altına yeni bir model oluşturmamız gerekli, bunun için models.py dosyasının içerisine;
slug = models.SlugField(max_length=80, null=True, blank=True, help_text=u"Link otomatik alinir, Lutfen Degistirmeyiniz!")
kodunu yerleştiriyoruz. Model kodlandı bunun uygulamamıza uygulanması için;
./manage.py makemigrations
./manage.py migrate
komutlarını pycharm terminalden ilgili projede çalıştırıyoruz. Böylelikle uygulamamız için gerekli model blog paneline ve veritabanına yansımış ve oluşturulmuş oluyor. Blog detay sayfası için oluşturduğumuz model ile gerekli olan Slug temel, basit ismi kullanarak ulaşım sağlayacağız. Detaylar için Html sayfamız oluşturmuştuk. Bu sayfaya yönlendirme yapmak için view oluşturmamız gerekli, blog uygulamamızın içindeki views.py dosyasına;
def detay(request, url):
     val = Blog.objects.get(slug = url)
     return render(request, 'detay.html',locals())
kodunu ekleyerek yeni bir tanım yapmış olduk. Bununla birlikte "val" adında kullanabileceğimiz detay sayfasına ait bir nesne tanımlamış olduk. Detay sayfasınına yönlendirme için son bir adımımız kaldı. Proje içerisinde yer alan urls.py içerisinde eklemelerin yapılması, kodun tamamı yer almakta gerekli düzenlemeleri ihtiyacınıza göre düzenliye bilirsiniz.
urlpatterns = [
    url(r'^$', views.index , name='index'),
    url(r'^admin/', admin.site.urls),
    url(r'^detay/(?P[^/]*)/$', views.detay , name='detay'),
]

urlpatterns += [
    url(r'^media/(?P.*)$', serve, {'document_root': settings.MEDIA_ROOT,}),
    url(r'^static/(?P.*)$', serve,{'document_root': settings.STATIC_ROOT,}),

]

urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
Biz bu kodda sadece 4.satır olan detay kısmını ekledik diğer "static" ve "media" kısımları resim ve video ile ilintilidir. Projede medya ve statik kullanımı için bir iki küçük eklenti daha yapmamış olmamış gerekiyor. Bu eklentiyi de proje de yer alan settings.py içerisinde yapıyoruz. Geniş bir şekilde kod verilmiştir. konumunu doğru bir şekilde bulunabilmesi için;
TIME_ZONE = 'UTC'

USE_I18N = True

USE_L10N = True

USE_TZ = True


# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.9/howto/static-files/

STATIC_URL = '/static/'
MEDIA_URL = '/media/'

MEDIA_ROOT = os.path.join(BASE_DIR, '../proje_media')
STATIC_ROOT = os.path.join(BASE_DIR, '../proje_static')

STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
)

STATICFILES_DIRS = (BASE_DIR + '/static/',)

STATICFILES_STORAGE = 'whitenoise.django.GzipManifestStaticFilesStorage'

SESSION_COOKIE_AGE = 60*100 # 100 dakika sonra logout oturumu otomatik kapat

FILE_UPLOAD_MAX_MEMORY_SIZE = 510241024 # 5mb
gerekli olan kısımlar "media" ve "static" isimlerini içerek bölümlerdir. Böylelikle; Detay sayfamız çalışır bir hale gelmiş tüm hazırlıklarımızı tamamlamış olduk. Projemize Resim ve Video ekleme Blog gönderilerinin içerisine resim ve video ekleme yapacağız. Bunları da hazırlamış olduğumuz detay sayfasında görüntülemiş olacağız. İlk olarak modellerimizi oluşturalım.
    image = models.ImageField(upload_to='BlogResimleri/%Y/%m/%d', default='BlogResimleri/blog.png')
    video = models.FileField(upload_to='Videos/%Y/%m/%d', blank=True)
    link = models.URLField(blank=True)
Yukarıdaki kodlarda bir adet resim içeriği tutacağımız bir model açıktık. İki adette video tutmak için model oluşturduk. İlk ki bir video dosyasını içeride tutacağımız, diğeri ise dışarıda örnek olarak youtube'dan alacağımız link ile tutacağımız video modellerimiz oluşturulmuş oldu.Sırada yazmış olduğumuz modellerin oluşturulması için;
./manage.py makemigrations
./manage.py migrate
komutlarını çalıştırdık. Projemizi çalıştırarak admin paneline gidiyoruz buradan, yeni bir blog içeriği oluşturup, içerisine media dizini içerisine yerleştireceğimiz video ve resim dizinleri altında yer alan görüntülenecek olan içerikleri ekliyoruz. Bu görüntülemeler detay sayfasında yer alacağı için detay.html içerisine resim için; Videoyu dizinden göstermek için; Videoyu link üzerinden göstermek için; kodlarını kullanıyoruz. Vermiş olduğunuz views içerisindeki nesne ismine göre "val" farklı olabilir ya da model isimlerinize göre "val.link" veya "val.video" farklı olabilir. Dizinden bir şeyler çektiğimiz "upload_to" kaynak içeren modellerimiz için sonlarına "val.video.url" gibi ".url" eklemesi yapıyoruz. Son işlemimiz ise videolarımızı görüntülerken kullanıcı eğer video yüklediyse onu, ya da linkte yer alan videoyu göstereceğiz. Sonuç olarak bir adet video içeriği görüntülenmiş olacak. bunun için video görüntüleme kodlarımızı SNIPPET dediğimiz "{% %}" işaretleri içerisine alıp basit bir if koşulu kullanacağız.

Yorumlar

Bu blogdaki popüler yayınlar

Meşe Bilişim Software Testing Dersi

Manisa Celal Bayar Üniversitesi Bilgisayar Mühendisliği Bölümü ile bazı özel ve kamu kurumları ortaklığında gerçekleştirilen Software Testing Dersi dahilinde bugün Meşe Bilişim şirketinde şirket kurucusu Şahin Mersin ile ilk dersimizi gerçekleştirdik.

Üniversitenin Bilgisayar Mühendisliği bölümünde okuyan 3 veya 4'üncü sınıf öğrencileri tarafından tercih edilebilen Software Testing dersi intörn eğitim modelini temelinde barındıran bir ders ve bence öğrenciler için müthiş bir fırsat.

Manisa Teknokent içerisinde yer alan Meşe Bilişim şirketinde bir dönem süresince Software Testing dersini almaya devam edeceğiz. Şirket benimle birlikte 10 kişilik bir öğrenci kadrosuna bu dönem ev sahipliği yapacak.

Dersin ilk gününde Meşe Bilişim şirket kurucusu Şahin Mersin, biz öğrencilerine dönem süresince ders dahilinde yapacaklarımızdan bahsetti. Yaklaşık 5 farklı projeden söz eden Şahin Bey'in açık kaynaklı projelere katkıda bulunmak hedefi açıkcası beni etkiledi. Bu doğrultuda, ürettiğimiz…

Mqtt Nedir?

Message Queuing Telemetry Transport (MQTT) kelimelerinin baş harfleri ile tanıdığımız bu teknoloji mesajın karşı tarafa ulaştırılması için kullanılan haberleşme protokolüdür.  Haberleşme için mesaj yayınlayan, mesaja abone olan ve mesaj trafiğini kontrol eden yöneticiden oluşmaktadır. Mesaj trafiğini kontrol eden yöneticiye BROKER, mesaj yayınına PUBLISH ve aboneye SUBSCRIBE denir. Mesaj alışverişi publisher dan subscriber lara doğru yani yayıncılardan abonelere doğru olmaktadır. MQTT de asenkron haberleşme protokolü kullanılmaktadır. Mesaj yayıncıları ve mesaj alıcılar arasında eşzamansız olarak veri taşınmaktadır. Diğer haberleşme yapılarına göre basit oluşu ve minimum kaynak tüketmesi sebebiyle “machine-to-machine” (M2M)  makineden makineye veri iletiminde ve (IOT) “Internet of Things” İnternete bağlı nesnelerin mesajlaşmasında tercih edilmektedir.   MQTT IBM de çalışan Dr Andy Stanford-Clark ve Arcom da çalışan Arlen Nipper (şu an Eurotech) tarafından 1999 yılında oluşturulmuştur…

Meşe Bilişim Logolar