JSFiddle na problemy z JavaScriptem, Angularem, TypeScriptem

Posted on Updated on

https://jsfiddle.net (i także wiele podobnych tooli/serwisów) jest edytorem w przeglądarce który pozwala odpalić nasz kod napisany w JavaScripcie. Takich tooli jest o wiele więcej dla różnych języków itp, ja skupie się na tym jednym i go opiszę, może są nawet lepsze alternatywy – nie wiem, widzę jednak, że jest najbardziej popularny na StackOverflow.

Składa się z 3 okienek gdzie wpisujemy nasz kod (html, JavaScript, css) oraz czwartego (output) w którym się uruchomi nasz kod:
jsfiddle example panes

Obecnie pozwala wybrać z kilku języków: JavaScript, CoffeeScript, JavaScript 1.7, Babel, TypeScript. Do tego kilkadziesiąt frameworków JS, z tego te bardziej popularne w kilku wersjach, np Angular jest w 4, a jQuery w ok. 20. To jest tylko takie ułatwienie, a nie ograniczenie. Dowolną bibliotekę można też dociągnąć tak jak includujemy każdy nowy scrypt w markupie html.

Debugowanie

Przyda się gdy coś “nie działa”

Najpierw samemu trzeba wyczerpać możliwości, bo często problem leży gdzieś u nas i widząć czysty kod, który działa w JSFiddle mamy pewność że to podejście działa tylko u nas czegoś jeszcze brakuje (gryzą sie zależności, czegoś brakuje, itp, itd). Jeśli już uruchomiliśmy w JSFiddle i nie działa tak jak powinno to wtedy mamy gotowy materiał na pytanie na StackOverflow. Nie możemy oczekiwać że obcy ludzie będą nam pomagać jeśli najpierw sami sobie nie pomogliśmy. Jeśli wrzucimy linka z kodem do uruchomienia na JSFiddle to każdy może na własne oczy zobaczyć co jest grane. I na przykład odpowiedzieć nam poprawioną wersją kodu.

Historia zmian

Nasz kod możemy wersjonować lub forkować, nawet bez zalogowania się.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s