Jak przyczynić się do Gutenberga jako programista WordPress

Spodoba ci się mniej więcej, ale Gutenberg, edytor bloków WordPress, jest tutaj, aby pozostać. Dobrą rzeczą jest to, że będąc open source, możesz je modyfikować według własnego uznania (jeśli wiesz jak).

Co więcej, jeśli znajdziesz w edytorze błąd, który Twoim zdaniem powinien zostać rozwiązany, możesz go zgłosić lub spróbować rozwiązać go samodzielnie i przesłać zmiany, abyśmy wszyscy z nich skorzystali. Dzięki temu przyczynisz się do ulepszenia projektu, a także swojej dobrej karmy .

Czy znasz kroki, które należy wykonać, aby przyczynić się do powstania kodu podstawowego Gutenberga? Prawdopodobnie twoja odpowiedź brzmi nie. To samo przydarzyło mi się i musiałem to zbadać. Wyjaśnię więc, jak postępować, aby ułatwić i przyspieszyć zrozumienie całego procesu, a następnie przyczynić się do ulepszenia Gutenberga (jeśli chcesz) za pomocą własnego kodu jako programista.

Jest wiele do zrobienia i ulepszenia, ale jest na wyciągnięcie ręki, aby pomóc rozwiązać problemy, które znajdziesz w edytorze bloków WordPress.

Kroki, które mogą przyczynić się do rozwoju Gutenberga

Zanim zacznę, założę, że masz minimalną wiedzę na temat Git i że masz konto GitHub. Jeśli tak nie jest, po prostu załóż jedno konto i zapoznaj się z tym samouczkiem, aby poznać podstawy.

Utwórz widelec Gutenberg

Pierwszą rzeczą, którą musisz wiedzieć, jest to, że kod źródłowy Gutenberga jest hostowany na GitHub w tym repozytorium kodu. Tam dokonuje się ewolucja projektu.

Tutaj masz kod Gutenberga jako wtyczkę WordPress. Z każdą nową wersją wtyczki, stabilna wersja bazy kodu jest przenoszona do kolejnej wersji rdzenia WordPressa. I to jest droga.

Aby wnieść swój kod do repozytorium Gutenberga, pierwszą rzeczą, którą musimy zrobić, jest utworzenie rozwidlenia na naszym koncie GitHub. Aby to zrobić, klikamy przycisk Widelec , który pojawia się w prawym górnym rogu, który można zobaczyć na poprzednim obrazku.

Spowoduje to utworzenie repozytorium na Twoim koncie GitHub z tymi samymi funkcjami i kodem, co oficjalne z WordPress. Ale ponieważ jest to konto, które kontrolujesz, będziesz mieć dostęp do modyfikowania kodu i robienia z nim, co chcesz. Zasadniczo masz kopię.

Sklonuj repozytorium

Teraz masz własne repozytorium Gutenberga połączone z oryginałem. Czas pobrać go na komputer i popracować nad nim. Aby to zrobić, otwórz terminal i wykonaj następujące polecenie:

 git clone https://github.com/your-user/gutenberg.git

Pamiętaj, aby zastąpić nazwę your-user nazwą użytkownika, której używasz w serwisie GitHub. Spowoduje to utworzenie folderu gutenberg na twoim komputerze, pobierając lokalnie całą zawartość twojego repozytorium GitHub.

Utwórz nowy oddział

Jeśli uzyskasz dostęp do nowego folderu, zobaczysz, że zawiera on wszystko, co pojawia się w głównej gałęzi repozytorium (lub głównej gałęzi). Nie należy dotykać tej gałęzi modyfikacjami, więc zanim przejdziemy do modyfikacji kodu Gutenberga, zobaczmy, jak utworzyć nową gałąź.

Jeśli nie wiesz, czym jest gałąź w Git, zachęcam do przeczytania tego artykułu. W każdym razie po to, co zamierzamy zrobić, wystarczy wiedzieć, że gałęzie w Git są sposobem na oddzielenie modyfikacji, które wprowadzamy w kodzie repozytorium, aby zachować określoną kolejność.

Jeśli chcę dodać nową funkcjonalność, stworzę nową gałąź, której nazwa identyfikuje to, co zamierzam zrobić, a następnie rozwinę tam funkcjonalność. Po zakończeniu i gdy cały mój zmodyfikowany kod będzie stabilny, mogę połączyć tę gałąź z gałęzią główną ( master , pamiętaj) i to wszystko.

Polecenia Git, aby utworzyć nową gałąź i przesłać ją do repozytorium, są następujące:

 git checkout -b fix/clone-block git push -u origin fix/clone-block

Spowoduje to utworzenie gałęzi fix/clone-block . Pamiętaj, aby zmienić nazwę zgodnie z tym, co zamierzasz zrobić. Zgodnie z przewodnikiem dla autorów Gutenberga, musisz użyć nazwy dla swojej gałęzi z przedrostkiem i opisem, na przykład: [type]/[change] .

Dobry prefiks to zazwyczaj:

• add/ dodaj nową funkcjonalność
• try/ eksperymentalną funkcjonalność, do celów testowych
• update/ zaktualizuj istniejącą funkcjonalność
• fix/ rozwiąż problem

Na przykład fix/clone-block wskazuje, że zamierzamy zaproponować poprawkę podczas klonowania bloków.

Zastosuj zmiany do Kodeksu

Teraz masz wszystko gotowe, aby otworzyć pliki w edytorze, który Ci się najbardziej podoba i rozpocząć programowanie. Ale zanim to zrobisz, powinieneś wiedzieć kilka rzeczy…

Po pierwsze, cały kod Gutenberga jest zgodny z konkretnym przewodnikiem stylu, który należy również szanować. Szczegółowe informacje dotyczące sposobu pisania kodu są opisane tutaj.

Istnieją zasady dotyczące CSS, JavaScript i PHP. Przestrzegaj tych zasad, w przeciwnym razie na pewno będziesz mieć problemy z zaakceptowaniem kodu w oficjalnym repozytorium.

FYI, w moim przypadku modyfikacja, którą wprowadziłem, polegała na użyciu funkcji lodash.cloneDeep() w atrybutach bloku podczas klonowania bloku za pomocą wp.blocks.cloneBlock() tak, aby kopia była wykonana dogłębnie, aby uniknąć konieczności płytka kopia sklonowanego przez nas bloku. Tutaj możesz zobaczyć zmiany, które wprowadziłem.

Prześlij zmiany do nowej gałęzi

Po zakończeniu musisz zatwierdzić zmiany i przesłać je do repozytorium. Jeśli utworzyłeś nowe pliki, musisz najpierw dodać je do kontroli wersji za pomocą następującego polecenia:

 git add your-file

A teraz nadszedł czas, aby zatwierdzić zmiany za pomocą tego polecenia:

 git commit -am "Use cloneDeep when cloning a block"

Na koniec, aby przesłać zmiany do repozytorium, musimy użyć następującego polecenia:

 git push

Następnie, jeśli przejdziesz do repozytorium w GitHub, zobaczysz swoje zmiany przesłane w gałęzi, którą utworzyłeś. Idealny! Prawie jesteśmy na miejscu…

Utwórz pull request w repozytorium Gutenberga

Wprowadziliśmy już zmiany i wgraliśmy je do naszego repozytorium. Teraz musimy ostrzec programistów odpowiedzialnych za zarządzanie projektem Gutenberg o istnieniu proponowanych przez nas zmian.

Aby nasze zmiany zostały omówione i zatwierdzone jako część (lub nie) bazy kodu Gutenberga, musimy wykonać żądanie ściągnięcia . Żądanie ściągnięcia to żądanie, które właściciel rozwidlenia repozytorium kieruje do właściciela oryginalnego repozytorium, aby ten drugi zawierał zatwierdzenia znajdujące się w rozwidleniu.

Aby to zrobić, przechodzimy do naszego repozytorium widełek Gutenberga i klikamy przycisk Nowe żądanie ściągnięcia . To prowadzi nas do widoku, w którym możemy wybrać gałąź, którą właśnie przesłaliśmy z naszymi zmianami. Dokona to porównania z główną gałęzią oryginalnego repozytorium Gutenberga:

Kiedy wybieramy naszą gałąź w rozwijanym selektorze po prawej stronie, jak widać na poprzednim obrazku, GitHub pokazuje nam podsumowanie zmian dokonanych w tej gałęzi w odniesieniu do oryginalnego repozytorium Gutenberga.

Następnie klikamy przycisk Utwórz żądanie ściągnięcia . To przeniesie nas do innego widoku, w którym będziemy musieli wypełnić tekst informacją opisową, dlaczego chcemy wprowadzić te zmiany w repozytorium.

Jak widać na poniższym obrazku, mamy już szablon treści, o wypełnienie którego jesteśmy proszeni:

Zasadniczo musisz dołączyć opis swoich zmian wyjaśniający, co zrobiłeś i swoje powody. Powinieneś również wskazać, czy przetestowałeś kod i jak to zrobiłeś. W razie potrzeby możesz nawet dodać zrzuty ekranu.

Nie martw się, jeśli nie wiesz zbyt dobrze, jak go wypełnić. Pomogą Ci osoby, które opiekują się repozytorium Gutenberga.

Kiedy skończysz, kliknij przycisk Utwórz żądanie ściągnięcia , aby Twoje żądanie ściągnięcia było ostatecznie publiczne. Teraz musisz tylko poczekać, aż inni recenzenci przyjrzą się i ostatecznie zatwierdzą i scalą Twój kod z oficjalnym repozytorium.

Pamiętaj, że ta wersja może zająć więcej lub mniej czasu w zależności od wielu czynników. W moim przypadku w końcu moje żądanie ściągnięcia zostało zamknięte i nie powiodło się. Ale podczas całego procesu wiele się nauczyłem. A komentarze recenzentów były zawsze pozytywne i konstruktywne. Możesz to zobaczyć tutaj. Ale pracowałem dalej i w końcu otrzymałem zgodę na ściągnięcie!

Jeśli uważasz, że w Gutenbergu jest coś, co musi się zmienić i nie możesz się doczekać zmiany tego w kodzie, teraz wiesz, jak wygląda ten proces. Poza tym wszystko, co tu wyjaśniłem, dotyczy nie tylko Gutenberga. Większość projektów oprogramowania open source działa identycznie (lub bardzo podobnie).

Nie wahaj się wnieść wkładu. Z pewnością wiele się przy tym nauczysz.

Polecane zdjęcie Mike'a Erskine'a w Unsplash .