Narzędzia marketingoweMedia społecznościowe i marketing influencerów

CodePen: buduj, testuj, udostępniaj i odkrywaj HTML, CSS i JavaScript

Jednym z wyzwań związanych z systemem zarządzania treścią jest testowanie i tworzenie narzędzi skryptowych. Chociaż nie jest to wymagane w przypadku większości wydawców, jako publikacja technologiczna lubię okazjonalnie udostępniać działające skrypty, aby pomóc innym. Opowiadałem, jak używać JavaScript do sprawdzania siły hasła, jak sprawdzać składnię adresu e-mail za pomocą wyrażeń regularnych (Regex), a ostatnio dodałem ten kalkulator, aby przewidzieć wpływ recenzji online na sprzedaż. Mam nadzieję dodać do witryny dziesiątki narzędzi, ale WordPress nie sprzyja publikowaniu w ten sposób… to system treści, a nie system programistyczny.

Aby moje małe skrypty działały, lubię używać CodePen. CodePen to schludnie zorganizowane narzędzie z panelem HTML, panelem CSS, panelem JavaScript, konsolą i publikacją powstałego kodu. Każdy panel zawiera informacje, gdy najedziesz myszką na elementy, dzięki czemu zrozumiesz, co jest możliwe, a także kodowanie kolorami kodu HTML, CSS i JS, aby ułatwić Ci edycję i pisanie.

CodePen to środowisko rozwoju społecznego. W istocie umożliwia pisanie kodu w przeglądarce i oglądanie wyników podczas budowania. Przydatny i wyzwalający edytor kodu online dla programistów o dowolnych umiejętnościach, szczególnie ułatwiający naukę kodowania. CodePen koncentruje się głównie na językach frontonu, takich jak HTML, CSS, JavaScript i składniach przetwarzania wstępnego, które zamieniają się w te rzeczy.

O CodePen

Dzięki CodePen mogłem wykonać całą niezbędną pracę opublikuj kalkulator Osadziłem w witrynie. Większość dzieł na CodePen ma charakter publiczny i open source. Są to żywe istoty, z którymi inni ludzie i społeczność mogą wchodzić w interakcję, od prostego serca, przez pozostawienie komentarza, po rozwidlenie i zmianę na własne potrzeby.

CodePen - kalkulator do prognozowania wpływu recenzji online na sprzedaż

Dzięki CodePen możesz zmienić widok, jeśli chcesz, aby panele znajdowały się po lewej, prawej lub na dole podczas pracy… lub wyświetlić kod HTML w nowej karcie. Widok obok siebie działa niesamowicie dobrze, aby przetestować ustawienia responsywne, ponieważ możesz dostosować rozmiar widocznego okienka.

Możesz organizować swoje działające skrypty w Pióra, łączyć je w Projekty (edytor wieloplikowy), a nawet tworzyć kolekcje. Jest to działająca witryna z portfolio kodu front-end, w której możesz śledzić innych autorów, przekształcać inne publicznie udostępniane projekty w własne w celu modyfikacji, a nawet uczyć się, jak robić ciekawe rzeczy poprzez wyzwania.

Możesz zapisać go jako GitHub Gist, wyeksportować w formacie zamek błyskawiczny plik, a nawet osadzać pióro w artykule takim jak ten:

Zobacz pióro Przewidywany wpływ recenzji online na sprzedaż by Douglas Karr (@martech_strefa) na CodePen.

Jednym z ograniczeń edytora Pen jest ogromna ilość kodu. Być może nigdy nie spotkasz się z tym problemem, ponieważ edytor powinien sobie poradzić z setkami lub tysiącami linii kodu. Ale kiedy zaczną trafiać 5,000 10,000–XNUMX XNUMX lub więcej linii kodu, zobaczysz, że edytor zaczyna zawodzić. Możesz jednak dodać odniesienia zewnętrzne do arkuszy stylów lub kodu JavaScript hostowanego gdzie indziej!

Zachęcam do zapisania się. Będziesz subskrybować ich cotygodniowe e-maile i będziesz mógł dodać kanał do swojego kanału RSS, aby zobaczyć nowo opublikowane długopisy. A jeśli zaczniesz tam wyszukiwać lub przeglądać publiczne pióra, znajdziesz niesamowite projekty… użytkownicy są naprawdę utalentowani!

Obserwuj Douglas Karr na Codepen

Wersja płatna CodePen Pro oferuje mnóstwo dodatkowych funkcji poprawiających funkcjonalność lub zespoły – w tym współpracę, procesy, hosting zasobów, prywatne widoki, a nawet wdrażane projekty w Twojej domenie lub subdomenie. I oczywiście CodePen zapewnia świetne repozytorium z integracją z Githubem, w którym może pracować cały Twój zespół. Jeśli tak jak ja chcesz przetestować jakiś prosty kod, CodePen jest nieocenionym narzędziem.

Douglas Karr

Douglas Karr jest dyrektorem ds. marketingu OtwórzWglądy i założycielem Martech Zone. Douglas pomógł dziesiątkom odnoszących sukcesy start-upów MarTech, pomagał w due diligence ponad 5 miliardów dolarów w przejęciach i inwestycjach Martech i nadal pomaga firmom we wdrażaniu i automatyzacji ich strategii sprzedaży i marketingu. Douglas to uznany na całym świecie ekspert ds. transformacji cyfrowej oraz MarTech i mówca. Douglas jest także autorem przewodnika dla manekinów i książki o przywództwie biznesowym.
Powrót do góry przycisk
Zamknij

Wykryto Adblock

Martech Zone jest w stanie udostępnić Ci te treści bez żadnych kosztów, ponieważ zarabiamy na naszej witrynie poprzez przychody z reklam, linki partnerskie i sponsoring. Będziemy wdzięczni za usunięcie blokady reklam podczas przeglądania naszej witryny.