Framework-7 Kurulum

 

Framework-7 Kurulum

Framework7 web client (istemci taraflı) çalışan bir platform olduğu için herhangi bir ek dosya veya paket vb. bileşen kullanmadan kurulumu sağlanabilir. Fakat Trend olan packet halinde yükleyip nodejs server üzerinde çalıştırmak olduğu için NPM server aracılığıyla packet halini install(yükleyip)'de kullanabiliriz.

Şekilde gözüktüğü gibi Shell istemcisi tarafıyla kurulabileceği gibi, GitHub üzerindende gerekli dosyaları indirerek kurulumu sağlayabiliriz. İlgili GitHub bağlantısı GitHub Framework7.
Gerekli dosyalar makinemize yüklendikten sonra sıra proje kısmında projemize import(dahil) etmede kalıyor.

Şekildeki gibi projemize dahil edip, Artık İstediğimiz framework7 bileşeneni kullanabiliriz.

Not: Packet file yükleme kısmında Shell istemcisinin windows kullanıyorsanız etkin olması gerekmektedir. Aksi halde yükleme sağlayamazsınız.

NPM packet yönetim sistemi içinde shell üzerinden -npm install komutlarını kullanarak ana makine üzerine kurulumu sağlamalıyız ki, packet manager üzerindeki bileşenlere erişebilelim.

Kaynakça;

https://framework7.io/docs/package.html

https://github.com/framework7io/framework7/releases

Framework-7 Kullanım

 

Framework-7 Kullanım

Özellikle front-end kısmında çalışan arkadaşlarımızın aşina olduğu Jquery söz dizimini kullanarak uygulama geliştirmemize olanak sağlayan içinde ek olarak bir sürü css component de getirip tasarım konusunda işinizi oldukça kolaylaştıran inanılmaz basit bir framework tür. Packet ve Script olmak üzere ikiye ayrılmaktadır. Packet kısmı server-side durumları da karıştığı için çok daha farklı syntaxlar ve bileşenler kurmak gerekir. Bu yazıda sadece client-side(istemci taraflı) kullanımını göstereceğim. 

Yukarıdaki kod bloğunda görüldüğü üzere  Dom7 kütüphanesini kullanarak a tagına sahip html elementine tıklandığında bir olay gerçekleştirdik.


Aynı kodu jquery kullanarak yazmak isteseydik,

 Şeklinde söz dizimi hazırlamamız gerekecekti. Sitedeki resmi söz dizimi ile birlikte kod bütünü oluşturmak isteseydik şu şekilde yapacaktık,

İşte bu kadar kolay. Şuanda Framework-7 paketlerini projemize dahil ettiğimizi varsayarak, başlangıç yapmış olduk. Gerisi hayal dünyanıza kalmış bir şekilde istediğiniz modifikasyonu yaparak çeşitli ürün çıkarabilirsiniz. Kolay gelsin :) 

Kaynakça;

https://framework7.io/docs/package.html

http://devnot.com/2017/cordova-ve-framework7-ile-spa/

Framework-7 Tanıtım

Framework-7 (Javascript Framework)

Gelişen dünya ve yazılım camiasında gün aşırı olmak ile birlikte farklı eklentiler,frameworkler ve programcının işini kolaylaştıracak sürü ile ideler çıkmaktadır... Günümüzde Android,IOS ve BlackBerryOS gibi mobil cihaz işletim sistemlerinin de kodlanması normal programcılar için birer ek iş haline gelmiştir. Hal bu durumu aldığında eklenti geliştiriciler farklı arayışlara giderek, Web Client üzerinde mobile design’a  benzetilmiş hafif ve esnek çalışır ve aynı zamanda client üzerinde çalışan türlü javascript tabanlı kütüphaneler(framework) geliştirmişlerdir.. Bunlardan en çok ses getireni AngularJs,Nodejs olmak ile birlikte programcıların birer kurtarıcıları konumuna erişmişlerdir. Framework7 ise yukarıda verdiğim angular,node js örneklerine nazaran çok daha hafif ve basit bir syntax(yazım) ve çok daha hafif çalışma şartları sunarak junior ve senior developer’ların vazgeçilmez dünyalarına adım atmayı başarmıştır... 

Framework7, sınıfındaki diğer frameworklere nazaran çok daha hızlı kurulup, anında sonucu göstermek ile farkını göstermiştir. 

Framework7 ana yaklaşımı geliştiriciye HTML, CSS ve JavaScript alt yapısıyla kolay ve net olan iOS uygulamalarını oluşturmak için bir fırsat vermektedir. Framework7 özgür bir yapıya sahiptir. Bu framework ile hayal gücünüzü kullanarak herhangi bir uygulama geliştirebilirsiniz. 

Framework7 tüm platformlar ile uyumlu değildir. En iyi deneyim ve sadeliği getirmek için sadece iOS platformuna odaklanmıştır. 

Büyük iOS uygulamalarına benzer uygulamalar ve web uygulamaları veya iOS hibrid uygulamaları (PhoneGap) oluşturmaya karar verirseniz Framework7 kesinlikle sizin içindir. 

Kullanımı çok kolay 

Framework7 kullanarak iOS uygulamaları oluşturmak web sitesi oluşturmak kadar çok kolaydır. Kullanmaya başladığınızda bunun ne kadar kolay olduğuna şaşıracaksınız. Yapmanız gereken tek şey basit bir HTML arayüzü ve CSS, JS dosyalarını ekleyerek çalışmaktan ibaret. Framework7 başka özellikler eklemek için JavaScript tarafından dönüştürülen bazı özel etiketleri yazmanız için zorlamaz. Sunuduğu özellikler uygulama geliştirmeniz için yeterlidir. 

                                                                          Arayüz eklentileri

Framework7 ile birlikte modals, popup, action sheet, popover, list views, media lists, tabs, side panels, layout grid, preloader (activity indicator), form elements gibi widgetlar yer almaktadır. Bu widgetların çoğunun çalışması için Javascript'e ihtiyacı yoktur. 

1.  Çoklu görünüm ( split view ) : "data-view" parametresini kullanarak single view durumlarını çok kolay kontrol edebilirsiniz. 

1.  Hızlı animasyonlar : Css animasyonları ve geçişlerinde yüksek performans göstermektedir. 

1.  Sayfa animasyonları : Yeni bir sayfa yüklendiğinde istediğiniz geçiş animasyonlarını ekleyip kullanabilirsiniz. 

1. Kolay JS API : Uygulamanızın her bir bölümünü rahatlıkla kontrol etmenizi sağlar. 

1.  Yumuşak kaydırma : Sayfaları iOS'un sahip olduğu sayfa kaydırma efekti gibi aşağı yukarı kaydırabilirsiniz. 

1.  XHR + Caching + History + Preloading 

1.  Dom7 - Custom Dom Library 

x

      En önemli özellikleri 

        1. Swipe Back       

  2. Swipe Actions   

     3. Dynamic Navbar   

     4. Pull to Refresh 

5. Messages 

   Diğer özellikler 

HERŞEY İLE KULLANILABİLME İMKANI

Birçok javascript tabanlı PWA(İleri web uygulamaları) ile de oldukça uygun çalışmaktadır. Yukarıdaki şemada görüldüğü gibi alanda ileri gelen VueJS,AtomJS gibi frameworklerlede etkileşimli bir şekilde Zengin bir Ekosistem mantığı ile çalışır. 

 Framework7 ile çalışırken sevdiğiniz araçları kullanabilirsiniz. Sizi düz HTML, CSS ve JavaScript dışında bir şey kullanmaya zorlamaz. Framework7 ile uygulamalar oluşturmak, web sitesi oluşturmak kadar kolaydır. 

 Vanilya JavaScript kütüphanesine ek olarak, Framework7, Vue.js ve React'in gücüyle ve sadeliğiyle bileşenlerin sözdizimi, yapılandırılmış veri ve veri bağlantıları sağlamak için Vue.js ve React bileşenleriyle birlikte gelir. 

SPONSORLAR

Framework7 gelişim gösteren bir proje olduğu için bir çok teknoloji firması yatırım ve sponsorluğunu kabul ederek destek sağlamaktadırlar. Kişisel olarak sizde framework7 nin sitesine girip “Donate” butonuna tıklayarak mâli yardımda bulunabilirsiniz. 

Kaynakça;  

https://framework7.io/ 

https://blog.framework7.io/migration-to-framework7-v3-928a21a1eac9