U ovom ćemo postu stvoriti osobnu web stranicu pomoću šina i rasporediti je na Heroku. Heroku je platforma za oblak - novi način izrade i primjene web aplikacija. Najbolja stvar kod Herokua je ta što ne morate plaćati za hosting osnovnih web aplikacija jer ih je Heroku kategorizirao kao besplatne. Izgradit ćemo aplikaciju tračnica za jednu stranicu i to će biti statično web mjesto koje se može koristiti kao portfelj.
Ispod je snimka aplikacije šina (postavljena na Heroku ovdje )
Krenimo s izradom ove Rails aplikacije. Pretpostavljam da ste već instalirali Ruby i Rails. Provjerite imate li Ruby 2.0 i Rails 4.2.2. Verziju možete provjeriti iz naredbenog retka.
Napomena: Koristit ćemo Ruby 2.0 i Rails 4.2.2. Ako imate neke različite verzije Ruby i Rails, neki od koraka prikazanih u ovom postu možda vam neće uspjeti.
Izrada projekta:
Naš projekt ćemo nazvati web stranicom. Za izradu projekta upotrijebite naredbu Rails new website
Rails će automatski generirati sve datoteke, a također će instalirati sve potrebne dragulje izvršavanjem automatski instaliranog pokretačkog paketa, kao što je prikazano u nastavku
koji su razlozi za stvaranje instance klase datoteke?
Sada ćete vidjeti mapu web mjesta pod vašim pogonom C: (mjesto odakle smo izvršili novu naredbu Rails nove web stranice). Otvorimo mapu web mjesta u nekom IDE-u. Imam zagrade IDE iz Adobea. Možete koristiti bilo koji drugi jer nije važno.
Struktura projekta:
Generirana struktura projekta izgledat će kao u nastavku
Iako još nismo napisali nijedan kôd, trenutno možete pokrenuti web stranicu. Da biste pokrenuli aplikaciju web mjesta, izvršite naredbu Rails s mape web stranice, kao što je prikazano dolje
Kao što možete vidjeti na gornjoj snimci na kojoj je postavljena naša web stranicahttp: // localhost: 3000
Moći ćete vidjeti zaslon u nastavku o pristupu URL-uhttp: // localhost: 3000
Ali želimo prikazati glavnu stranicu naše aplikacije o pristupu URL-uhttp: // localhost: 3000 /.Za to stvorimo stranicu index.html u javnoj mapi našeg web projekta.
Napomena: Rails će automatski poslužiti stranicu index.html pri pristupu korijenskom URL-uhttp: // localhost: 3000
Za sada imamo samo jedan redak na stranici index.html.
Pristupimo korijenskom URL-uhttp: // localhost: 3000
Stavimo sada malo života na našu index.html stranicu dodavanjem nekoliko slika - JS i cool CSS. Upotrijebit ćemo temu sive sive od početka pokretanja.
Pokreni temu pokretanja sive skale -
Ispod je snimka teme pokretanja početne trake sive skale koju ćemo koristiti. Ovu ćemo temu prilagoditi kako bi udovoljila našim zahtjevima.
Ovu temu možete preuzeti s http://startbootstrap.com/template-overviews/grayscale/
Preuzmite temu sivih tonova i kopirajte CSS, font-awesome, fontove, img, JS i index.html u javni direktorij projekta web stranice. Ispod je snimka projekta nakon dodavanja CSS-a, JS-a, fontova, mape slika i stranice index.html u javni direktorij projekta web stranice.
Pokrenimo sada projekt naše web stranice:
Tijekom izvođenja projekta predstavit će vam se stranica s temama sive boje koja izgleda lijepo.
Izmijenit ćemo stranicu index.html (u javnom imeniku projekta web stranice) kako bismo joj dali profesionalni izgled.
Ispod je snimak projekta web stranice nakon uvođenja promjena na stranici index.html. Upravo smo promijenili slike i uredili dio teksta kako bismo ga učinili specifičnim za pojedinca.
Možete izmijeniti index.html i greyscale.CSS kako želite. Sada smo spremni postaviti našu web stranicu na Heroku.
Guranje koda u Github:
Prije postavljanja aplikacije na Heroku, moramo gurnuti naš kôd u udaljeno spremište Github. Za to vam je potreban Github račun. Ako nemate Github račun, idite i stvorite ga na www.github.com .
Također morate instalirati Github na Windows. Preuzmite Github za prozore s https://windows.github.com/ .
Nakon što preuzmete i instalirate Github na svoj stroj, otvorite Github aplikaciju i konfigurirajte svoje vjerodajnice za Github te odaberite Git Bash ljusku kao zadanu ljusku (možete odabrati bilo koju drugu opciju, također po želji), a zatim spremite promjene.
Trebate stvoriti spremište na Githubu, gdje ćemo daljinski spremiti projekt naše web stranice. Da biste stvorili spremište, prijavite se na Github i kliknite novu opciju spremišta prikazanu zelenim gumbom.
Imenujte svoje spremište (u ovom slučaju mi smo ga nazvali railtoheroku) i kliknite vezu za stvaranje spremišta kao što je prikazano dolje.
Github će pružiti udaljeni URL ( https://github.com/eMahtab/railtoheroku.git u ovom slučaju) za spremište railtoheroku koje će biti potrebno tijekom guranja koda s lokalnog stroja na Github.
Sada smo spremni prebaciti kod projekta naše web stranice na Github. Slijedite korake u nastavku da gurnite kôd na Github.
Otvorite Git ljusku i upotrijebite naredbu Git init za inicijalizaciju direktorija web mjesta kao što je prikazano dolje:
Sada dodajte sve datoteke u direktorij web mjesta pod kontrolom verzija izvršavanjem Git add.
Zareži sve datoteke izvršavanjem Git commit –m „Final commit“
što je socket u javi
Dodajte udaljeno spremište kao što je prikazano dolje:
Sada posljednji korak koji će zapravo gurnuti kod u Github spremište:
Završili smo s Githubom. Sljedeći je dio stvarna implementacija aplikacije na Heroku.
Uvođenje aplikacije u Heroku:
Napravite Heroku račun na https://www.heroku.com/
Bilješka : Moramo uvesti neke promjene za postavljanje aplikacije na Heroku. Heroku ne podržava SqLite 3, već ima PostgreSQL bazu podataka. Dakle, moramo ukloniti ovisnost sqlite3 iz gemfile. Heroku zahtijeva dragulj rails_12factor, koji Heroku koristi za posluživanje statičkih elemenata kao što su slike i tabele stilova. Dvije promjene potrebne u Gemfileu sažete su u nastavku:
Uklonite liniju gem 'sqlite3' iz Gemfile
Sljedeće retke dodajte u Gemfile
grupa: razvoj,: test do #<<<< not in production gem 'sqlite3' end group :production do gem 'pg', '0.17.1' gem 'rails_12factor', '0.0.2' end
Provjerimo radi li sve u redu nakon unošenja promjena u Gemfile. Spremite Gemfile i pokrenite instalacija snopa s posebnom zastavicom (–bez proizvodnje) kako bi se spriječila lokalna instalacija bilo kakvih dragulja za proizvodnju.
Omogućimo promjene u Gemfileu u daljinsko spremište na Githubu:
Gurnite promjene u udaljeno spremište Github:
Izrada nove aplikacije na Heroku:
Prijavite se na Heroku i izradite novu aplikaciju. Nazvao sam svoju aplikaciju railtoheroku. Možete mu dati ime kako god želite. Kliknite na izradi aplikaciju da biste kreirali imenovanu aplikaciju.
Povezivanje spremišta Github s aplikacijom Heroku:
Sljedeći je korak povezivanje vašeg Github spremišta s Herokuom.
Ispod smo povezali naše Github spremište railtoheroku
Nakon što povežemo naše Github spremište s Herokuom, spremni smo za implementaciju naše aplikacije. Da biste rasporedili aplikaciju, pomaknite se do opcije ručnog postavljanja i kliknite opciju postavljanja grane.
Uvođenje aplikacije:
Jednom kada kliknete na Deploy Branch, Heroku će početi instalirati dragulje iz Gemfile u produkciju:
Nakon što se instaliraju svi dragulji i aplikacija se primijeni, vidjet ćete poruku čestitke od Herokua u kojoj se kaže: 'Vaša je aplikacija uspješno postavljena.'
Da biste vidjeli svoju postavljenu aplikaciju, samo kliknite gumb pogleda i moći ćete vidjeti svoju aplikaciju uspješno instaliranu.
Ako se suočite s bilo kojim problemom dok slijedite bilo koji od gore navedenih koraka, molimo komentirajte u nastavku. Nadam se da vam se svidio ovaj post.
Imate pitanje za nas? Molimo spomenite to u odjeljku za komentare i javit ćemo vam se.
Vezane objave:
Raščlanjivanje XML datoteka pomoću SAX Parsera