URL ile Resim Üzerine Yazı Yazın! - Image Write App

MegaCrafter

Obsidyen Madencisi
Mesajlar
1,419
En iyi cevaplar
0
Beğeniler
1,542
Puanları
3,070
Sizlere Rust diliyle yaptığım ilginç bir uygulamayı göstericem. Rust diliyle daha önce bir backend yapmamıştım. O yüzden güzel bir tecrübe oldu denebilir. Tabi Rust'ın hala ortaya koyduğu yeni şeyler konusundaki tecrübesizliği de normal backend sistemlerine baya yansıyor gibi. Ve tabi Rust, Rocket ve Heroku'yu bir araya getirebilmek biraz uğraştırdı. Her neyse. Uygulamaya geçelim.

İnternetten bulduğunuz bir resme istediğiniz bir yazıyı ekleyip sunabilmek baya uğraştırabilecek bir konu. Yapmak istediğiniz şey sadece bir yazı yazmak olduğunda veya sadece bir şekil eklemek olduğunda bu kadar uğraşa değmeyecek olduğunu düşünmek de çok doğal. Resmi bilgisayarınıza indirmeniz, bir resim düzenleme uygulamasında açmanız, düzenlemeyi yapıp tekrar resim olarak çıkartmanız ve kullanacağınız yere yine bilgisayarınızdan tutup koymanız gerekir. Kullanabileceğiniz yerlerin belli bir kısmında da direkt bilgisayarınızdan sürüklemeniz yetmez. Onu bir de hizliresim gibi bir yere yükleyip URL olarak almanızı isteyen yerler olabilir. (Github'daki README buna bir örnek mesela. Uygulamanın fikri de ordan gelmişti.)

Bu web uygulaması bu uğraşları azaltmayı amaçlıyor. Peki nasıl yapıyor?

Kod:
https://image-write-app.herokuapp.com/?x=<x>&y=<y>&size=<fontsize>&text=<text>&url=<url>
Uygulamanın URL düzeni bu şekilde. X ve Y yerine yazının bulunacağı koordinatları giriyorsunuz. Bilmiyorsanız X, yatay koordinatı ifade ediyor ve soldan sağa, 0'dan resim genişliğine kadar oluyor. Y ise dikey koordinatı ifade ediyor ve yukarıdan aşağıya, 0'dan resim yüksekliğine kadar oluyor. "fontsize" yazacağınız yazının font büyüklüğü. 20.3 gibi noktalı uzunluklar belirtebilirsiniz. "text" zaten adı üzerinde yazacağınız yazı. "url" de yine adı üstünde temel alacağınız resmin url adresi.

Önemli: x, y, fontsize, text, url parametrelerinin hepsi URL Encoded olmalıdır. Bunun için urlencoder.org adresinden yazacağınız parametreyi URL Encoded biçime çevirebilirsiniz. (& ? işaretleri dışında boşluk karakteri bile çoğu yerde sorun etmiyor. Yani URL Encoded yazmadan da %99 doğru bir sonuç alacağınızı düşünebilirsiniz. Eğer ki resim çıktısını alamazsanız verdiğiniz url'yi URL Encoded yaparak deneyin.)

Örnek URL:
Kod:
https://image-write-app.herokuapp.com/?x=640&y=420&size=45.0&text=MegaCrafter&url=https://www.pngitem.com/pimgs/m/346-3468947_images-rust-lang-ar21-rust-programming-language-logo.png
Görüldüğü gibi x için 640, y için 420, size için 45.0, text için MegaCrafter verilmiş.

Tarayıcınıza bu url'yi yapıştırıp kendiniz de deneyebilirsiniz.

URL olarak verilen resim:


Sonuçta ortaya çıkan resim:


Temel resim için verdiğiniz URL yine bir image-write-app adresi de olabilir. Bu sayede birden fazla yazı yazabilirsiniz. (İçerisinde & ? işaretleri bulunacağı için bu adres kesinlikle URL Encoded olmalıdır.)

Örnek URL:
Kod:
https://image-write-app.herokuapp.com/?x=340&y=410&size=45.0&text=%C3%96rnek&url=https%3A%2F%2Fimage-write-app.herokuapp.com%2F%3Fx%3D640%26y%3D420%26size%3D45.0%26text%3DMegaCrafter%26url%3Dhttps%3A%2F%2Fwww.pngitem.com%2Fpimgs%2Fm%2F346-3468947_images-rust-lang-ar21-rust-programming-language-logo.png
Görüldüğü gibi url için yine bir image-write-app adresi verilmiş. Yukarıda örneği olan url aynen verildi. Ancak URL Encoded halde verilmiş. (Bunu / işaretinin %2F ile değiştirilmesinden anlıyoruz.)

Sonuç:



Şu anlık bütün özellikleri bu kadar. Yazılan yazı şimdilik sadece o açık mavi renkte yazılıyor. Güncellemelerle beraber daha bir sürü özellik eklenmesi planlanıyor. Yazının rengini ayarlayabilmek, yazı dışında farklı şekiller koyabilmek, temel resim için url dışında tek renk resim kullanılabilmesi; beklenen güncellemelerden bazıları.

Bu güncellemeler geldiğinde tabii ki siteye direkt olarak yansıyacaktır. Yakın zamanda parametre vermeden ulaşılan image-write-app.herokuapp.com adresinde bütün bilgiler de yazacaktır. Yapabileceğiniz şeyler ve güncellemelerle beraber.

Tabii ki de açık kaynaklı!
Github sayfası: MegaCrafter/rust-image-write-app

Bu web uygulamasıyla yapılabilecek ilginç şeyleri görmeyi çok isterim.

Lisansa göre asıl yapımcıyı belirttiğiniz (MegaCrafter), asıl kod için bir link verdiğiniz ve başka sınırlamalar eklemediğiniz sürece istediğiniz gibi kullanmakta özgürsünüz.
 



Üst