Membuat dan Menerapkan Aplikasi Rails ke Heroku



Dalam posting ini kami akan membuat situs web pribadi menggunakan rel dan menyebarkannya ke Heroku. Heroku adalah platform aplikasi cloud - cara baru untuk menyebarkan aplikasi web

Dalam posting ini kami akan membuat situs web pribadi menggunakan rel dan menyebarkannya ke Heroku. Heroku adalah platform aplikasi cloud - cara baru membangun dan menerapkan aplikasi web. Hal terbaik tentang Heroku adalah Anda tidak perlu membayar untuk menghosting aplikasi web dasar karena Heroku telah mengategorikannya sebagai gratis. Kami akan membangun aplikasi rel halaman tunggal dan itu akan menjadi situs web statis yang dapat digunakan sebagai portofolio.





Di bawah ini adalah snapshot dari aplikasi rails (digunakan di Heroku sini )



Mari mulai membuat aplikasi Rails ini. Saya berasumsi Anda sudah menginstal Ruby dan Rails. Pastikan Anda memiliki Ruby 2.0 dan Rails 4.2.2. Anda dapat memeriksa versi dari command prompt.

Catatan: Kami akan menggunakan Ruby 2.0 dan Rails 4.2.2. Jika Anda memiliki beberapa versi Ruby dan Rails yang berbeda, beberapa langkah yang ditunjukkan di posting ini mungkin tidak berhasil untuk Anda.



Membuat Proyek:

Kami akan menamai proyek kami sebagai situs web. Untuk membuat proyek, gunakan perintah Rails website baru

Rails akan secara otomatis menghasilkan semua file dan itu juga akan menginstal semua permata yang diperlukan dengan menjalankan bundel yang diinstal secara otomatis seperti yang ditunjukkan di bawah ini

Sekarang Anda akan melihat folder situs web di bawah drive C: Anda (lokasi dari mana kami menjalankan perintah situs web baru Rails). Mari buka folder situs web di beberapa IDE. Saya memiliki Brackets IDE dari Adobe. Anda dapat menggunakan yang lain karena tidak masalah.

Struktur Proyek:

Struktur proyek yang dihasilkan akan terlihat seperti di bawah ini

Meskipun kami belum menulis kode apa pun, Anda dapat menjalankan aplikasi situs web sekarang. Untuk menjalankan aplikasi situs web, jalankan perintah Rails dari folder situs web seperti yang ditunjukkan di bawah ini

Seperti yang Anda lihat pada cuplikan di atas bahwa aplikasi situs web kami telah diterapkanhttp: // localhost: 3000

Anda akan dapat melihat layar di bawah ini saat mengakses URLhttp: // localhost: 3000

Tapi kami ingin menampilkan halaman utama aplikasi kami saat mengakses URLhttp: // localhost: 3000 /.Untuk itu mari kita buat halaman index.html di bawah folder publik proyek situs web kita.

Catatan: Rails secara otomatis akan melayani halaman index.html saat mengakses URL roothttp: // localhost: 3000

Untuk saat ini kami hanya memiliki satu baris di halaman index.html.

Mari kita mengakses URL roothttp: // localhost: 3000

Sekarang, hidupkan kembali halaman index.html kami dengan menambahkan beberapa gambar - JS dan CSS keren. Kami akan menggunakan tema grayscale dari start bootstrap.

melewati nilai dan melewati referensi di java

Grayscale Mulai Tema Bootstrap -

Di bawah ini adalah snapshot dari tema bootstrap start grayscale yang akan kita gunakan. Kami akan menyesuaikan tema ini untuk memenuhi kebutuhan kami.

Anda dapat mengunduh tema ini dari http://startbootstrap.com/template-overviews/grayscale/

Unduh tema skala abu-abu dan salin CSS, font-awesome, font, img, JS, dan index.html ke direktori publik proyek situs web. Di bawah ini adalah snapshot proyek setelah menambahkan CSS, JS, font, folder gambar dan halaman index.html di bawah direktori publik proyek situs web.

Ayo jalankan proyek situs web kita sekarang:

Saat menjalankan proyek, Anda akan disajikan dengan halaman tema grayscale yang bagus.

Kami akan memodifikasi halaman index.html (di bawah direktori publik proyek situs web) untuk memberikan tampilan profesional.

Di bawah ini adalah snapshot dari proyek website setelah melakukan perubahan pada halaman index.html. Kami baru saja mengubah gambar dan mengedit beberapa teks agar spesifik untuk individu.

Anda dapat mengubah index.html dan grayscale.CSS sesuka Anda. Sekarang, kami siap menerapkan aplikasi situs web kami ke Heroku.

Mendorong kode ke Github:

Sebelum menerapkan aplikasi ke Heroku, kita perlu memasukkan kode kita ke repositori Github jarak jauh. Untuk itu Anda membutuhkan akun Github. Jika Anda tidak memiliki akun Github, buka dan buat di www.github.com .

Anda juga perlu menginstal Github di Windows Anda. Unduh Github untuk windows dari https://windows.github.com/ .

Setelah Anda mengunduh dan menginstal Github di komputer Anda, buka aplikasi Github dan konfigurasikan kredensial Github Anda dan pilih Git Bash shell sebagai shell default Anda (Anda juga dapat memilih opsi lain sesuka Anda) dan kemudian simpan perubahannya.

Anda perlu membuat repositori di Github, tempat kami akan menyimpan proyek situs web kami dari jarak jauh. Untuk membuat repositori, masuk ke Github dan klik opsi repositori baru yang ditunjukkan di tombol hijau.

Beri nama repositori Anda (dalam hal ini kami menamakannya railtoheroku) dan klik tautan buat repositori seperti yang ditunjukkan di bawah ini.

Github akan memberikan URL jarak jauh ( https://github.com/eMahtab/railtoheroku.git dalam hal ini) untuk repositori railtoheroku yang akan dibutuhkan saat mendorong kode dari mesin lokal ke Github.

Sekarang, kami siap untuk memasukkan kode proyek situs web kami ke Github. Ikuti langkah-langkah di bawah ini untuk memasukkan kode ke Github.

Buka Git shell dan gunakan perintah Git init untuk menginisialisasi direktori situs web seperti yang ditunjukkan di bawah ini:

Sekarang, tambahkan semua file di direktori situs web di bawah kontrol versi dengan menjalankan Git add.

Lakukan semua file dengan menjalankan Git commit –m “Final Commit”

Tambahkan repositori jarak jauh seperti yang ditunjukkan di bawah ini:

Sekarang langkah terakhir yang benar-benar akan mendorong kode ke repositori Github:

Kami selesai dengan Github. Bagian selanjutnya adalah penerapan aplikasi yang sebenarnya ke Heroku.

Menerapkan aplikasi ke Heroku:

Buat akun Heroku di https://www.heroku.com/

Catatan : Kami harus membuat beberapa perubahan untuk penerapan aplikasi ke Heroku. Heroku tidak mendukung SqLite 3, melainkan memiliki database PostgreSQL. Jadi kita harus menghapus ketergantungan sqlite3 dari gemfile. Heroku membutuhkan permata rails_12factor, yang digunakan oleh Heroku untuk menyajikan aset statis seperti gambar dan lembar gaya. Dua perubahan yang diperlukan dalam Gemfile diringkas di bawah ini:

Hapus permata baris 'sqlite3' dari Gemfile

Tambahkan baris berikut ke Gemfile

grup: pengembangan,: uji lakukan #<<<< not in production gem 'sqlite3' end group :production do gem 'pg', '0.17.1' gem 'rails_12factor', '0.0.2' end

Mari kita periksa apakah semuanya bekerja dengan baik setelah melakukan perubahan pada Gemfile. Simpan Gemfile dan jalankan bundel instal dengan bendera khusus (–tanpa produksi) untuk mencegah pemasangan lokal permata produksi apa pun.

Mari kita lakukan perubahan yang dibuat di Gemfile ke repositori jarak jauh di Github:

Dorong perubahan ke repositori Github jarak jauh:

Membuat aplikasi baru di Heroku:

Masuk ke Heroku dan buat aplikasi baru. Saya telah menamai aplikasi saya railtoheroku. Anda bisa menamainya sesuka Anda. Klik buat aplikasi untuk membuat aplikasi bernama.

Menghubungkan repositori Github ke Aplikasi Heroku:

Langkah selanjutnya adalah menautkan repositori Github Anda ke Heroku.

Di bawah ini kami telah menghubungkan railtoheroku repositori Github kami

Setelah kami menghubungkan repositori Github kami ke Heroku, kami siap untuk menerapkan aplikasi kami. Untuk menerapkan aplikasi, gulir ke bawah ke opsi penyebaran manual dan klik opsi penyebaran cabang.

Menerapkan Aplikasi:

Setelah Anda mengklik Deploy Branch, Heroku akan mulai menginstal permata dari Gemfile pada produksi:

Setelah semua permata dipasang dan aplikasi diterapkan, Anda akan melihat pesan ucapan selamat dari Heroku yang mengatakan, “Aplikasi Anda berhasil diterapkan.”

Untuk melihat aplikasi Anda diterapkan cukup klik pada tombol lihat dan Anda akan dapat melihat aplikasi Anda berhasil diterapkan.

Jika Anda menghadapi masalah saat mengikuti salah satu langkah di atas, silakan beri komentar di bawah. Semoga Anda menikmati posting ini.

Ada pertanyaan untuk kami? Harap sebutkan di bagian komentar dan kami akan menghubungi Anda kembali.

Posting terkait:

Mengurai file XML menggunakan SAX Parser