Malwarez v0.1.a “Ben”

Posted on May 20, 2013 by gurc — Leave a comment

Malwarez v0.1.a Kod Adı:”Ben”

Sonunda Malwarez projesinin 0.1 alfa sürümünü tamamlamış bulunuyoruz.

Demoya buradaki linkten erişebilirsiniz.

Projenin hedefi zararlı yazılım aktivitelerinin geçmişte toplanan veriler ile birlikte gerçek zamanlı olarak görsellenmesidir. Geliştirme planımızda uygulamayı hedeflediğimiz 3 ana özellik var. Bunlar;

1) Aktivite Haritaları
2) Sıcaklık Haritaları
3) Saldırı İlişki Haritaları

Alfa sürümünde bu hedeflerden ilkini tamamladık.Diğer iki hedef üzerinden çalışmaya devam ediyoruz. Yakında onları da duyurmayı umuyoruz.

Saldırı ilişki haritalarında zararlı yazılımları coğrafi konumlarına göre görselleştiriyoruz. Görselleştirme iki seviye üzerinden yapılıyor: Dünya ve ülke seviyeleri.

Dünya Seviyesi:

Bu seviyede 2 tip sembol göreceksiniz. İlki zararlı yazılım aktivite sıklığını temsil eden kırmızı dairelerdir. Performans nedeniyle çakışan semboller birleşerek daha büyük tek bir daire ile gösterilmiştir. Diğer sembol ise anlık veriyi temsil eden sarı noktalardır. Her bir sarı nokta hpfriends projesinden gelen yeni olayları temsil eder. Bu semboller çizildikten 3 saniye sonra ekrandan silinir ve kırmızı daireler bu yeni veri ile güncellenir. Hem ülkeler hem de semboller üzerine gelindiğinde çıkan bilgi baloncuklarına sahiptir. Ülkelere ait bilgi baloncukları o ülkeden yapılan toplam saldırı sayısını gösterir. Sembollerin bilgi baloncukları ise o coğrafi konumdan yapılan toplam saldırı sayısını gösterir.

Ekran görüntüsü örnekleri:

Ekranın solunda, toplanan hpfeeds verileri hakkında bazı istatistikleri görebilirsiniz. Bu veriler şu formata sahiptir; “<Değer>(<kayıt sayısı>)”. Ekran görüntüsü şöyledir:

Ekranda gözüken etiketlerin anlamları aşağıdaki gibidir.

(“toplanan hpfeeds verilerinde”)
– Attacker Country: en çok gözlenen zararlı yazılım aktivitelerine sahip ülkeler
– Attacker Port: en çok gözlenen kaynak port
– Attacker IP: en çok gözlenen kaynak IP adresi
– Target Port: en çok gözlenen hedef port ( Şu an yalnızca dionaea.capture kanalından veri toplamaktayız. Bu nedenle sadece bir port değeri gözükmektedir. Yakında başka kanalları da ekleyeceğiz.)

Solda bulunan istatistiklere tıklandığında (şu an bu özellik sadece “attacker IP” bilgisi için geçerlidir.) küçük bir pencerede hpfeeds üzerinden gelen diğer bilgiler gösterilmektedir. Yakında Mnemosyne gibi başka kaynaklardan da ilave veri ekleyeceğiz.

Ülke Seviyesi

Ülkelere ya da kırmızı dairelere tıklamak ülke bazlı zararlı yazılım aktivitesini gösteren yeni bir pencere açacaktır. O haritada bulunan çubuk semboller o ülke içindeki zararlı yazılım aktivite sıklığını temsil eder. Çubuk semboller yeni okunan veriler ile güncellenir. Bu haritalarda Dünya seviyesindeki sarı noktalar gibi yeni olayları vurgulamak için kullanılan göstergeler yoktur, ancak bu özellik de yakında eklenecektir. Çubuk sembollerin bulundukları şehrin ismini ve o şehirdeki olay sayısını barındıran bilgi baloncukları vardır. Bir sonraki sürümde bu çubuklara tıklandığında o şehir ile ilgili istatistiklerin listelendiği yeni bir pencere açılacaktır.

Ekranın sol bölümde yine bazı istatistikler bulacaksınız. Bu kez bu istatistikler ülke özelindedir. Dünya haritasında kullanılan aynı etiketler kullanıldığı için bu bölüme tekrar değinmiyorum.

Kısıtlar

– Firefox üzerinde düşük performans ile çalışıyor. (En iyi chromium ile çalışıyor.)
– Zayıf tarayıcı uyumluluğu
– Dünya haritası üzerinde ki bilgi baloncukları güncellenmiyor.
– Çoklu dil desteği yok.
– Zayıf tasarım (Javascript konusunda yeniyim, hala öğreniyorum…)
– Dünya haritası üzerine eklenen yeni sembollerin bilgi baloncukları gözükmüyor.

Plan
Kısaca, bir sonraki küçük ölçekli sürümde aşağıdaki geliştirmeler ve yeni özellikler bulunacaktır:
– Dünya haritası üzerindeki bilgi balonlarının içeriklerinin dinamik güncellenmesi.
– Bar sembollerine tıklandığında seçilen şehir ile ilgili istatistiklerin listelenmesi
– Yeni hpfeeds kanallarının eklenmesi.
– Ülke haritalarına yeni olay göstergelerinin eklenmesi
– Sıcaklık haritasının eklenmesi(opsiyonel bir sonraki büyük ölçekli sürüme sarkabilir.)
– Kod kalitesinin iyileştirilmesi

Büyük ölçekli sürüm için hedeflerimiz.
– Saldırı ilişki Attack Relation Map Feature
– Performans iyileştirilmesi
– Kod kalitesinin iyileştirilmesi
– Her iki seviye içinde haritalar için yakınlaştırma ve kaydırma özelliklerinin eklenmesi

Bu alfa sürümünde buglar ve kısıtlarımız mevcut. Lütfen her türlü hata/özellik/fikir/eleştiri ve önerinizi githuba eklemekten çekinmeyiniz. Her türlü geri bildirime açığız.

Umarım projemizi beğenirsiniz. 🙂
Gürcan

Tagged with: malwarez, yakindanegitim
Posted in yakindanegitim

Malwarez v0.1.a “Ben”

Posted on May 20, 2013 by gurc — Leave a comment

Malwarez v0.1.a Code Name:Ben

We are pleased to announce the alpha release of version 0.1 of Malwarez project.

You can find the demo here.

The aim was to provide real time visualization of malware activities with historical data. In our development plan there are 3 main features we are planning to implement.
1) Activity map
2) Heatmap
3) Attack Relation Map

Currently we implemented activity map feature. Other 2 features are currently work in progress. We hope soon to announce them too.

In activity map we visualize the malware activities based on geo locations. As zooming capability 2 levels of maps exists with names of world and country levels.

World Level:

In world level you would notice 2 kind of symbols. First one is red bubbles, which represents the malware activity frequencies. For performance reason overlapped symbols are drawn as one larger bubble. The other one is yellow dots, which represent live data. Each yellow dot shows a new event fetched from hpfriends project and disappears after 3 seconds and update the red bubbles. Both countries and Symbols have tooltips to show the frequencies. Country tooltips shows the total number of activities caused by that country. Symbol tooltips shows the total number of activities caused by host located at that geo location.

Here are some screen shots:

On the left side of the screen you will see some statistics about the collected hpfeeds data. Each statistics is in form of “<value>(<number of records>)”. Here is a screen shot:

Here is the meanings of labels:

– Attacker Country: most seen malware activity in countries.
– Attacker Port: most seen Source port for attacks.
– Attacker IP: most seen Source IP in collected hpfeeds data
– Target Port: most seen Destination Port in collected hpfeeds data(Currently we collect data only from dionaea.capture channel. So that there is only one value. We will add more channels soon.)

Clicking on statistics (currently it is available for attacker IP only) will show a small modal and gives additional information collected from hpfeeds. We plan to add additional data sources soon such as Mnemosyne.

Country Level

Clicking on countries or red bubbles will open a new modal screen to show country specific malware activities. In that map, bar graphs represents the malware activity frequencies. Bars are updated upon new event data. In this map there is no indicator for new events like yellow dots in world map but we will add such feature soon. Bar symbols have tooltips which shows the name of the city and the number of events recorded. Clicking on bars will open new statistics modal in the next release.

On the left side of the screen again you will find some statistics. This time they are country specific. Same labels are used as in world map.

Limitations
– Poor performance on firefox. (Works best with chromium)
– Poor browser compatibility tests
– Static tooltip content on world map
– No i18n
– Poor design (I am new on javascript so still learning…)
– new added symbols does not have tooltips on worldmap

Plans
In short, next minor release will contain following new features and improvements:
– dynamic tooltip content on world map
– clicking on bars will open a statistics modal about the selected city
– more hpfeeds channels
– new event indicator for country maps
– Heat map feature (optional may be delayed to major release)
– code improvements

Next major release will contain:
– Attack Relation Map Feature
– Performance improvements
— Currently upon new event all symbols are updated which is unnecessary. We should update only necessary symbols.
– Code Refactoring
– Pan and Zoom feature on both levels

It is an alpha release with limitations and bugs. Feel free to report any issue or feature request! Any feedback is welcomed.

Hope you enjoy it. 🙂
Gurcan

Tagged with: malwarez, yakindanegitim
Posted in yakindanegitim

Django ve Socket.io ile Gerçek Zamanlı Uygulamalar – 4. Bölüm

Posted on May 13, 2013 by gurc — Leave a comment

Merhabalar,

Bu yazımızda Python kullanarak socket.io sunucularına nasıl bağlanabileceğimizden bahsedeceğim. Bu iş için socketIO-client kütüphanesini kullanacağız. Bu kütüphaneyi kurmak için aşağıda ki komutu çalıştırıyoruz.


pip install socketIO-client==0.3

Bu işlemi yaptıktan sonra bir önceki yazımızda oluşturduğumuz Django projesinin içersine scripts isminde bir klasör oluşturuyoruz. Bu klasörde projelerimizde direk django ile iç içe olmayan yardımcı betiklerimizi depolayacağız. Oluşturduğumuz bu klasör içersine ilk betiğimizi oluşturalım. İlk betiğimizin adı socketIO_client.py olsun.

Burada yapacağımız tanımla javascript kullanarak hazırladığımız istemci kodundan çok farklı değil. Burada ki tek fark socket.io üzerinden gelecek mesajların direk bir fonksiyona değil bir sınıfın fonksiyonları tarafından işlenecek olmasıdır. İstemci kodunu yazmamızı sağlayan bu sınıf BaseNamespace sınıfından türetilmelidir. BasNamespace sınıfını socketIO_client mödülünden betiğinize dahil edebilirsiniz.

ilk örnek sınıfımızı yazalım.


from socketIO_client import SocketIO, BaseNamespace
class HelloSocketIOClient(BaseNamespace):
    def on_connect(self, socketIO):
        print '[Baglanti kuruldu]'

    def on_disconnect(self):
        print '[Baglanti kesildi]'

Bu oluşturduğumuz sınıf, bağlantı kurulduğunda ve bağlantı kesildiğinde sadece ekrana bu bilgileri basacak. Her hangi bir veri alışverişi tanımlamadık. Peki bağlantıyı nasıl sağlıyoruz. Aşağıdaki kodları inceleyelim.


socketIO = SocketIO('127.0.0.1', 8000)
chatSocket = socketIO.connect('/chat', Namespace)
socketIO.wait()

İlk satır ile hangi sunucuya bağlanacağımızı verdiğimiz host ve port bilgileri ile belirliyoruz. Daha sonra bu sunucu üzerindeki hangi kanala bağlantı açacağımızı ve hangi sınıfın bu bağlantıdan sorumlu olacağını belirtiyoruz. 3. satır ise bu bağlantının sonlanmasını bekleyen fonksiyondur. Bu fonksiyon sayesinde betiğimiz bağlantı tamamlanana kadar çalışmaya devam edecektir. Ufak bir not: 2. satırı farklı sınıf ve farklı kanallar için birden çok kez kullanmamız mümkün.

Şimdi öncelikle run.py ile django projemizi çalıştıralım. Ardından yeni yazmış olduğumuz socketIO_client.py dosyamızı çalıştıralım. Bu adımda SocketIO bulunamadı gibi bir hata mesajı ile karşılaşabilirsiniz. Virtualenv ortamında betiğimizin başına bu satırları ekleyebilirseniz sorunumuz çözülecektir. 4. satırda belirtilen klasör yolunun kurulumunu yaptığımız kütüphaneyi barındırdığından emin olun ve gerekirse kodu güncelleyiniz.


import os
import sys
sys.path.append(os.environ['VIRTUAL_ENV']+'/lib/python2.7/site-packages/')

Bu adımı da tamamladık.

Şimdi sırada diğer komutları eklemek var.
Öncelikle sunucuya kayıt olmak için subscribe etiketi ile başlamalıyız. Bu yüzden on_connect fonksiyonuna ekleme yapıyoruz.


def on_connect(self, socketIO):
    print '[Baglanti kuruldu]'
    self.socketIO.emit('subscribe' , {'my': 'mynick'});

Burada kullandığımız son satır sunucuya verı göndermek için kullanılmıştır. Sunucuda gelebilecek diğer mesajlar ise welcome ve message’tır. Bu mesajları işlemek için on_welcome(self, id, message) ve on_message(self, id, message) fonksiyonlarını eklememiz yeterlidir.

Peki biz sunucuya veri göndermek istersek. Örnek olarak bir kaynaktan okuduğumuz veriyi sunucuya göndermek istersem, yapılması gereken oldukça basit. Bu işlem için sunucu tarafında daha önceden hazırlamış olduğumuz update etiketini kullanabiliriz, bu sayede sunucuya göndermiş olduğumuz veriler istemcilere mesaj olarak gönderilirebilir olacaktır.

Yapılması gereken tek şey bağlantı açıldıktan sonra belli aralıklarla yada yeni veri gelişine göre veri göndermek olacaktır. Bu işlem için aşağıda ki kodu kullanabiliriz.

Tagged with: socket.io, yakindanegitim
Posted in yakindanegitim

Django ve Socket.io ile Gerçek Zamanlı Uygulamalar – 3. Bölüm

Posted on May 8, 2013 by gurc — Leave a comment

Merhabalar,

Merhaba Dünya django uygulamamızı yaptıktan sonra, sırada gevent ve gevent-socketio kurulumu var. Nedir gevent-socketio? Socket-io protokolünün python dilinde uygulanmasıdır. Yazacağımız django uygulamasının Node.js nin yerini almasını sağlamaktadır. Hızlıca kuruluma geçiyoruz.


# Kurulumu pip ile yapıyoruz.
pip install gevent==0.13.8
pip install git+git://github.com/abourget/gevent-socketio
pip install git+git://github.com/abourget/gevent-websocket

Şimdi sırada djangoyu gevent ile çalıştıracak python betiğini sistemimize ekleyelim.
run.py isimli bir dosya oluşturalım.

run.py
#########################################
#!/usr/bin/env python
from gevent import monkey
from socketio.server import SocketIOServer
import django.core.handlers.wsgi
import os
import sys

# Bu ifade sayesinde django üzerinde ki iletişimi standart kütüphane yerine
# gevent tarafından yapılamasını sağlamaktadır.
# Ayrıntılı bilgi için: http://www.gevent.org/gevent.monkey.html
monkey.patch_all()

try:
  from malwarez import settings
except ImportError:
  sys.stderr.write("Error: Can not find the file 'settings.py'")
  sys.exit(1)

PORT = 8000
os.environ['DJANGO_SETTINGS_MODULE'] = 'socketIO_Test.settings'
application = django.core.handlers.wsgi.WSGIHandler()

if __name__ == '__main__':
  print 'Listening on http://127.0.0.1:%s and on port 843 (flash policy server)' % PORT
  SocketIOServer(('', PORT), application, resource="socket.io").serve_forever()

#########################################

python run.py ile djangoyu çalıştırıyoruz. Bundan sonra Djangoyu çalıştırmak için “python manage.py runserver” komutunu kullanmayacağız.

Eğer bir sorun ile karşılaşmazsanız, http://127.0.0.1:8000/ adresine giriş yaptığınızda yine Merhaba Dünya yazısını göreceksiniz.

Şimdi socket.io için kullanacağımız sunucu bölümünü yazalım. Hatırlarsanız, 1. Bölümde sunucuya bağlanmak için ‘var socket = io.connect(‘/chat’);’ komutunu kullanmıştık. Buradaki /chat ifadesi sunucu üzerinde bağlanılacak kanalı nitelendirmektedir. Yazacağımız sunucu kodunda yapmamız gerekecek ilk şey BaseNamespace sınıfından türeyen bir sınıf yazmamız olacaktir. Bu sınıfı hangi kanal ile ilişkilendirileceğini @namespace(‘/chat’) ifadesi ile belirtiyoruz. Bu sayede /chat kanalına bağlanan tüm istemciler bu sınıf tarafından yönetilecektir.

İstemci tarafında mesaj gönderirken şöyle bir fonksiyon kullanıyorduk. “socket.emit(‘subscribe’ , {‘me’: ‘mynick’});” Parametreleri inceleyelim. “subscribe” parametresi gönderilen mesajın etiketi olarak düşünülebilir, “{‘me’: ‘mynick’}” ise mesajın içeriğidir. Sunucu tarafında gelecek “subscribe” etiketli mesajı işlemek için on_subscribe(self, msg) imzalı bir method yazmamız yeterlidir. gevent-socketio kütüphanesi gelen mesajların etiketlerine göre on_{etiket}(self, msg) fonksiyonunu otomatik olarak çalıştırıyor.

Örnek sunucu kodumuz aşağıdadır.

web/sockets.py
#########################################
from socketio.namespace import BaseNamespace
from socketio.mixins import BroadcastMixin
from socketio.sdjango import namespace

@namespace('/chat')
class ChatNamespace(BaseNamespace, BroadcastMixin):
  client_num=0

  def on_subscribe(self, msg):
    print 'yeni kullanici: ', msg
    self.emit('welcome', '%d numarali istemcisiniz.'%(self.client))
    self.emit('message', 'socketIO_Test projesinden bir mesaj geldi...'%(self.client))

  def on_update(self, msg):
    print 'guncelleme bilgisi geldi. ', msg
    self.emit('message', msg)
#########################################

Bu işi tamamladıktan sonra socketIO_Test/urls.py dosyasını güncellememiz gerekmektedir.

socketIO_Test/urls.py
#########################################
from django.conf.urls import patterns, include, url
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
from socketio import sdjango

sdjango.autodiscover()

urlpatterns = patterns('',
url(r'^$', 'web.views.index'),
url(r'^socket\.io', include(sdjango.urls)),
)
urlpatterns += staticfiles_urlpatterns()
#########################################

web/static klasörü içersine socket.io.min.js dosyasını koymamız gerekmektedir. Ayrıca ilk yazımızda anlatılan kodları test-soclet.io.js adıyla web/static/ klasörüne kaydetmemiz gerekmektedir.

Son olarak index.html sayfamızı güncelliyoruz.


web/templates/index.html
#########################################
<html>
<head>
<script type="text/javascript" src="static/socket.io.min.js"></script>
<script type="text/javascript" src="static/test-socket.io.js"></script>
</head>
<body>
{{hello_text}}
<br/>
<textarea id="log" style="width: 400px; height: 600px;"></textarea>
</body>
</html>
#########################################

Projeyi aşağıdaki linkten indirebilirsiniz.

https://github.com/ggercek/ornekler/tree/master/python/socketIO_Test

Bir sonraki yazı da hazırladığımız bu sisteme python kullanarak nasıl bir istemci ile bağlanabileceğimize değineceğim.

Tagged with: django, socket.io, yakindanegitim
Posted in yakindanegitim

Django ve Socket.io ile Gerçek Zamanlı Uygulamalar – 2. Bölüm

Posted on May 7, 2013 by gurc — Leave a comment

Merhabalar,

Sunucu tarafında Django kullanacağımızdan bahsetmiştik. Bu yazida Django ile Merhaba Dünya uygulaması yapacağız. İlk iş olarak virtualenv ile bir çalışma ortamı yaratalım ve buraya bir django projesi yaratalım.

Sanal ortamımızı oluşturalım
–no-site-packages parametresi ile sistemimizde kurulu olan python kütüphanelerini bu yeni ortama aktarmamaktadır. Kurulum testleri için oldukça kullanışlı bir araç, ayrıntılarına bakmanızı tavsiye ederim.


virtualenv test --no-site-packages
cd test
source bin/activate
# yeni ortamımız boş olarak kullanıma hazır.
# Djangoyu kuralım.
pip install django==1.5.1

Django projemizi oluşturalım.

django-admin.py startproject socketIO_Test

Django için bir uygulama oluşturalım

django-admin.py startapp web

mkdir web/template
mkdir web/static

settings.py
######################################################################

Şimdi settings.py dosyamızı güncelleyelim. Dosyanın en üstüne aşağıdaki değişkenini ekleyelim.

import os
PROJECT_ROOT = os.path.dirname(os.path.abspath(__file__)) + '/..'

Bunu yapmamızdaki sebep relative path yerine absolute path ile tanımlarımızı yapmamız gerekmesidir.

STATICFILES_DIRS değişkenini güncelleyelim.

STATICFILES_DIRS = (
    # Put strings here, like "/home/html/static" or "C:/www/django/static".
    # Always use forward slashes, even on Windows.
    # Don't forget to use absolute paths, not relative paths.
    os.path.join(PROJECT_ROOT, 'web/static'),
)

TEMPLATE_DIRS değişkeni

TEMPLATE_DIRS = (
    # Put strings here, like "/home/html/django_templates" or "C:/www/django/templates".
    # Always use forward slashes, even on Windows.
    # Don't forget to use absolute paths, not relative paths.
    'web/templates'
)

INSTALLED_APPS değişkenine oluşturduğumuz web uygulamasını ekliyoruz.

INSTALLED_APPS = (
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.sites',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    # Uncomment the next line to enable the admin:
    # 'django.contrib.admin',
    # Uncomment the next line to enable admin documentation:
    # 'django.contrib.admindocs',
    'web',
)

######################################################################

url.py
######################################################################

Şimdi url.py dosyasını güncelleyip bir hello world uygulaması yapalım. urlpatterns değişkenini güncelleyelim.

urlpatterns = patterns('',
    # Examples:
    # url(r'^$', 'helloworld.views.home', name='home'),
    # url(r'^helloworld/', include('helloworld.foo.urls')),

    # Uncomment the admin/doc line below to enable admin documentation:
    # url(r'^admin/doc/', include('django.contrib.admindocs.urls')),

    # Uncomment the next line to enable the admin:
    # url(r'^admin/', include(admin.site.urls)),

    url(r'^$', 'web.views.index')
)

######################################################################

Şimdi template dosyamızı oluşturalım.

web/templates/index.html

######################################################################

<html>
<head></head>
<body>
{{hello_text}}
</body>
</html>

######################################################################

View kısmını oluşturalım.

web/views.py
######################################################################
# Create your views here.
from django.shortcuts import render_to_response

def index(request):
    return render_to_response('index.html',{'hello_text':'Merhaba Dünya'})

######################################################################

Şimdi sırada sunucumuzu çalıştırmak var. Bunun için manage.py betiğini kullanıyoruz.

python manage.py runserver

http://127.0.0.1:8000/ adresine giriş yaptığınızda Merhaba Dünya yazısını göreceksiniz.

Şimdi sırada gevent ve gevent-socketio kurulumu var.

Tagged with: django, yakindanegitim
Posted in yakindanegitim

Django ve Socket.io ile Gerçek Zamanlı Uygulamalar – 1. Bölüm

Posted on April 30, 2013 by gurc — Leave a comment

Merhabalar,

Bu hafta sizlere django ile socket.io kullanımından bahsedeceğim.
HTML5 ile websocket’lerin standart olmasına karşın şu an django kurulduğu haliyle bu desteği sağlamamaktadır. Bu desteği eklememiz için farklı bir wsgi kullanmamız gerekmektedir. Çok ayrıntıya girmeden hızlıca örneklere geçmek istiyorum. Bu terimlerle ilgili döküman sayısı oldukça fazla, fakat internet üzerinde bulunan örnek kodlar djangonun son sürümü ile düzgün çalışmamaktadır.

Hızlıca örneğimize geçelim.
İstemci tarafı:
İstemci tarafında kullanacağımız socket.io kütüphanesi hayatımızı oldukça kolaylaştırıyor. Burada ki yapıyı IRC’ye benzetebiliriz. Öncelikli olarak bir sunucuya bağlanıyoruz. Ardından da istediğimiz kanalı seçiyoruz. Socket.io ile yapacağımız bağlantı da aynı bu şekilde çalışıyor.

Kod örneğimiz şöyledir.

/*
Bağlantıyı sayfayı çektiğimiz sunucuya açıyoruz. Ve bağlantıyı açarken hangi kanala bağlanacağımızı belirtiyoruz. Birden fazla kanala bağlanmamız da mümkün, ama basitlik için buna değinmeyeceğim.
*/
var socket = io.connect('/chat');

/*
Mesajlaşma sırasında mesajlarımızı ayırt edebilmemiz için etiketler kullanılıyor. Bu işi socket.io bizim için arka planda otomatik olarak yapıyor. Mesajlar içersinde bulunan bu etiketlere göre socket.on() metodunu kullanarak kaydettiğimiz 'callback' fonksiyonlarımız çalıştırılıyor.

Burada socket.connect() fonksiyonu ile başlattığımız bağlantı işlemi tamamlandığında yapılması gerekenleri tanımlıyoruz. Bu örnek kapsamında istemci bağlantı işlemini tamamladıktan sonra bir kayıt isteği gönderiyor.
*/
socket.on("connect", function(){
console.log('bağlandı>');
/* Kayıt olma isteği gönderiyoruz */
socket.emit('subscribe' , {'me': 'mynick'});
console.log('kayıt yapıldı.');
});

/*
Burada sunucudan gelecek 'welcome' etiketli mesajların hangi fonksiyon ile işleneceğini belirtiyoruz. Mesajımızın içeriği obj parametresi ile fonksiyonumuza geçiriliyor.
*/
socket.on("welcome", function(obj){
console.log('Merhaba mesajı geldi. Mesaj içeriği: ' + obj);
});

/*
Kayıt işlemimiz tamamlandıktan sonra sunucu tarafından gönderilen message etiketli mesajları işliyoruz.
*/
socket.on("message", function(obj) {
console.log('Yeni mesaj geldi. Mesaj içeriği: ' + obj);
});

Bu yazının ikinci bölümünde sunucu tarafına değineceğim.

İyi haftalar

Tagged with: socket.io, yakindanegitim
Posted in yakindanegitim

Kartograph.js: 3. Bölüm Etkileşimli Haritalar – 2

Posted on April 22, 2013 by gurc — Leave a comment

Merhabalar,

Bu hafta fare olaylarının çizdiğimiz SVG elemanları ile nasıl etkileşime girebileceğine değineceğim. Bu işi tamamlamak iki yoldan bahsedeceğiz, JQuery ve Kartograph.js.

JQuery:

SVG elemanları çizildikleri katmanların (layer) stil sınıf değerlerini almaktadır. Bu yüzden JQuery yardımı ile bu katmana ait tüm elemanları çekip bu elemanların ‘mouseover’, ‘mouseout’ ve ‘click’ olaylarına ait callback fonksiyonlarını tanımlamamız yeterlidir.


$('.countries').each(function(index) {
    $(this).on('mouseover', function() {
        $(this).css("fill", "#FF0000");
    });
    $(this).on('mouseout', function(){
        $(this).css("fill", "#ABC");
    });
    $(this).on('click', function(){
        countryId=$(this).attr('id');
        alert('You clicked on country with id: ' + countryId);
    });
}

Bu yöntemin bir problemi SVG üzerinde tanımlanmış verilere ulaşmamız kolay olmamaktadır. Örnek vermek gerekirse bu yöntem ile sadece DOM elemanlarının üzerinde bulunan verilere erişebiliriz. ‘Name’, ‘ISO’ gibi SVG üretirken json dosyasında belirttiğimiz değişkenlere bu yöntemle ulaşamıyoruz. Bunun için kartograph.js’nin bize sunmuş olduğu yöntemleri kullanmalıyız.

Kartograph.js:

Kartograph.js nin desteklediği fare olayları şöyledir; ‘click’, ‘mouseenter’, ‘mouseleave’, ‘dblclick’, ‘mousedown’, ‘mouseup’, ‘mouseover’, ‘mouseout’. Bu olaylara ilgili callback fonksiyonlarının atanması/tanımlanması için kullanabileceğimiz iki yöntem var.

addLayer fonksiyonunun içersine aşağıdaki satırları eklemek. Burada tanımlanan fonksiyon 3 parametre almaktadır. ‘Data’ değişkeni fare olayına hedef olan path svg elemanın verilerini tutan sözlük değişkenidir. ‘Path’ değişkeni Raphael objesidir. ‘Event’ ise javascript tarafından oluşturulan orjinal olayıdır.


map.addLayer('countries', {
    click: function(data, path, event) {
        countryId=data.id;
        alert('You clicked on country with id: ' + countryId);
    },
    mouseenter: function(data, path, event) {
        path.attr("fill", "#FF0000");
    },
    mouseleave:function(data, path, event) {
        path.attr("fill", "#ABC");
    }

getLayer fonksiyonu sayesinde daha önceden eklemiş olduğumuz bir katmanı çağırıp üzerine yeni callback fonksiyonlarımızı atayabiliyoruz.


map.getLayer('countries')
    .on('click', function(data, path, event) {
        countryId=data.id;
        alert('You clicked on country with id: ' + countryId);
});

SVG Verilerine Erişmek

Burada ki verilere erişmek için yapılması gereken oldukça basittir. Bu veriler kartograph kütüphanesinde layerların altında sözlük objeleri olarak tutmaktadır. Bu verileri çekmek için istediğiniz katman objesinin üzerinden getPathsData fonksiyonunu kullanıyoruz. Bu fonksiyon bize sözlük objelerinden oluşan bir dizi döndürüyor.


var layer = map.getLayer('mylayer');
var pathData = layer.getPathsData();

Bu dönen verileri haritamız üzerinde bar yada dairesel grafiklerin büyüklüklerini belirlemek için kullanabiliriz. Bu grafiklerin bu çekilen veriler ile nasıl oluşturabileceğimizi bir sonraki yazıda belirteceğim.

İyi haftalar,

Gürcan

Tagged with: kartograph.js, yakindanegitim
Posted in yakindanegitim

Kartograph.js: 2. Bölüm Etkileşimli Haritalar

Posted on April 15, 2013 by gurc — Leave a comment

Merhabalar,

Geçtiğimiz hafta temel anlamda Kartograph kütüphanesi nasıl kurulur, kullanılır konusuna değinmiştim. Bu hafta başladığımız çalışmaya devam ederek haritalar üzerinde bilgi balonları çıkarma ve bar grafikler çizme konusuna değineceğim.

Etkileşimli Haritalar

İlk örneğimiz bölgelerin üzerine gelindiğinde ufak bir bilgi balonu çıkarmak olacak. Bunun için Jquery QTip2 eklentisine ihtiyaç duyuyoruz. Geçtiğimiz hafta içi QTip2 projesinin stabil sürümü jquery’nin son sürümü ile sorunlu çalıştı bu yüzden nightly build indirmenizi tavsiye ediyorum.

Qtip2’yi indirdikten sonra aşağıdaki satırları html kodunuza eklemeniz gerekmektedir.


<link href="/s/css/jquery.qtip.min.css" rel="stylesheet" media="screen">
<script type="text/javascript" src="jquery.qtip.min.js"></script>

Şimdi sıra geçtiğimiz hafta katman eklemek için kullandığımız addLayer fonksiyonunu değiştirmeye geldi.


map.addLayer('countries', {
    styles: {
        fill: '#abc',
        stroke: '#fff'
    },
    chunks: 50,
    tooltips: function(data) {
        return "Merhaba Dünya";
    }
});

addLayer fonksiyonun da kullandığımız tooltip ifadesi fare ile svg path elemanın üzerine gelindiğinde görüntülenmesi istenen değeri döndüren bir fonksiyondur. İlk aşamada sadece “Merhaba Dünya” ifadesini döndürecektir, data parametresinden birazdan bahsedeceğim.

İlk bilgi balonumuz şöyledir.

Eğer bu görüntü hoşunuza gitmediyse, bootstrap desteğini de kullanmamız mümkün. Bunu yapmak için aşağıda ki kodları loadMap fonksiyonundan önce ekleyiniz.


$.fn.qtip.defaults.style.classes = 'qtip-bootstrap';
$.fn.qtip.defaults.style.def = false;

Ufak bir not, balonlar içinde html taglerini kullanmanızın mümkün olduğunu belirteyim.

Evet ilk aşamayı böylece tamamlamış bulunuyoruz. Peki bilgi balonlarında gösterilecek bu verileri SVG içersinden nasıl çekeceğiz, daha da önemlisi bu bilgileri SVG içersine nasıl ekleyeceğiz?

Öncelikle daha kısa olduğu için SVG içersinden nasıl veri çekebileceğimizden bahsetmek istiyorum. Yapmamız gereken tek şey tooltips için tanımladığımız fonksiyonun data parametresini kullanmak olacaktır. Bu data parametresin ile SVG içersinde bulunan path elemanına ait attributelere erişmemiz mümkün. Örnek olarak üzerine gelindiğinde ülke isimlerini listelemek istersek yapmamız gereken kodu aşağıda ki gibi değiştirmek olacaktır.


tooltips: function(data) {
    return data.name;
}

Şimdi sırada istediğimiz bilgileri içersinde barındıran SVG’ler üretmeye geldi. Bu işi yapmak için bir önceki yazıda kullandığımız kartograph.py kütüphanesini kullanacağız. Geçen yazıda kullandığımız json dosyasının içeriğinde ufak bir değişiklik yapıyoruz ve iki anahtar ifade daha ekliyoruz, “charset” ve “attributes”. World.json dosyamızın içeri şu şekildedir.


{
    "layers": [{
        "id"         : "countries",
        "src"        : "ne_50m_admin_0_countries.shp",
        "charset"    : "utf-8",
        "attributes" : "all"
    }],
    "export": {
        "width" : 1000
    },
    "styles": {
        "fill"  : "#dfdcdc",
        "stroke": "#fff"
    }
}

İlk aşamada kaynak dosyasının içeriğini bilmediğimizi varsayarak tüm bilgileri SVG’ye ekleyelim. Bunun için attribute anahtar kelimesine “all” değerini vermemiz yeterli. “charset” ile SVG içersine yazılacak bilgilerin hangi encoding kullanılarak yazılacağını belirtiyoruz. Json dosyamızda gerekli değişiklikleri yaptıktan sonra kartograph.py’i çalıştırıyoruz.


kartograph world.json -o world-detailed.svg

Elde edilen yeni SVG dosyası yaklaşık 300kb daha büyük oldu. Bu SVG içerinde hangi attributelar olduğunu öğrenmek için aşağıdaki basit python betiği kullanabiliriz.


from xml.dom import minidom
svgFile = 'world-detailed.svg'
xmldoc = minidom.parse(svgFile)
paths=xmldoc.getElementsByTagName('path')
p=paths[0] # sadece ilk elemana bakalım.
attr=p.attributes
for k in attr.keys():
    if k <> 'd':
        print k, '=',attr.get(k).value

Bu betik ilk path elemanı üzerinde tanımlanmış attribute ve değerlerini listeliyor. Betik sadece fikir vermesi için hazırlanmıştır. d attributeu bu aşamada işimize yaramayacağı için atlanmıştır. Betiğin ekran çıktısı şu şekildedir.


data-adm0-a3-is = ABW
data-mapcolor13 = 9.0
data-su-dif = 0.0
data-sovereignt = Netherlands
data-wb-a3 = ABW
data-fips-10 =
data-admin = Aruba
data-pop-year = -99.0
data-geou-dif = 0.0
data-lastcensus = 2010.0
data-economy = 6. Developing region
data-gdp-year = -99.0
data-tiny = 4.0
data-sov-a3 = NL1
data-adm0-a3-us = ABW
data-iso-n3 = 533
data-mapcolor8 = 2.0
data-mapcolor9 = 2.0
data-subregion = Caribbean
data-un-a3 = 533
data-abbrev = Aruba
data-formal-fr =
data-abbrev-len = 5.0
data-adm0-a3-wb = -99.0
data-homepart = -99.0
data-name-sort = Aruba
data-adm0-a3-un = -99.0
data-featurecla = Admin-0 country
data-subunit = Aruba
data-long-len = 5.0
data-income-grp = 2. High income: nonOECD
data-region-un = Americas
data-brk-name = Aruba
data-adm0-dif = 1.0
data-name-alt =
data-adm0-a3 = ABW
data-postal = AW
data-brk-diff = 0.0
data-brk-a3 = ABW
data-name = Aruba
data-name-long = Aruba
data-gdp-md-est = 2258.0
data-scalerank = 3
data-iso-a3 = ABW
data-iso-a2 = AW
data-su-a3 = ABW
data-labelrank = 5.0
data-geounit = Aruba
data-brk-group =
data-gu-a3 = ABW
data-woe-id = -99.0
data-pop-est = 103065.0
data-mapcolor7 = 4.0
data-note-brk =
data-wb-a2 = AW
data-continent = North America
data-type = Country
data-note-adm0 = Neth.
data-formal-en = Aruba
data-region-wb = Latin America & Caribbean
data-wikipedia = -99.0
data-name-len = 5.0
data-level = 2.0

Bu bilgilere tooltips için tanımladığımız fonksiyonunun data parametresi üzerinden erişmemiz mümkün.

Harita Üzerinde Bar Grafiği Göstermek

Bilgi balonları konusunu tamamladıktan sonra şimdi sıra haritalar üzerinde çeşitli olay yoğunluklarını özetlemek için yaygın olarak kullanılan bar grafiklerine geldi. Bu tip grafikleri çizmeden önce haritalar üzerinde basit işaretleri nasıl koyacağımızdan bahsedelim. Örnek olarak Türkiye sınırları içersinde bir nokta ve bu noktaya bir bilgi balonu ekleyelim.


function drawPoint(map, x, y) {
    x = -1 * x;
    var c = new Array(x, y);
    var bar = map.addGeoPath([c, c]);
    bar.attr({
        stroke: '#FF0000',
        opacity:.75,
        'stroke-width': 5,
        fill: '#FF0000',
        'stroke-linecap': 'round'
    }); /* stroke-linecap için tanımlı değerler: butt, round, square, inherit */

    if (Raphael.svg) {
        /* Bilgi Balonu için kullanılan kod bölümü */
        setTimeout(function() {
            $(bar.node).qtip({
                content: {
                    title: 'Baslik',
                    text: 'x: ' + x + ' y: ' + y
                },
                position: {
                    target: 'mouse',
                    viewport: $(window),
                    adjust: { x:7, y:7}
                }
            }, 0);
        });
    } else {
        bar.attr('path', map.getGeoPathStr(pts));
    }
}

Bu fonksiyonu addLayer fonksiyonundan sonra drawPoint(map, 40, 40); şeklinde çağırdığımızda aşağıda ki ekran görüntüsünü elde ediyoruz.

parametre olarak x için 40 vermemize rağmen -40 olmasının sebebi kullanılan koordinat sistemlerinin farklı olmasıdır. Ayrıntılara sonraki yazılarda değinmeye çalışacağım.

Kodu kısaca açıklayalım.

var c = new Array(x, y); ile bir koordinat ikilisi olusturuyoruz. Daha sonra bu duzlemde gosterilecek noktamızı var bar = map.addGeoPath([c, c]); komutu ile sisteme ekliyoruz. Bu fonksiyon parametre olarak çizilecek şekil koordinatlarını alıyor. En az iki nokta tanımlamamız gerekmekte, nokta olduğu için tanımlanan iki noktada birbirinin aynısı oluyor. Öteyandan bu fonksiyona birden fazla koordinat vermenizde mümkün.
noktamızı olusturduktan sonra görsel özelliklerini belirlemek için bar.attr() fonksiyonunu kullanıyoruz. Bu fonksiyonun özelliklerinden vurgulamam gereken sadece “stroke-linecap” olduğunu düşünüyorum. Bu değer konulacak olan noktanın şeklini belirlemeye yarıyor ve alabileceği değerler ise “butt, round, square, inherit” olarak tanımlıdır.
Devamında ki bölümde ise qtip kullanarak konulan nokta için bilgi balonu tanımlanıyor.

Noktanın nasıl ekleneceğini gördükten sonra bunu bir bar haline getirmek için yapmamız gereken tek şey, noktayı tanımlamak için kullandığımız koordinatlardan ikincisini istenilen büyüklüğe uygun olacak koordinatı hesaplamak ve çizdirmek olacaktır. Örnek kodu aşağıda ki gibi güncellemediğimizde bu ekran görüntüsünü elde edeceğiz.


drawPoint(map, 42, 38.42);

// drawPoint fonksiyonun içini aşağıdaki gibi güncelleyiniz.


var c = new Array(x, y);
var d = new Array(x+0.6, y+4);
var bar = map.addGeoPath([c, d]);

Burada örnek olması için verdiğimiz değerlerin oluşturduğunuz haritalara göre otomatik hesaplanabiliyor olması gerekmektedir. Bu konuya ilerleyen yazılarda değineceğim.

Umarım faydalı bir yazı olmuştur.

İyi haftalar,

Gürcan

Tagged with: kartograph.js, kartograph.py, yakindanegitim
Posted in yakindanegitim

Kartograph.js: 1. Bölüm Nedir ve Nasıl Kullanılır

Posted on April 8, 2013 by gurc — Leave a comment

Merhabalar, bu hafta kartograph kutuphanesinin kullanımından bahsedeceğim.

Kartograph Nedir?

Bu kütüphane etkileşimli haritalar yaratmak için kullanılan basit ve hafif bir sistemdir. Temelde 2 kütüphaneden oluşmaktadır. Bunlar kartograph.py ve kartograph.js‘dir. Birincisi istediğiniz özelliklerde SVG haritaları hazırlamanıza imkan sağlarken, diğeri ise hemen hemen bilindik tüm internet tarayıcılarında çalışan etkileşimli haritalar hazırlamanızı sağlar.

Merhaba Dünya

Bu link üzerinden aşağıdaki örneğe erişebilirsiniz. Github üzerinden tüm projeyi bilgisayarınıza çekmenizi tavsiye ederim. Şimdi aşağıda ki kodu inceleyelim.


<!DOCTYPE html>
<html>
<head>
<script src="../lib/jquery.min.js"></script>
<script src="../lib/raphael-min.js"></script>
<script src="../kartograph.min.js"></script>
<script type="text/javascript">
    $(function() {
        var svgLayer='countries';
        var map = Kartograph.map('#map');
        map.loadMap('svg/world.svg', function() {
            map.addLayer(svgLayer, {
                styles: {
                    fill: '#abc',
                    stroke: '#fff'
                },
                chunks: 50,
                done: function() {
                    map.getLayer(svgLayer).style('fill', '#789');
                }
            });
        });
    });
    </script>
</head>
<body>
    <div id="map"></div>
</body>
</html>

Öncelikli olarak gerekli kütüphaneleri ekliyoruz. Bunlar JQuery, Raphael ve Kartograph.js.
Daha sonra ilk işimiz haritanın gösterileceği div elemanı ile ilişkilendirilmiş map nesnesini yaratmak.
var map = Kartograph.map(‘#map’); ifadesi ile bu işlemi yapıyoruz.
Şimdi sırada ilgili svg’nin seçilmesi var. Bu işlemi loadMap fonksiyonu ile yapıyoruz. Buradaki önemli ayrıntı görüntülemek istediğiniz katmanların(layer) map nesnesine eklenmesidir. Aksi halde tarayıcınızda herhangi bir şey göremeyeceksiniz.
Esas problem elimizde bulunan svglerde hangi katmanların mevcut oldugunu bilmektir. Bunu belirlemenin en ilkel yöntemi herhangi bir text editor yada more komutu ile svg dosyasını açıp svg group elemanlarını aramak olacaktır. Bir başka deyişle g tag’i bulunan <g class=”” id=”countries”> gibi ifadelere bakmaktır.Bir başka yöntem olarak aşağıdaki gibi ufak bir python betiği ile grupların id’lerini listeleyebiliriz.
from xml.dom import minidom< svgFile = 'world.svg' xmldoc = minidom.parse(svgFile) svgGroups = xmldoc.getElementsByTagName('g') for g in svgGroups: print g.getAttribute('id')

Eminim daha kolay yöntemleri mevcuttur fakat Gimp yada Inkscape tarzı araçlarla pek haşır neşir olmadığım için bu yöntemler daha kolay geliyor. 🙂
Katmanlarımızı belirlediğimize göre addLayer fonksiyonuna geçebiliriz. Bu fonksiyon ile hangi katmanların yükleneceğinin yanısıra bu katmanların nasıl ve hangi özelliklerle yükleneceğini de belirleyebiliyoruz. Bunun için kullanacağımız bazı parametreler mevcut. Bu aşamada bizim için önemli olan ifade chunks:50’dir. Bu ifade sayesinde haritalar bütün olarak değilde küçük parçalar halinde yüklenir. Bu da tarayıcının büyük haritalarla çalışırken donmasını engeller.
Son olarak done ifadesi gelir. Bu da yükleme işlemi tamamlandığında verilen fonksiyonu çağırır.

Daha ayrıntılı bilgi için projenin dökümantasyonuna buradan ulaşabilirsiniz.

İlk ekran görüntümüz:

Bu ayrıntılar benim için yeterli değil diyenler için bir sonraki adıma geçiyoruz. Kartograph.py kullanarak daha ayrıntılı bir harita olusturacağız ve kodu güncelleyip tekrar çalıştıracağız. Eğer ayrıntılı bir haritaya ihtiyacınız yoksa yazıyı burada bitirebilirsiniz.

Kartograph.py

Bu yazıda sadece Ubuntu üzerine nasıl kurulum yapılacağından bahsedeceğim. Ubuntu kullanmıyorsanız bu linkleri okuyunuz. Windows, Mac OS X

Önce gerekli paketleri kuralım:


sudo apt-get install libxslt1-dev python-dev python-shapely python-gdal python-pyproj python-pip

Şimdi Github üzerinden kartograph.py’i kuralım:


sudo pip install https://github.com/kartograph/kartograph.py/zipball/master -r https://raw.github.com/kartograph/kartograph.py/master/requirements.txt

Kurulum işlemi tamamlandıktan sonra svg’yi oluşturmak için kullanacağımız harita detaylarını indirmemiz gerekmektedir:


mkdir ~/kartograph-test cd ~/kartograph-test
wget http://www.naturalearthdata.com/http//www.naturalearthdata.com/download/50m/cultural/ne_50m_admin_0_countries.zip
unzip ne_50m_admin_0_countries.zip

Bu işlemden sonra svg ve indirdiğimiz shape dosyası arasında bağ kuracak olan json dosyasını oluşturuyoruz:


{
    "layers": [{
        "id" : "mylayer",
        "src": "ne_50m_admin_0_countries.shp"
    }],
    "export" : { "width" : 1000 },
    "styles" : { "fill": "#dfdcdc", "stroke": "#fff" }
}

addLayers içersinde kullandığımız styles ifadesini burada da tanımlayabiliyoruz. Ayrıca oluşturulacak svg dosyasının genişlik yükseklik gibi ifadelerini de tanımlamamız mümkün. Örnekte olduğu gibi sadece genişlik yada sadece yükseklik verildiğinde diğer özellik otomatik olarak hesaplanmaktadır. Ayrıca bir başka ayrıntı ise katmanların id değerlerinin belirlenmesi. Bu örnekte “mylayer” değerini verdik. Eğer burada id tanımı yapılmasaydı, id değeri “layer_0” olarak atanacaktı.
Ayrıntılı bilgi için bu linki kullanabilirsiniz.
Json dosyamızda hazır olduğuna göre artık svg dosyamızı oluşturabiliriz. Bunu yapmak için:
kartograph world.json -o world.svg
Bu işlemde tamamlandıktan sonra yukarıda açıkladığımız ilk örnekte bulunan var svgLayer değişkeninin değerini mylayer olarak değiştirip sayfayı tekrar açtığımızda aşağıda ki ekran görüntüsünü elde etmiş oluruz.

Özellikle bu konuya benim gibi yeni başlayanlar için faydalı olacağını umuyorum.

Not: Sitesinde bulunan örneklere bu linkten ulaşabilirsiniz.

İyi haftalar,

Gurcan

Tagged with: kartograph.js, kartograph.py, yakindanegitim
Posted in yakindanegitim

Yakından Eğitim – Malwarez

Posted on April 1, 2013 by gurc — Leave a comment

1. dönem Yakından Eğitim projelerinden “Kötü Amaçlı Yazılım Görsellemesi: Malwarez” projesinde çalışmaya hak kazandım.

Yakından Eğitim projesinin temel hedefi Özgür Yazılım dünyasına geliştiriciler kazandırırken, alanında uzman kişilerle tanışma ve çalışma imkanı sunmaktır. Bu yüzden yerel GSoC olarak tanımlayanlar da mevcut. Usta Çırak ilişkisini temel alan bu çalışmada katılımcılar özgür yazılım geliştirme süreçlerini daha yakından tecrübe etme imkanı yakalıyorlar. Bu açıdan bu projeyi düzenleyen ve projede emeği geçen herkese teşekkür etmek istiyorum. Umarım bundan sonraki dönemlerde de proje büyüyerek daha fazla kişiye ulaşabilir.

Projenin amacı ve yöntemi hoşuma gittiği için yakından eğitime katılmak ve katkı vermek istedim. Bu çalışma sayesinde hem özgür yazılım geliştirme süreçlerini daha iyi anlayabileceğime hem de danışmanlık süreçlerini yakından takip edebileceğime inanıyorum.

Malwarez projesine gelecek olursak. Bu projeyi seçmemde iki temel sebep vardı, Honeypot ve Görselleştirme. Son zamanlarda vakit ayırmak istediğim bu konuları bir projede görmek karar vermemi oldukça kolaylaştırdı. Proje kapsamında başlıca hedefimiz zararlı yazılım aktivitelerinin kolay kullanıma sahip bir arayüz yardımıyla Dünya haritası üzerinde görselleştirilmesidir.

Bu aktivitelerin görselleştirilmesi için kullanacağımız yöntemler kısaca şöyledir. Lokasyona bağlı olarak zararlı yazılımların tespit haritası, zararlı yazılımların yoğunluğuna bağlı sıcaklık haritası ve saldırı/hedef merkezlerinin görsel tespitini kolaylaştıracak ilişki haritası olarak bahsedilebilir. Ayrıca görsellenen bu veriler ile ilgili zamana bağlı grafikler, istenilen zararlı yazılımlar hakkında tespit edilme oranları ve ne tür zararlı yazılım gruplarına girdiği gibi daha detaylı bilgileri de kullanıcıya sunmayı hedefliyor olacağız.

Temel olarak proje için kullanılacak teknolojileri Javascript (kartograph, socket.io, jquery) ve Django olarak özetleyebiliriz.

Bundan sonraki süreçte projeyle ilgili gelişmeleri burada yazıyor olacağım.

Bu 2 ayın projedeki herkes için eğlenceli geçmesi dileğiyle 🙂

İyi haftalar,
Gürcan

Tagged with: malwarez, yakindanegitim
Posted in yakindanegitim