Świeże zasoby dla projektantów stron internetowych i programistów (marzec 2017)
Z CLI (Command Line Interface) jesteśmy w stanie usprawnić i zautomatyzować przepływy pracy nad tworzeniem stron internetowych. I dlatego w tej części zawarliśmy wiele niesamowitych CLI, które można zainstalować na lokalnym komputerze lub uruchomić niektóre rzeczy na serwerze. Do tego jeszcze kilka Narzędzia PHP, dodatki do przeglądarek i biblioteki JavaScript. Sprawdźmy je.
Kliknij, aby uzyskać więcej zasobówKliknij, aby uzyskać więcej zasobów
Znajdź całą naszą kolekcję zalecanych zasobów oraz najlepsze dostępne narzędzia do projektowania i tworzenia stron internetowych.
Guetzli
Nowy koder z Google pozwala skompresować obraz nawet o 35% od początkowego rozmiaru przy zachowaniu jakości. To dość przełom, biorąc pod uwagę, że podobne kodery open source, takie jak JPEGOptim i jpegtran są ograniczone do zaledwie 20% przy średniej. Widzę, że będzie wiele aplikacji i wtyczek dla platformy CMS integrujących Guetzli w celu optymalizacji plików JPEG.

Mapa drogowa programisty
Jak sama nazwa wskazuje, Roadmap dla programistów to infografika podróży bycia Web Developer. Istnieją trzy kursy Front-end, Back-end i DevOps. Te mapy drogowe są jak, cóż, mapa; i są doskonałym punktem odniesienia gdzie jesteśmy obecnie, co mogliśmy przegapić i dokąd zmierzamy.

Netlify CMS
SmashingMagazine ostatnio zrobił śmiały ruch do wykreślenia WordPressa i spróbuj czegoś nowego całkowicie za pomocą nowego CMS o nazwie Netlify CMS. Jest to nowy CMS zbudowany na bazie React.js i może być zintegrowany z dowolnym generatorem statycznym, takim jak Jekyll, Hugo i MiddleMan.

BadSSL
To jest strona internetowa, aby sprawdzić konfigurację SSL. BadSSL to przydatne narzędzie do przeprowadzania debugowania i błędów podczas instalacji SSL w Twojej witrynie.

Alix
Alix to Rozszerzenie Chrome, które umożliwia kontrolę dostępności witryny. Po zainstalowaniu i włączeniu wtyczka doda pole nakładki do wielu elementów na stronie które stanowią ostrzeżenie lub błędy.

AR.js
AR.js to Biblioteki JavaScript w przeciwieństwie do innych. Ta biblioteka umożliwia nam tworzenie rzeczywistości rozszerzonej przy użyciu technologii sieci Web i zaskakująco szybko działa na telefonach komórkowych.

React Trend
To jest reaguj na komponent z Unsplash, aby stworzyć piękny wykres liniowy, typowy dla pokazywania trendów. Komponent jest konfigurowalny; można ustawić grubość linii, kolor, gradienty i gładkość krzywej. Możesz po prostu użyć GUI do wygodnie wygeneruj kod komponentu.

Gitee
ZA Aplikacja macOS do monitorowania aktywności Github bezpośrednio z pulpitu, Gitee dodaje nowy element na pasku stanu, pokazujący liczby gwiazd, obserwujących i powiadomień. Ponadto możesz również przeglądaj wykresy swojego wypychania i zatwierdzania w repozytorium, a także w repozytorium trendów w bieżącym miesiącu i tygodniu. Jest to Github na pulpicie w pigułce.

Goops
Goops to wygodny interfejs CLI, który analizuje katalog projektu i określ katalogi i pliki, które chcesz dodać .gitignore
. CLI można zainstalować za pomocą NPM. Po zainstalowaniu wpisz kozły
i zrobione.

Debuguj CSS
DebugCSS to Narzędzie do wprowadzania CSS, które pozwala analizować i weryfikować dane wyjściowe CSS w przeglądarce. Działa całkiem podobnie do Alix, gdy ładujesz arkusz stylów debugCSS lub używasz bookmarklet podświetla elementy na stronie, które powodują błędy lub ostrzeżenia.

EagleJS
EagleJS to Biblioteka JavaScript do tworzenia prezentacji podobny do RevealJS. EagleJS różni się pod pewnymi względami; jest zbudowany przy użyciu Vue.js, struktury JavaScript MVC i używa Pug jako system szablonów do budowy slajdu.

BootstrapTour
ZA Biblioteka JavaScript do tworzenia podręcznych podręczników przy użyciu komponentu Bootstrap. Podręczniki podręczne zwykle pojawiają się dla nowego użytkownika, aby przejść przez interfejs aplikacji, nowe funkcje i wyświetlać wskazówki. Jest to doskonała biblioteka, jeśli Twoja strona jest również zbudowana z Bootstrap.

Cegła
Cegła jest biblioteka JavaScript zaprojektowana do budowania interfejsu użytkownika aplikacji internetowej. Wśród dołączonych komponentów znajdziesz takie popularne, jak Kalendarz, Menu i Formularz „storage-indexeddb” komponent, na który możesz przechowuj dane po stronie klienta za pomocą IndexedDB.

OctoTree
OctoTree to ładne narzędzie, które umożliwia przeglądanie kodów źródłowych i plików w Github ze strukturą drzewa jak w IDE lub edytorach kodu. Jest dostępny jako dodatek do Chrome, Safari, Firefox i Opera i jest dostępny w ich oficjalnym repozytorium dodatków. Octotree obsługuje repozytorium Private i Enterprise Github.

Powiadomienie Github
Kolejne przydatne rozszerzenie Github dla Chrome. Po zainstalowaniu będziesz mógł otrzymywać powiadomienia, nawet jeśli obecnie nie jesteś na stronach Github. Świetna wtyczka, jeśli chcesz pozostać w pętli ze swoimi repozytoriami.

Deployer
Deployer to narzędzie do wdrażania witryn PHP. Współpracuje z wieloma popularnymi platformami i platformami, w tym WordPress, Drupal, Magento, Laravel i CodeIgniter. Za pomocą tego narzędzia możesz tworzyć własne przepisy, kawałek polecenia do uruchomienia podczas wdrażania. To przychodzi Wycofywanie funkcja umożliwiająca powrót do poprzedniej wersji w przypadku awarii.

PHPStan
CLI, który skanuje pliki PHP w celu znalezienia błędów bez uruchamiania środowiska wykonawczego. Oznacza to, że nie potrzebujesz pełnego środowiska PHP do debugowania plików PHP w swoim projekcie.

Kocioł NGINX
Zbiór typowych konfiguracji Nginx, które obejmują buforowanie Backend, limit szybkości połączeń i żądań oraz kilka innych najlepszych praktyk w celu przyspieszenia działania witryny i dostrojenia jej do ruchu.

Szampan
Bubbly to świetna linia poleceń, którą możesz zainstalować na swoim serwerze, aby generować, zarządzać i odnawiać certyfikat za pomocą Let's Encrypt. Dopise SSL jest teraz o wiele łatwiejszy.

Siatka waflowa
Jeszcze inna struktura siatki CSS zbudowana z Flexboksa, o której myślę, że powinieneś się przyjrzeć.
