Jak stworzyć Strony Statyczne w aplikacji Ruby on Rails
Przez: Lukasz Muzyka, Z dnia:
Dobrze, stworzyliśmy naszą pierwszą aplikację w Ruby on Rails. Problem jest taki, że ona tylko pokazuje domyślną stronę automatycznie wygenerowaną przez Rails. To nie jest użyteczne. Chcemy żeby nasza aplikacja dostarczała jakąś treść, która będzie istotna dla użytkowników naszej aplikacji.
Pierwszym krokiem w budowaniu funkcjonalności w naszej aplikacji będzie wyświetlanie użytkownikowi statycznych stron, na przykład strony domowej lub kontaktowej. Oczywiście, "statycznych" nie znaczy, że strony te nie będą posiadały fajnych rzeczy.
Krok 1: Stwórz kontroler
Zaczniemy od stworzenia "Kontrolera". Jest on jednym z trzech głównych typów plików, których w międzyczasie bedziemy używać. Pozostałe dwa to "Model" i "Widok". Wszystkie trzy wzięły się z architektury MVC (Model, Widok, Kontroler), która jest używana do organizacji kodu aplikacji. Każdy element MVC odgrywa inną rolę i z czasem nauczymy się jak wykorzystywać ich umiejętności.
Dalej, użyjmy generatora Rails. W terminalu przejdź do folderu aplikacji.
bash
$ cd Documents/projects #depending where you put your application
Jako przypomnienie: użyj $ ls
by zobaczyć zawartość folderu, w którym obecnie się znajdujesz. Jeśli jesteś już wewnątrz folderu aplikacji możemy stworzyć nowy kontroler:
$ rails generate controller static_pages
Ta komenda stworzy kilka plików:
create app/controllers/static_pages_controller.rb
invoke erb
create app/views/static_pages
invoke test_unit
create test/controllers/static_pages_controller_test.rb
invoke helper
create app/helpers/static_pages_helper.rb
invoke test_unit
create test/helpers/static_pages_helper_test.rb
invoke assets
invoke coffee
create app/assets/javascripts/static_pages.js.coffee
invoke scss
create app/assets/stylesheets/static_pages.css.scss
- app/controllers/static_pages_controller.rb - dokładnie ten kontroler
- app/views/static_pages - tutaj będziemy przechowywać szablony HTML kontrolera
- test/controllers/static_pages_controller_test.rb - plik testowy kontrolera
- app/helpers/static_pages_helper.rb - plik asystent
- test/helpers/static_pages_helper_test.rb - plik testowy asystenta
- app/assets/javascripts/static_pages.js.coffee - plik skryptowy coffee
- app/assets/stylesheets/static_pages.css.scss - plik CSS
W tym tutorialu bedziemy używać kontrolera i foldera widoków. Naszym celem nie jest robienie właściwego TDD (Test Driven Development). Jeżeli jesteś zainteresowany pisaniem testów Rspec, bardzo polecam stronę z Michael Hartl's tutorialem.
Krok 2: Modyfikuj Strony Statyczne
Spójrzmy na kontroler:
app/controllers/static_pages_controller.rb
class StaticPagesController < ApplicationController
end
Obecnie jest on pusty. Widzisz dwie linijki, które zostały automatycznie stworzone przez generator. Pomiędzy linią otwirającą i wyrazem "end" będziemy umieszczać nasz nowy kod. Stwórzmy teraz naszą pierwszą "akcję" dla strony domowej:
class StaticPagesController < ApplicationController
def home
end
end
Krok 3: Stwórz plik domowy
We have defined a custom action and called it "home." The Rails framework is smart enough and will try to send to the user an HTML template that matches name of the controller action, so we need to create one. Inside the folder app/views/static_pages
create a new file and call it home.html.erb
Zdefiniowaliśmy własną akcję i nazwaliśmy ją "home". Framework Rails jest na tyle mądry, że będzie próbował wysłać szablon HTML o takej samej nazwie do użytkownika, więc taki stwórzmy. Wewnątrz folderu app/views/static_pages
stwórz nowy plik i nazwij go home.html.erb
.
app/views/static_pages/home.html.erb
<h1>This is the home page</h1>
Krok 4: Stwórz ruter
Prawie skończyliśmy. Wszystko co jeszcze pozostało to powiedzenie aplikacji pod jakim adresem akcja powinna być osiągnięta. Musimy stworzyć "ruter". Wszystkie są określone w folderze config
:
config/routes.rb
Rails.application.routes.draw do
# The priority is based upon order of creation: first created -> highest priority.
# See how all your routes lay out with "rake routes".
# You can have the root of your site routed with "root"
# root 'welcome#index'
# Example of regular route:
# get 'products/:id' => 'catalog#view'
# Example of named route that can be invoked with purchase_url(id: product.id)
# get 'products/:id/purchase' => 'catalog#purchase', as: :purchase
# Example resource route (maps HTTP verbs to controller actions automatically):
# resources :products
# Example resource route with options:
# resources :products do
# member do
# get 'short'
# post 'toggle'
# end
#
# collection do
# get 'sold'
# end
# end
# Example resource route with sub-resources:
# resources :products do
# resources :comments, :sales
# resource :seller
# end
# Example resource route with more complex sub-resources:
# resources :products do
# resources :comments
# resources :sales do
# get 'recent', on: :collection
# end
# end
# Example resource route with concerns:
# concern :toggleable do
# post 'toggle'
# end
# resources :posts, concerns: :toggleable
# resources :photos, concerns: :toggleable
# Example resource route within a namespace:
# namespace :admin do
# # Directs /admin/products/* to Admin::ProductsController
# # (app/controllers/admin/products_controller.rb)
# resources :products
# end
end
Wszystkie linie zaczynające się od #
są ignorowane przez aplikację.
Polecam Ci przeczytać wykomentowane linijki. Ostatecznie bedziemy większoci używać. Jednakże jak na razie, zdefiniujmy "root" naszej aplikacji. To będzie strona "lądowania" naszej aplikacji. Ta, którą ludzie zobaczą jak wejdą na źródło strony, czyli kiedy adres będzie zawierał tylko podstawowy adres, n.p.: www.peoplecancode.com.
By tego dokonać, usuńmy komentarz (poprzez usunięcie symbolu #
) z linijki z "root" i zmieńmy ją tak, żeby kierowała do właśnie stworzonych kontrolera i akcji:
root 'static_pages#home'
To może być czytane jak: Kiedy użytkownik wpisał adres strony zabierz go do kontrolera "static_pages" i jego akcji "home".
Krok 5: Odpal serwer Rails
Możesz teraz zapisać wszystkie utworzone przez nas pliki i, jeżeli nie masz włączonego serwera, odpalić go. Wreszcie wpisz w terminalu:
bash
$ rails server
Otwórz przeglądarkę i przejdź do adresu: localhost:3000
.
Powinieneś teraz widzieć "This is the home page".
Komentarze
Dodaj komentarz
Możesz się zalogować by skomentować
Z dnia: Frank napisał:
Z dnia: Marius napisał:
i like it . easy.
Z dnia: richard.Garcia napisał:
+1
Z dnia: agorneo napisał:
Great work Thank you very much for all this amazing work in your website I am grateful to you :)