Sinatra ile bir web sitesi oluşturun

Kullanımı Sinatra çerçeve çok geniş olduğundan, kullanan araçlar ve hizmetler oluşturmak için kullanılabilir. HTTP Ancak bir veri taşıma katmanı olarak, elde edebileceğimiz tek şey bu değil, bazen bilgileri görüntüleyebileceğimiz veya basitçe veri yakalayabileceğimiz web sayfaları oluşturabilmemiz gerekiyor.
Web sayfalarının bu şekilde oluşturulması aynı zamanda çok basit ve karmaşıktır, çünkü Sinatra Onları inşa ederken bize herhangi bir kalıp dayatmaz, bu nedenle karmaşıklık seviyesi çalışma şeklimize bağlı olacaktır, bu da kendi çalışma şeklimiz zaten kurulmuşsa çok olumlu olabilir.
1- Bu eğitimdeki örnekleri çalıştırmak için bir dil kurulumuna ihtiyacımız olacak. yakut en azından onun içinde sürüm 1.9 ileri.
2- Ayrıca gem'i de kurmuş olmamız gerekiyor. Sinatra ve uygun şekilde yapılandırıldığını. Bu süreçle ilgili herhangi bir şüpheniz varsa, aşağıdaki öğreticiye başvurabiliriz.
3- Yürütmek için bir klasörde izinlerimiz olmalı yakut, dosyaları oluşturun ve değiştirin.
4- Örneklerin içeriğini yazabilmemiz için bir metin düzenleyicimiz olmalıdır, bu, bir dosyayı kaydetmemize izin veren herhangi bir düz metin düzenleyici türü olabilir. .rb Sublime Text ve hatta NotePad ++ gibi.
5- Sonunda şöyle bir web tarayıcısına ihtiyacımız var Google Chrome veya Firefox örneğimizi çalıştırabileceğimiz ve içinde gezinebileceğimiz yer.
Bir web sitesi oluşturmak için öncelikle bir vizyona, bir hedefe, bize yol gösteren ve geliştirirken referans olarak kullanabileceğimiz bir şeye sahip olmamız gerekir, bunu genellikle projemizin ne getireceğini bildiğimizde elde ederiz.
Yapacağımız web sitesi durumunda amaç üç sayfa oluşturmak olacak, bunları listeleyeceğiz:

• Başlangıç
• Benim hakkımda
• Temas etmek

Bu bizi referans bir web sitesi veya kişisel blog olacağı gerçeğine götürüyor, bu şekilde gelecekte başka projelere uygulayabileceğimiz bazı tekniklerde ustalaşmamız gerekecek. İlerlememizi daha hızlı görebilmemiz için, web sitemizi oluştururken yol boyunca yinelenecek ve düzelteceğiz.
Başlamak için adlı bir dosya oluşturmalıyız. start.rb, web sitemizin tüm görüş ve rota mantığını içerecek olan bu olacaktır, sahip olduğu ilk içerik aşağıdaki gibidir:

 'sinatra' gerektirir '/' al erb: başlangıç ​​bitiş

Prensip olarak az önce yazdıklarımız biraz eksik görünüyor ama bakalım işlevi neymiş; ilk başta dahil ettiğimiz Sinatra talimat ile gerekmekBu, artık bu çerçevenin bize sunduğu tüm araçlara sahip olabileceğimiz anlamına geliyor.
O zaman bloğumuz var elde etmek içeriğin kök yolunda yürütülmesi gerektiğini tanımladığımızda, söz konusu içerik bir arayandır. erb ile :başlangıç, ikincisinde ne olduğunu görmek için duraklamamız gerekir. ERB ve neden kullanıyoruz, bakalım:
ERB şablon diliBaşlıktan da anlaşılacağı gibi ERB kısaltmasından başka bir şey değildir. Gömülü Yakut o Gömülü Ruby, bu, şablonlar oluşturmamızı sağlar HTML dilde yazılmış kodu nereye ekleyebiliriz yakut ve bununla, işlem gücünü görünümlere dahil edebilmek için. Bunları, kodda gördüğümüz gibi, önünde iki nokta üst üste gelen addan başka bir şey olmayan semboller kullanarak adlarıyla adlandırırız. :başlangıç.
Tanıttığımız yeni konsept hakkında net olduğumuz için, şimdi aynı dosya içinde ilk şablonumuzu oluşturacağız. start.rb oluşturduğumuz, sonuna aşağıdaki kodu ekleyeceğiz:

 __END__ @@ ana sayfa Kendi web sitem

Başlangıç
Benim hakkımda
Temas etmek

Web siteme hoş geldiniz, burada Ruby ve Sinatra bilgimi göstereceğim.

Burada analiz edebileceğimiz birkaç şey var, önce şunu söyleyerek başlıyoruz. Sinatra bunun işlemenin sonu olduğunu yakut, bunun için kullanıyoruz __SON__ sonra bir çift ile @@ Bölümün adını belirtiyoruz, bu durumda başlangıç, ona bakarsak simgemizin adı aynı.
sonunda hepsini yazdık HTML problemsiz. Ardından konsola geçiyoruz, dosyamızı oluşturduğumuz klasöre kendimizi konumlandırıyoruz. start.rb ve şunları yapıyoruz:

 yakut başlangıç.rb

Geliştirme sunucusunu şuradan inşa edebiliriz: Sinatra ve gittiğimizde aşağıdakileri göreceğiz yerel ana bilgisayar: 4567 veya sunucumuz için yükselttiğimiz port numarası:

Fark ettiğimiz gibi, elimizde HTML uygulamamıza belirttiğimiz kök yolunda oluşturduğumuz Sinatra.
Her zaman kaçınmamız gereken şeylerden biri, yapabileceğimizi yalnızca bir kez tekrarlamak zorunda kalmaktır ve bu, sayfamızın durumunda, birkaç şey için işe yarar. HTML taban, bölümlerini oluşturmak için önceki örneği takip edersek, yalnızca bir kez oluşturabileceğimiz bir şeydir. Benim hakkımda Y Temas etmek, yalnızca içerik kısmını değiştirerek tüm HTML'yi tekrarlamamız gerekecekti, bu da bize uzun, çok uzun bir dosya bırakacak bir şeydi. start.rb.
Bu tür etkisiz davranışlara karşı koymak için, Sinatra düzeni kullanmamıza izin verir, bununla değişiklikleri veya oluşturacağımız dinamik kodu basitçe yazdıracağımız bir temel oluşturabiliriz.
Düzenimizi şekillendirmeye başlamak için ilk etapta dosyamızı değiştireceğiz. start.rb ve birkaç rota daha ekleyeceğiz:

 'sinatra' gerektir '/' yap erb: başlangıç ​​bitiş al '/ açık' yap erb: sonunda '/ iletişim' al erb yap: iletişim bitiş

Artık menüde bahsettiğimiz rotalara sahibiz HTML daha önce inşa ettiğimiz, bu sadece başlangıç, zaten Sinatra bu rotaları çağırdığımızda nelere bakmanız gerektiğini biliyorsunuz, bir sonraki adım, düzenimizi ve her bir rota çağrıldığında görüntülenecek içeriği tanımlamaktır.
Bunu yapmak için önce bir şablon oluşturmalı ve onu isim ile tanımlamalıyız. @@ Yerleşim, daha sonra yararlanarak Yakut Gömülü etiketler ile tek bir başlık tanımlayacağız ve etiketlerle içeriği gerektiği yerde yazdıracağız. İçeriğimizin değiştiği yere yerleştireceğimiz bu, şunu belirtmemize izin veren bir yardımcı programdır. Sinatra bu, rotanın içeriğini yazdırması gereken boşluktadır.
Son olarak, yollarımızın her birini ve taşıyacakları içeriği tanımlarız, bu mantıksal sırayı takip eder. @@rota ve sonra içerik, onunla birlikte Sinatra her aramada neyi göstereceğini bilir. Bakalım dosyamızın tam kodu nasıl görünüyor start.rb düzen dahil:

 'sinatra' gerektirir '/' yap erb: start end get '/ on' erb: on end get '/ contact' yap erb: contact end __END__ @@ layout

Başlangıç
Benim hakkımda
Temas etmek

@@başlangıç
Web siteme hoş geldiniz, burada Ruby ve Sinatra bilgimi göstereceğim.

@@hakkında
Merhaba ben bunun yaratıcısıyım ağRuby ve Sinatra'yı çalıştırmak için becerilerimi kullandım
@@Temas etmek
Benim hakkımda daha fazla bilgi edinmek isterseniz Solvetic'i ziyaret edebilirsiniz.

Gördüğümüz gibi sadece bir tane yazdık. HTML ve içeriğin geri kalanı daha özetlenmiştir, bu nedenle çok daha yönetilebilir ve bakımı daha kolaydır, en baştan farklı bir rotaya gittiğimizde tarayıcımızda nasıl göründüğüne bakalım:

BÜYÜT

Halihazırda birkaç bağlantımız olan ve dinamik içeriğimiz olan, yapısını oluşturmak için yalnızca bir düzen kullanan küçük ama işlevsel bir web sitesi oluşturduk, elbette hala stilleri özlüyoruz. CSS ve resimler ama bu başka bir öğreticinin konusu. Tabii ki bu tarz, Veritabanları ile bağlantılarımız olacaksa veya çok sayıda görünüme sahip işlevlere sahip olacaksak çok kullanışlı değildir, çünkü o zamandan beri tek dosyamız işlemek ve korumak için çok karmaşık olmaya başlayacaktır.
Bununla bu öğreticiyi bitirdik, kullanarak ilk web sitemizi oluşturduk. yakut Y Sinatra, uygun görünen herhangi bir metodolojiyi kullanabilmemizin avantajını kullanıyoruz ve tek dosya uygulaması denilen şeyi yaptık, bu tür bir uygulama çok basit projelerimiz olduğunda kullanışlıdır ve gereksiz yere dağıtılmasını istemiyoruz. örneğinden elde edilen web gibi.Bu Eğitimi beğendiniz ve yardım ettiniz mi?Yazara olumlu puan vermek için bu düğmeye basarak yazarı ödüllendirebilirsiniz.