Stwórz stronę internetową z Sinatra

Sposób użycia Synatra ponieważ framework jest bardzo szeroki, może być używany do budowania narzędzi i usług, które wykorzystują HTTP Jednak jako warstwa transportu danych nie jest to jedyne, co możemy osiągnąć, są chwile, kiedy musimy być w stanie zbudować strony internetowe, na których możemy wyświetlać informacje lub po prostu przechwytywać dane.
Takie tworzenie stron internetowych jest jednocześnie bardzo proste i złożone, ponieważ Synatra Nie narzuca nam żadnych wzorców przy ich budowaniu, więc poziom skomplikowania będzie zależał od sposobu, w jaki pracujemy, co może być bardzo pozytywne, jeśli mamy już ustalony własny sposób pracy.
1- Aby uruchomić przykłady z tego samouczka, będziemy potrzebować instalacji języka Rubin przynajmniej w jego wersja 1.9 dalej.
2-Musimy też mieć zainstalowany klejnot Synatra i czy jest prawidłowo skonfigurowany. Jeśli istnieją jakiekolwiek wątpliwości dotyczące tego procesu, możemy zapoznać się z poniższym samouczkiem.
3- Musimy mieć uprawnienia do folderu do wykonania Rubin, tworzyć i manipulować plikami.
4- Musimy mieć edytor tekstu, aby móc pisać treść przykładów, może to być dowolny typ zwykłego edytora tekstu, który pozwala nam zapisać plik .rb jak Sublime Text czy nawet NotePad ++.
5- Wreszcie potrzebujemy przeglądarki internetowej, takiej jak Google Chrome lub Firefox gdzie możemy uruchomić nasz przykład i nawigować po nim.
Aby stworzyć stronę internetową w pierwszej kolejności musimy mieć wizję, cel, coś, co nas kieruje i co możemy wykorzystać jako punkt odniesienia podczas rozwoju, to generalnie osiągamy, gdy wiemy, co przyniesie nasz projekt.
W przypadku strony, którą zbudujemy, celem będzie stworzenie trzech stron, wymienimy je:

• Początek
• O mnie
• Kontakt

To prowadzi nas do tego, że będzie to strona referencyjna lub blog osobisty, w ten sposób będziemy musieli opanować pewne techniki, które w przyszłości będziemy mogli zastosować w innych projektach. Abyśmy mogli szybciej zobaczyć nasze postępy, będziemy iterować i poprawiać po drodze podczas tworzenia naszej strony internetowej.
Aby rozpocząć musimy stworzyć plik o nazwie start.rb, to będzie ten, który będzie zawierał całą logikę wyświetleń i tras naszej witryny, początkowa treść, którą ma to:

 wymagaj 'sinatra' pobierz '/' wykonaj erb: początek koniec

W zasadzie trochę brakuje tego, co właśnie napisaliśmy, ale zobaczmy, jaka jest funkcjonalność; w pierwszej kolejności uwzględniamy Synatra z instrukcją wymagaćOznacza to, że możemy teraz mieć wszystkie narzędzia, które udostępnia nam ten framework.
Następnie mamy blok dostwać w którym definiujemy, że treść musi być wykonywana w ścieżce głównej, wspomniana treść to wywołujący erb do :początek, gdzie w tym ostatnim musimy zatrzymać się, aby zobaczyć, co jest ERB i dlaczego go używamy, zobaczmy:
Język szablonu ERBJak sugeruje tytuł ERB to nic innego jak skrót od Wbudowany rubin o Embedded Ruby, pozwala nam tworzyć szablony HTML gdzie możemy dołączyć kod napisany w języku Rubin i dzięki temu, aby móc uwzględnić jego moc przetwarzania w widokach. Nazywamy je po imieniu za pomocą symboli, które są niczym innym jak nazwą poprzedzoną dwukropkiem, jak widzieliśmy w kodzie :początek.
Ponieważ mamy jasność co do nowej koncepcji, którą wprowadzamy, teraz stworzymy nasz pierwszy szablon w tym samym pliku start.rb które tworzymy, dołączymy na końcu następujący kod:

 __END__ @@ home Moja własna strona internetowa

Początek
O mnie
Kontakt

Witam na mojej stronie, tutaj wykażę się znajomością Rubiego i Sinatry

Tutaj mamy kilka rzeczy, które możemy przeanalizować, najpierw zaczynamy od opowiedzenia Synatra że to koniec przetwarzania Rubin, do tego używamy __KONIEC__ potem z podwójnym @@ Wskazujemy nazwę sekcji, w tym przypadku start, jeśli spojrzymy na nią to ta sama nazwa naszego symbolu.
W końcu napisaliśmy wszystkie nasze HTML bez problemu. Następnie przechodzimy do konsoli, umieszczamy się w folderze, w którym tworzymy nasz plik start.rb i wykonujemy następujące czynności:

 ruby start.rb

Możemy zbudować serwer deweloperski z Synatra i zobaczymy, co następuje, gdy pójdziemy do Lokalny Gospodarz: 4567 lub numer portu, który podnieśliśmy dla naszego serwera:

Jak zauważyliśmy, mamy HTML które budujemy w ścieżce root, z której wskazujemy naszej aplikacji Synatra.
Jedną z rzeczy, których zawsze musimy unikać, jest powtarzanie tego, co możemy zrobić tylko raz, a to działa na kilka rzeczy, w przypadku naszej strony HTML baza jest czymś, co możemy stworzyć tylko raz, jeśli postępujemy zgodnie z poprzednim przykładem, aby zbudować sekcje O mnie Tak Kontakt, musielibyśmy powtórzyć cały kod HTML zmieniając tylko część zawartości, coś, co pozostawiłoby nam długi, bardzo długi plik start.rb.
Aby przeciwdziałać tego typu nieefektywnemu zachowaniu, Synatra pozwala nam na wykorzystanie layoutu, dzięki temu możemy stworzyć bazę, w której po prostu wydrukujemy zmiany lub kod dynamiczny, który wygenerujemy.
Aby rozpocząć kształtowanie naszego układu, w pierwszej kolejności zmodyfikujemy nasz plik start.rb i dodamy jeszcze kilka tras:

 wymagaj 'sinatra' pobierz '/' wykonaj erb: początek koniec pobierz '/ włącz' wykonaj erb: na koniec pobierz '/ kontakt' wykonaj erb: kontakt koniec

Teraz mamy trasy, o których wspominamy w menu HTML które zbudowaliśmy wcześniej, to już dopiero początek Synatra wiesz, na co zwracać uwagę, gdy wywołujemy te trasy, następnym krokiem jest zdefiniowanie naszego układu i treści, które będą wyświetlane po wywołaniu każdej trasy.
W tym celu musimy najpierw stworzyć szablon i utożsamić go z nazwą @@ układ, a następnie korzystając z Wbudowany rubin z etykietami zdefiniujemy pojedynczy tytuł, a z etykietami wydrukujemy treść tam, gdzie jest to wymagane. W miejscu, w którym zmienia się nasza treść umieścimy to narzędzie, które pozwala nam wskazać, aby Synatra który znajduje się w tym miejscu, w którym powinien wydrukować zawartość trasy.
Na koniec definiujemy każdą z naszych tras i zawartość, którą będą nosić, zgodnie z logiczną kolejnością @@trasa a potem treść, już z nią Synatra wie, co pokazać na każdym telefonie. Zobaczmy jak wygląda kompletny kod naszego pliku start.rb w tym układ:

 wymagaj 'sinatra' pobierz '/' wykonaj erb: początek koniec pobierz '/ włącz' wykonaj erb: na koniec pobierz '/ kontakt' wykonaj erb: kontakt koniec __END__ @@ layout

Początek
O mnie
Kontakt

@@początek
Witam na mojej stronie, tutaj wykażę się znajomością Rubiego i Sinatry

@@o
Witam jestem twórcą tego Sieć, wykorzystałem swoje umiejętności, aby Ruby i Sinatra działały
@@Kontakt
Jeśli chcesz dowiedzieć się o mnie więcej, możesz odwiedzić Solvetic

Jak widzimy, napisaliśmy tylko jeden HTML a reszta treści jest bardziej podsumowana, a więc znacznie łatwiejsza w zarządzaniu i łatwiejsza w utrzymaniu, zobaczmy, jak wygląda w naszej przeglądarce, gdy od początku nawigujemy na inną trasę:

POWIĘKSZAĆ

Stworzyliśmy już małą, ale funkcjonalną stronę internetową, na której mamy kilka linków i mamy dynamiczną treść, wykorzystując jedynie layout do budowania swojej struktury, oczywiście wciąż brakuje nam stylów CSS i obrazy, ale to jest tematem innego samouczka. Oczywiście ten styl nie jest zbyt przydatny, jeśli zamierzamy mieć połączenia z bazami danych lub funkcjonalnościami z wieloma widokami, ponieważ wtedy nasz jedyny plik zacząłby być bardzo skomplikowany w obsłudze i utrzymaniu.
Na tym zakończyliśmy ten samouczek, stworzyliśmy naszą pierwszą stronę internetową za pomocą Rubin Tak Synatra, wykorzystujemy to, że możemy zastosować dowolną metodologię, która wydaje się odpowiednia i zrobiliśmy tak zwaną aplikację jednoplikową, ten typ aplikacji jest przydatny, gdy mamy bardzo proste projekty i nie chcemy, aby były niepotrzebnie rozproszone , takich jak sieć wynikająca z przykładu.Podobał Ci się i pomógł ten samouczek?Możesz nagrodzić autora, naciskając ten przycisk, aby dać mu pozytywny punkt