Jeden uparty kaleczy JavaScript, czyli Sobieski+ MileStone2

Cała ta sytuacja z mniej lub bardziej uzasadnioną paniką powoduje, że część ludzi szuka sobie zajęć, które pozwolą oderwać się od (smutnej) rzeczywistości - w moim wypadku jest to m.in. kodowanie.

Mniej więcej miesiąc temu pisałem o małym eksperymentalnym projekcie, jakim jest stworzenie własnego plikowego CMS.

Dzisiaj chciałbym krótko opisać, co udało się zrobić przez ten czas.

Dostępność wszystkich podstawowych funkcji przez www

Obecna wersja pozwala na:

1. stworzenie kont użytkownika (lokalnych albo pobierających hasło i stan logowania z konta Google)
2. odzyskanie/zmianę haseł przy kontach użytkownika
3. dodawanie i edycję tekstów (zawierają tytuł, treść, opcjonalną informację dla czytelnika i opcjonalne tagi, możliwość "przyklejenia" i publikacji na głównej stronie)
4. dodawanie komentarzy do tekstów
5. tworzenie chatów między użytkownikami (jeżeli ci akurat nie mają otwartej odpowiedniej strony, to dostaną odpowiednią informację w zakładce przeglądarki o tym, że przyszedł nowy wpis)

Można powiedzieć, że funkcjonalność jest "feature complete" do stworzenia prostego serwisu.

Tworzenie konta

Podajemy nick w serwisie i mail, do tego wybieramy rodzaj konta (czy będzie ono z lokalnym hasłem czy hasło ma pochodzić z konta Google).

W przypadku kont lokalnych generowany jest jeszcze link służący do weryfikacji adresu mail (użytkownik po jego otrzymaniu powinien go otworzyć i podać hasło do konta).

Hasła we wszystkich wypadkach są hashowane i solone (wiem, jak to brzmi w języku polskim - chodzi o to, że nie przesyłamy ich otwartym tekstem, a generujemy z nich hash, a czasem do generowania hasha używamy również losowego tekstu).

Jedynymi przesyłanymi otwartym tekstem danymi jest raz nick i adres email (przy czym serwer działa na https i nie jest to wielki problem).

Sesje

Serwer generuje unikalne identyfikatory sesji i tworzy na ich podstawie tymczasowe ciastka. Identyfikatory mają po stronie serwera określoną ważność - nowa wartość jest przesyłana do przeglądarki z użyciem SSE (Server-Sent Events).

Logowanie z użyciem konta Google odbywa się na oddzielnej podstronie (nie chcę dodawać bibliotek z tej firmy przy każdym wywołaniu) - jeżeli kod dostaje odpowiedź o poprawnej weryfikacji, to dokonuje "swojej" wewnętrznej weryfikacji i dalej posługuje się nią. Pozwala mi to na uproszczenie całości.

Przypomnienie hasła

Interfejs graficzny ma link "Zapomniane hasło" - podajemy tam nazwę konta i adres mailowy, w odpowiedzi otrzymujemy maila z linkiem, po otwarciu którego można zmienić hasło.

Uruchomienie

Po pobraniu Node.js należy doinstalować moduł nodemailer ("npm install nodemailer" poprzedzony ewentualnie dodaniem katalogu nodejs do ścieżki PATH, o ile robimy to pod Windows).

Potem (o ile chcemy korzystać z integracji z Google) potrzebujemy identyfikatora aplikacji - sposób jego generacji jest m.in. pokazany na stronie https://medium.com/@thomashellstrom/use-google-as-login-in-your-web-ap...

Kolejny krok to zmiana config.js i można już uruchomić całość komendą "nodejs index.js".

Pierwsze konto ma domyślnie uprawnienia administratora, zaś w celu wysyłania maili używam serwisu ethereal.email, która symuluje powyższą usługę (należy otworzyć link pokazywany w konsoli, żeby zobaczyć treść maila; jeżeli chcemy otrzymywać prawdziwe wiadomości, konieczne jest podanie własnych ustawień SMTP na górze w pliku index.js).

Kod

Obecnie index.js to około 75 kB, moduły wewnętrzne ok. 37 kB, a zewnętrzne ok. 376 kB.

Nie jest to już niestety ok. 25 kB z projektu Sobieski, za to całość jest napisania znacznie porządniej niż przy MileStone 1 - mamy podział na stosunkowo małe funkcje, lepsze zmienne, znacznie mniej błędów, itp.

Zdecydowałem się użyć SunEditor jako edytora tekstu - Quill nie wygląda na rozwijany od dosyć dawna, inne edytory albo wymagają "dziwnych" licencji albo nie mają zbyt wielu funkcji.

Obecną wersję na upartego (po skonfigurowaniu nodemailera) możnaby wystawić już na serwerze testowym.

Technologie

SSE (Server-Sent Events), Cookies, JavaScript, AJAX, CSS, HTML, Node.js, HTTP/2

Obecnie bawię się m.in. myślą obsługi powiadomień, czyli web-push (chodzi o to, żeby przeglądarka pytała się o włączenie powiadomień na stronie, a my żebyśmy mogli wybrać, co ma być pokazywane).

Ogólnie mówiąc - docelowo chciałbym stworzyć dosyć nowoczesną aplikację webową (gdzie np. wylogowanie użytkownika wyloguje go we wszystkich sesjach), a nie statyczny generator do strony WWW

I kilka uwag

Czy da się napisać dosyć porządnego CMSa w krótkim czasie z użyciem niewielu zasobów? TAK

Czy trzeba korzystać z pierdyliarda bibliotek? NIE (po stronie przeglądarki jest tylko SunEditor, biblioteka do SHA256 i opcjonalnie niezbędna biblioteka Google, po stronie Node.js jedynie nodemailer)

Błędy? Są kasowane z dnia na dzień.

Po co wyważać otwarte drzwi? Nie wszystko, co przychodzi z zagranicy, jest najlepsze. Warto samemu drążyć różne tematy i szukać lepszych rozwiązań.

Co dalej z projektem? Nie ma co się oszukiwać, że JavaScript jest bardzo dobrym językiem. Nie jest (znacznie bardziej wolałbym pisać chociażby w Delphi)... ale chyba udało mi się ominąć sporą część pułapek. Również Node.js ma swoje odchylenia (i stąd firmy typu Google myślą o Go czy innych rozwiązaniach)... ale nie zmienia to faktu, że już MileStone 2 jest niezupełnie najgorszą bazą do pisania większych aplikacji. C.D. najprawdopodobniej nastąpi.

Licencja? Wszystkie biblioteki są na MIT, mój kod skłonny jestem udostępnić na jednej z licencji OSS.

Dziękuję.

PS. W tytulu nawiązuję oczywiście do stwierdzenia "gry nie tworzyła armia juniorów kaleczących JavaScript"

PS2. Dziękuję za uwagi przy poprzednim wpisie - w kodzie pozostawiłem jedynie var na oznaczenie zmiennych i const na oznaczenie stałych (działa? działa. Na ... drążyć temat), komentarze mają limitowaną długość, konfiguracja jest (gdzie możliwe) wydzielona, itp. Na pewno pierwsze kamienie milowe nie są doskonałe (kod bywa długi, nie ma opisów, nie wszystkie warstwy middleware są wydzielone, itp.), ale nie taka ich rola. Dla mnie na tym etapie ważne jest, żeby mieć dobrą bazę, zdobyć doświadczenie, pobawić się z kodem, itp. Nie mam zamiaru uprawiać zbyt durnego marketingu i pisać "jakie to wspaniałe", ale kto wie - może z tego wyrośnie większy polski CMS?

PS3. Link do wcześniejszych artykułów o projekcie Sobieski i Sobieski+, kod na GitHub do projektu Sobieski+

PS4. Moja odpowiedź na pierwsze osiem komentarzy: https://www.dobreprogramy.pl/marcinw2/Hey-Joe-Potrzymaj-mi-piwo-dlacze...

PS5. (Maj 2020): Większość uwag merytorycznych z komentarzy zaadresowałem w kolejnym wpisie: https://www.dobreprogramy.pl/marcinw2/Raport-z-postepu-prac-czyli-Sobi...