2016-07-05 29 views
5

Düğüm/ifade uygulaması için Heroku ve CDN olarak Cloudfront kullanılarak CircleCI aracılığıyla dağıtılan sunucu tarafı (evrensel, izomorf) oluşturulmuş bir tepki uygulaması kurmaya çalışın.Evrensel bir CDN ve heroku ile tepki oluşturma

Bunun nasıl çalışacağını kavramsallaştırmakta zorluk çekiyorum. Akış birkaç parça dışında oldukça düz görünüyor. Yaptığımız varlıkları CloudFront gibi bir CDN'ye dağıttıktan sonra, onları Heroku'da yaşayan index.html dosyasına nasıl bağlarız? (Bu dizin dosyası oluşturulur ve sunucu tarafı oluşturma için bir üs olarak Heroku düğümü uygulamasından sunulur). Ancak, CDV varlıklarına bağlantılar içermesini istiyorum, Heroku yerleşik varlıkları değil. (CircleCi, webpack'i çalıştırır ve dağıtıldıktan sonra da Heroku yapar)

Daha önce bunlara giren var mı?

+0

İşte CDN

  • Heroku/yüklemesi için dağıtmak ur html komut değerlere doğru dosya enjekte eder. Bu kahramana dağıtır ve bulut cephesini kullanabilir. Bir index.html dosyası kullanmak yerine, heroku'ya dağıtır ve sunucu 'Html.jsx' bileşenini sunar. https://github.com/MadeInHaus/react-flux-gulp-starter –

  • +0

    Endişe, dosyalara nasıl hitap edilirse, sürümleri senkronize tutun ve dağıtımla uğraşabilir, belki benim [gönderimim] (https: // github. com/sholladay/delivr) modülü ve ilgili build- * modülleri size yardımcı olacaktır. Kodunuzu S3'e tahmin edilebilir, üretime hazır bir şekilde koyar ve sonra CloudFront'u basit bir önbellek proxy'si olarak kurarsınız. –

    +0

    Bunu anladın mı? webpack kullanıyor musunuz –

    cevap

    0

    Oluşturulmuş ve karma web paketi dosyalarınızın dizinine/adlarına sahip bir .json dosyası oluşturmak için https://github.com/kossnocorp/assets-webpack-plugin gibi bir şeyi kullanabilirsiniz. Ardından, sunucu tarafındaki oluşturulmuş html'nizde etiketlerinizin nasıl görüneceğini belirlemek için bu .json dosyasını kullanabilirsiniz.

    1. WebPack ile istemci tarafı paket oluşturmak ve
    2. sunucu tarafı paket oluşturma, karma dosyaların adlarını içeren bir .json dosyası oluşturmak. Yukarıdaki .json dosyasını okur ve ben tepki evrensel uygulamalar için kullandığımız bir klişe