Sails.js – konfiguracja bazy danych SQL.

W ostatnim wpisie pokazałem jak zainstalować framework sails.js i jak stworzyć nowy projekt. Dziś kontynuuję temat konfiguracji środowiska sails. Do aplikacji zbudowanej w sailsach dodam API komunikujące się z tabelą w bazie danych SQL.

Zazwyczaj do w projektach aplikacji webowych potrzebna jest jakaś forma przechowywania danych. W tym wpisie pokażę jak dzięki prostym mechanizmom sails możemy szybko połączyć tworzoną apkę z relacyjną bazą danych SQL. Zapraszam do lektury.

Sails js konfiguracja bazy danych SQL

Aby móc osiągnąć postawiony wyżej cel potrzebne będą dwie rzeczy. Pierwsza z nich to środowisko SQL, do którego można by odwołać się przez aplikację sailsową a druga to Postman, program pozwalający symulować wywołania do Api.

O ile ta druga rzecz jest dość łatwa do pobrania i zainstalowania, o tyle bazę danych SQL skonfigurować trochę ciężej, szczególnie, że potrzebujemy jeszcze udostępnić ja na serwerze. Na szczęście można tu pójść na skróty. Wystarczy zainstalować XAMPP‚a. Ma on w sobie wszystko co potrzebne i jeszcze kilka dodatkowych rzeczy. Jedną z takich jest phpMyAdmin, który też bardzo się przyda.

Dla tych, którzy nie zajmowali się wcześniej tego typu technologiami opiszę dokładnie jak korzystając z powyższych narzędzi skonfigurować bazę danych. Jest to wiedza, którą naprawdę warto posiadać w dzisiejszych czasach 🙂 .

Idąc najmniejszą linią oporu, najpierw pobieram tę wersję XAMPPa, która jest kompatybilna z używanym systemem. Gdy to już gotowe to instaluję i uruchamiam program. Po odpaleniu widoczne jest małe okienko z kontrolkami. Włączm moduły Apache (serwer) oraz SQL (bazy danych), klikając na przyciski start. Kontrolka zapalona na zielono oznacza, że moduł jest gotowy do pracy:

xampp

I już, środowisko gotowe 🙂 Teraz trzeba stworzyć odpowiednią bazę danych. W tym celu użyję phpMyAdmina, chociaż sposobów jest wiele )Jeżeli masz swój ulubiony, który dobrze znasz to śmiało korzystaj z niego 🙂 ). Jeśli serwer apache uruchomił się jak należy phpMyAdmin dostępny będzie po wpisaniu w przeglądarkę następującego adresu: http://127.0.0.1/phpmyadmin/.

Tak wygląda uruchomiona apka:

phpmyadmin

Kolejny krok to utworzenie odpowiedniej bazy danych. Aby to zrobić klikam w opcję New po lewej stronie (Na obrazku zaznaczona na czerwono). Wpisuję nazwę bazy – „sailsapi” a w rubryce Collation wybieram opcję utf8mb4_unicode_ci (Jest to domyślne kodowanie znaków w bazie).

Po potwierdzeniu wyboru phpMyAdmin przenosi mnie prosto do widoku tworzenia pierwszej tabeli. Wpisuję nazwę „Users” a liczbę kolumn ustawiam na 5. Oto jak uzupełniam dane kolumn:

sails js SQL columns

Pierwsza kolumna to id, która przechowywać będzie klucz dla każdego rzędu. Jej wartość zainkrementuje się za każdym razem gdy powstanie nowy rekord w tabeli. Dwie ostatnie kolumny przechowywać będą dane o tym kiedy powstał dany rekord i kiedy był ostatnio edytowany. Są to pola wymagane przez stworzone przez sails API. Nic dziwnego, są bardzo przydatne i warto je posiadać.

Dwa pola, którymi będę manipulował bezpośrednio to user oraz name. Czyli pseudonim użytkownika i jego prawdziwe imię. Zresztą tutaj akurat treść nie ma najmniejszego znaczenia 😉 .

Po zapisaniu konfiguracji kolumn baza danych jest już prawie gotowa. Została jeszcze jedna rzecz do zrobienia. Muszę poustawiać dodatkowe opcję na kolumnie id. W kolejnym widoku, przy id klikam na index oraz unique, za każdym razem zatwierdzając:

sails js SQL unique fields

Na koniec klikam na opcję change i zaznaczam checkbox A_I, czyli auto increment – automatyczna inkrementacja. I voila, baza danych SQL gotowa. Teraz mogę w końcu przejść do mojej aplikacji Sails.

Tworzę nowy projekt, tak jak opisałem to w poprzednim poście i nazywam go sailsSQL. Oto odpowiednia komenda:

Projekt wygenerowany, ale zanim zabiorę się za konfigurację API, muszę zainstalować dodatkowy moduł – sails-mysql. Jak łatwo się domyślić, służy on do obsługi SQLa przez sailsy. W folderze z projektem wywołuję taką komendę:

Teraz mogę wygenerować odpowiednie API. Robię to tak samo jak w poprzednim wpisie. Komenda zazwyczaj wygląda podobnie, niezależnie od tego, z jaką bazą będzie łączyło się generowane API. Nazwę ustawiam taką samą jak tablicę SQLową czyli „Users”, to ważne aby te dwie nazwy się pokrywały. Komenda, która wykonuje to zadanie wygląda tak:

I tak naprawdę to wszystko co potrzebujemy zrobić aby ustawić środowisko. Teraz pozostało już tylko skonfigurowanie sailsowej aplikacji tak aby wiedziała z jaką bazą ma się połączyć. W końcu przechodzę do starego dobrego JavaScriptu.

Folder projektowy zawiera całą masę plików i katalogów. Nie będę póki co opisywał znaczenia każdego z nich. Zajmę się tymi, które będą przydatne dziś:

Najpierw przechodzę do katalogu config. Jak łatwo się domyślić znajdujące się tu pliki zawierają konfigurację projektu. Wiele z nich zaraz po zainstalowaniu zawiera sporo zakomentowanego tekstu. Są to instrukcje do konfiguracji. Mają też przykłady, więc warto się z nimi zapoznać.

Ja szukam plików connections.js oraz models.js.

Najpierw otwieram connections.js i wpisuje w nim taką oto treść:

Pierwsza i ostatnia linijka będzie już istniała w wygenerowanym pliku. Obiekt znajdujący się domyślnie w środku konfiguruje mockowanie baz danych, które prezentowałem w poprzednim wpisie. Nie jest już potrzebny, zastępuję go obiektem mysqlAdapter.

Pierwsze pole mojego obiektu wskazuje na moduł z którego ma korzystać połączenie API. Pola host, user oraz password są dość oczywiste. Ja zostawiam tu domyślne wartości potrzebne do połączenia z lokalnym serwerem. W prawdziwym środowisku wyglądałoby to inaczej. Użytkownik root z pustym hasłem to domyślna konfiguracja baz SQL. Można to zmienić w phpMyAdmin, ale dziś nie muszę tego robić.

Ostatnie pole to oczywiście nazwa bazy danych, w której API ma szukać odpowiedniej tabeli.

Teraz kiedy konfiguracja połączenia jest gotowa, muszę wskazać aplikacji, żeby z niej korzystała. Mogę to zrobić w pliku models.js znajdującym się w tym samym katalogu – config.

Otwieram models.js, usuwam domyślną treść i wpisuję to:

Jak widać nic skomplikowanego. Jest tu eksportowany jeden obiekt models, który posiada dwa pola: connection oraz migrate.

Pierwsze pole to po prostu wskaźnik na odpowiedni obiekt konfiguracyjny z modułu connections. Oczywiście wybieram zdefiniowany przed chwilą mysqlAdapter. Jeżeli chodzi o migrate, wartość safe powoduje, że aplikacja nie będzie sama usuwać lub dodawać tabel, dla mnie w tej chwili ma to mniejsze znaczenie.

Konfiguracja API już prawie gotowa. Mogę już połączyć się z bazą danych używając go, ale nie mógłbym korzystać z pełnej funkcjonalności. A to dlatego, że muszę jeszcze ustawić sam model API.

Odnajdę go w katalogu api, który z kolei zawiera kolejne katalogi: controllers, models, policies, responses oraz services. To w nich znajdują się mechanizmy generowanych przez sails API (i które można rozbudowywać na właśną rękę). Każde API ma swój plik w odpowiednim katalogu.

Mnie póki co interesuje tylko katalog models. Tak jak się spodziewałem, w środku znajduje się plik Users.js. Jest to moduł który eksportuje obiekt attributes. Domyślnie jest on pusty, ja dodam do niego następującą treść:

Wewnątrz attributes definiuję pole dla każdej kolumny w tabeli SQLowej. Ponieważ trzy z pięciu kolumn w mojej tabli są obsługiwane domyślnie (id, createdAt oraz updatedAt), wystarczy, że dopiszę tylko dwa. Ich wartości to kolejne obiekty, które definiują czy dane pole jest wymagane i jakiego typu wartość przechowuje.

I API do bazy danych SQL gotowe! Inna sprawa jak je wykorzystać ale o tym napiszę w kolejnym poście. Teraz pozostało tylko sprawdzić czy wszystko działa jak należy.

W tym celu najpierw odpalam moją aplikację (komenda sails lift), a następnie otwieram Postmana, w którym definiuję żądanie POST na moje API:

sails-js-postman-request

Wewnątrz body, wybieram opcję raw a rodzaj danych ustawiam na JSON. Następnie definiuje JSONa z danymi, które chcę przekazać do bazy. Klucze to nazwy kolumn a wartości to wartości, które chcę przekazać do rekordu. Nie definiować id, createdAt oraz updatedAt, API samo się tym zajmuje. Klikam „SEND” i gotowe baza danych zaktualizowana. Dla pewności potwierdzam to w phpMyAdmin, klikając na moją tabelę:

phpmyadminsuccess

Sukces! Baza danych zaktualizowana. API działa.

Tak naprawdę stworzenie go zajęło dosłownie kilka chwil. Sails póki co sprawdza się świetnie.

Kolejnym krokiem będzie zbudowanie aplikacji, która w przeglądarce może dodawać, usuwać, aktualizować i wyświetlać dane z tabeli.

Póki co to jednak wszystko na dziś. Jeśli chcesz być na bieżąco z postami na blogu zachęcam do polubienia mojej strony na facebooku. Zawsze zamieszczam tam informacje o wszystkich nowościach. Jest to też dobre miejsce na kontakt ze mną. Na wszystkie pytania zawsze odpowiem :).

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *