Başlarken

2

Tercüme Yüzdesi

Bu bölümde:

  • Meteor ve Meteorite Kurulumları
  • Meteor paketlerinin 5 farklı tipini öğreniyoruz
  • Meteor uygulamanızın dosya yapısını ayarlayalım
  • İlk izlenimler her zaman çok önemlidir, ve Meteor'un kurulumu da nispeten sancısız olmalı. Çoğu durumda uygulamanın kurulumu ve ayağa kalkması 5 dakikadan daha kısa sürer.

    Meteor'a başlarken terminal penceremizi açıyoruz ve şunları yazıyoruz:

    $ curl https://install.meteor.com | sh
    

    Bu işlem sisteminize ‘meteor’ çalıştırılabilir dosyasını kuracak ve kullanıma hazır hale getirecek.

    Not Meteor'un Kurulumu

    Eğer meteor'u lokale kuramıyorsan (ya da kurmak istemiyorsan) sana Nitrous.io'a bir göz atmanı öneriyoruz.

    Nitrous.io uygulamanı hızlıca ayağa kaldırabildiğin ve kodlarını tarayıcıda düzenleyebildiğin bir servistir, ve biz ayarlarını nasıl yapacağın hakkında sana yardımcı olabilecek kısa bir açıklama hazırladık a short guide.

    “Meteor kurulumu” bölümünü basitçe takip ettikten sonra bu bölümdeki “Basit bir uygulama yaratmak” kısmına geçebilirsin.

    Meteorite

    ////

    ////

    Meteorite Kurulumu

    ////

    ////

    $ npm install -g meteorite
    

    Yetki hataları?

    ////

    $ sudo -H npm install -g meteorite
    

    ////

    ////

    ////

    ### mrt vs meteor

    ////

    Basit bir uygulama yaratmak

    Şu an meteor kurulumunu tamamladık, hadi bir uygulama yaratalım. Yapmamız gereken Meteor'un komut satırını kullanmak:

    $ mrt create microscope
    

    Bu komut meteoru indirecek, ve basit kurulumunu hazırlayacak, böylece Meteor projesi senin için hazır. Herşey tamamlandıktan sonra göreceğin dizin şu şekilde olmalı microscope/:

    microscope.css  
    microscope.html 
    microscope.js   
    smart.json 
    

    ////

    ////

    $ cd microscope
    $ meteor
    

    ////

    Meteor's Hello World.
    Meteor’s Hello World.

    Commit 2-1

    Basit microscope projesi oluşturuldu.

    ////

    Paket ekleyelim

    ////

    $ mrt add bootstrap
    

    Commit 2-2

    Bootstrap paketi eklendi

    Paketler konusunda bir not

    ////

    • ////
    • ////
    • ////
    • ////
    • ////

    Meteor uygulamaları için dosya yapısı

    ////

    ////

    ////

    • ////
    • ////
    • ////
    • ////
    • ////
    • ////

    ////

    ////

    Meteor'un mimarisi MVC mi?

    ////

    ////

    Genel değil?

    ////

    ////

    Underscores vs CamelCase

    ////

    ////

    ////

    CSS Müdahaleleri

    ////

    ////

    .grid-block, .main, .post, .comments li, .comment-form {
        background: #fff;
        border-radius: 3px;
        padding: 10px;
        margin-bottom: 10px;
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
    }
    body {
        background: #eee;
        color: #666666;
    }
    .navbar { margin-bottom: 10px }
    .navbar .navbar-inner {
        border-radius: 0px 0px 3px 3px;
    }
    #spinner { height: 300px }
    .post {
        *zoom: 1;
        -webkit-transition: all 300ms 0ms;
        -webkit-transition-delay: ease-in;
        -moz-transition: all 300ms 0ms ease-in;
        -o-transition: all 300ms 0ms ease-in;
        transition: all 300ms 0ms ease-in;
        position: relative;
        opacity: 1;
    }
    .post:before, .post:after {
        content: "";
        display: table;
    }
    .post:after { clear: both }
    .post.invisible { opacity: 0 }
    .post .upvote {
        display: block;
        margin: 7px 12px 0 0;
        float: left;
    }
    .post .post-content { float: left }
    .post .post-content h3 {
        margin: 0;
        line-height: 1.4;
        font-size: 18px;
    }
    .post .post-content h3 a {
        display: inline-block;
        margin-right: 5px;
    }
    .post .post-content h3 span {
        font-weight: normal;
        font-size: 14px;
        display: inline-block;
        color: #aaaaaa;
    }
    .post .post-content p { margin: 0 }
    .post .discuss {
        display: block;
        float: right;
        margin-top: 7px;
    }
    .comments {
        list-style-type: none;
        margin: 0;
    }
    .comments li h4 {
        font-size: 16px;
        margin: 0;
    }
    .comments li h4 .date {
        font-size: 12px;
        font-weight: normal;
    }
    .comments li h4 a { font-size: 12px }
    .comments li p:last-child { margin-bottom: 0 }
    .dropdown-menu span {
        display: block;
        padding: 3px 20px;
        clear: both;
        line-height: 20px;
        color: #bbb;
        white-space: nowrap;
    }
    .load-more {
        display: block;
        border-radius: 3px;
        background: rgba(0, 0, 0, 0.05);
        text-align: center;
        height: 60px;
        line-height: 60px;
        margin-bottom: 10px;
    }
    .load-more:hover {
        text-decoration: none;
        background: rgba(0, 0, 0, 0.1);
    }
    
    client/stylesheets/style.css

    Commit 2-3

    Dosya yapısı yeniden düzenlendi.

    Bir not da CoffeeScript için

    ////

    mrt add coffeescript