sobota, 18 marca 2017

Wyszperane w Internecie cz. 3

Cześć,
w kolejnym poście z cyklu Wyszperane w Internecie opowiem Wam o jednym z modułów, który pomógł mi zrobić jedną rzecz w Postownii, która na pierwszy rzut oka wydaje się prosta i banalna do stworzenia, ale taka nie jest.

Tym modułem jest ejs.js.

ejs.js <% Embedded JavaScript %> służy do generowania szablonu HTML na poziomie serwera przy wykorzystaniu Javascriptu. Pomiędzy znaczniki <% %> wpisujemy kod Javascriptu, którego działanie jest wyświetlone na naszej stronie. Jest to bardzo przydatne, gdy musimy wyświetlić spersonalizowaną treść.

Jednym z przykładów podanych na stronach twórców tutaj i tutaj jest wyświetlenie w punktach zawartości Javascriptowej listy. Tak więc jak to robimy?

W header przesyłamy tą listę wraz z nazwą zmiennej, po jakiej będziemy się do niej odwoływać, a w szablonie HTML piszemy w znacznikach podanych wyżej kod Javascriptu, który nam to wyświetli. Należy również pamiętać o tym, że plik z szablonem HTML i kodem ejs nie może mieć rozszerzenia .html, ale .ejs. Jeśli o tym zapomnimy, to wyświetli nam się błąd.
Drugą ważną rzeczą do zapamiętania korzystając z ejs.js jest funkcja wysyłająca szablon HTML do klienta. Gdy wysyłamy stronę z rozszerzeniem .ejs używamy funkcji render, gdzie pierwszy argument to szablon strony, a drugi to zmienne przesyłane do header. (drugi argument jest opcjonalny)

A do czego ja wykorzystałem ten moduł?
Tak jak wspomniałem wcześniej, do rzeczy wydającej się prosta i oczywista. Jednak taka nie była.
Za pomocą ejs.js chciałem wyświetlić nick użytkownika przy jego poście, który dopiero co dodał.

Jak to robię?
Przy logowaniu się użytkownika do Postownii przesyłam jego nick używając ejs.js i umieszczam go w input type hidden. Dzięki temu zabiegowi przy dodaniu nowego postu przez użytkownika sczytuję jego nick i mogę dodać nowy post do pliku JSON z nick'iem właściwego autora i wyświetlić na stronie post z nazwą autora.

Mam nadzieję, że ten krótki opis pomoże Wam wykorzystać moduł ejs.js we własnych projektach. W razie pytań zadawajcie je w komentarzach.

Damian

Brak komentarzy:

Prześlij komentarz