Wszystko, co musisz wiedzieć, aby zostać programistą front-end

Wszystko, co musisz wiedzieć, aby zostać programistą front-end!

Jeśli chcesz nauczyć się kodować, mając na celu bycie programistą front-end, jest wiele rzeczy, które musisz wiedzieć, aby odnieść sukces i znaleźć pracę. Powinieneś zacząć od opanowania podstaw tworzenia stron internetowych, a następnie poszerzyć swoje umiejętności o dodatkowe narzędzia i zasoby, z których korzysta większość programistów internetowych.

Jeśli przeprowadziłeś badania i masz pewność, że programowanie front-end jest dla Ciebie właściwą drogą, sprawdź te narzędzia, które również musisz opanować. Znajomość tych narzędzi i zasobów nie tylko pomoże Ci w procesie tworzenia stron internetowych, ale także pomoże Ci wybić konkurencję z wody podczas ubiegania się o pracę.

Wreszcie, jeśli nie masz 100% pewności, czy nauka kodowania jest czymś, czego chcesz spróbować, oto 10 powodów, dla których powinieneś nauczyć się kodować.

Co robi Front-End Developer

Najpierw musisz dokładnie wiedzieć, kim jest programista front-end. Ogólnie rzecz biorąc, tworzenie stron internetowych składa się z trzech rodzajów zadań:

1. Programista front-end. Ta osoba (zwana również programistą front-end lub inżynierem front-end) jest programistą internetowym, który pracuje z front-endem stron internetowych i aplikacji internetowych, który obejmuje wszystko, co jest widziane i używane przez użytkownika w przeglądarce strony internetowej. Programiści front-end są zazwyczaj skupieni na projektowaniu.
2. Programista Back-End. Ta osoba jest odpowiedzialna za zaplecze lub po stronie serwera witryn internetowych i aplikacji internetowych. Zaplecze to miejsce, w którym wszystkie dane są przetwarzane i aktualizowane. Deweloperzy zaplecza są zazwyczaj myślicielami logicznymi.
3. Programista Full-Stack. Ta osoba jest specjalnym ninja, który ma umiejętności zarówno na przednim, jak i tylnym końcu. Jeśli lubisz pracować z „ładnymi rzeczami”, jak również z „super technicznymi”, ta praca może być dla Ciebie…

Również dawno temu w odległej galaktyce… był taki tytuł znany jako Web Designer. Projektant stron internetowych tak naprawdę nie musiał w ogóle zajmować się nauką kodowania i był skupiony wyłącznie na aspektach projektowania stron internetowych.

W dzisiejszych czasach, ponieważ strony internetowe i aplikacje internetowe stały się znacznie bardziej funkcjonalne i interaktywne, rynek pracy wymaga usług osób, które potrafią zarówno projektować, jak i kodować.

Wciąż są dostępne prace dla projektantów stron internetowych, ale większość projektantów stron internetowych próbuje nauczyć się kodować, aby uzyskać lepsze możliwości, zarobki i bezpieczeństwo pracy. Pod wieloma względami praca programisty front-end może być postrzegana jako projektant stron internetowych, który biegle włada językiem programowania, prawdopodobnie JavaScript.

HTML to szkielet stron internetowych, CSS to skóra, a JavaScript to mózg.

Opanuj podstawy

Absolutnie musisz dobrze znać trzy podstawowe technologie używane w tworzeniu stron internetowych, są to:

• HTML: to pierwszy podstawowy element konstrukcyjny wszystkich stron internetowych, nadający strukturę stronom internetowym. HTML jest językiem kodowania, ale nie jest pełnoprawnym językiem programowania, a raczej językiem znaczników. Języki znaczników umożliwiają „oznaczanie” tekstu w celu przetwarzania.
• CSS: to drugi podstawowy element konstrukcyjny wszystkich stron internetowych, odpowiedzialny za wygląd i zachowanie stron internetowych. CSS również nie jest językiem programowania.
• JavaScript: to trzeci element konstrukcyjny i pierwszy rzeczywisty język programowania, którego uczy się większość programistów internetowych. JavaScript działa w przeglądarce komputera i pozwala na funkcjonalność strony internetowej.

Jeśli wyobrazisz sobie trzy elementy składowe tworzenia stron internetowych w sposób, w jaki wyobrażasz sobie osobę, możesz pomyśleć o tym w ten sposób: HTML to kość i szkielet stron internetowych, CSS zapewnia skórę, a JavaScript to mózg.

Możesz już teraz spróbować nauki kodowania, biorąc udział w szybkim kursie HTML prowadzonym przez Brada Traversy'ego, który jest WHIZ-em w nauczaniu technologii tworzenia stron internetowych:

Podstawowe narzędzia do projektowania witryn internetowych

• Edytor tekstu: piszemy kod za pomocą edytora tekstu i musisz wybrać jeden i dobrze zapoznać się ze wszystkimi jego możliwościami. Niektóre z popularnych obecnie edytorów tekstu to: Atom, Sublime Text, Brackets, Visual Studio Code i stary dobry MS Notepad i Mac Text Edit.
• Narzędzia dla programistów przeglądarek: Google Chrome i Mozilla Firefox są wyposażone w wewnętrzne narzędzia programistyczne, które umożliwiają przeglądanie i manipulowanie kodem dowolnej witryny w przeglądarce.
• Te narzędzia są oczywiście dobre do debugowania… jesteś jedyną osobą, która może zobaczyć zmiany, które wprowadzasz w witrynie za pomocą narzędzi programistycznych, ponieważ manipulujesz witryną tylko tak, jak jest wyświetlana w Twojej przeglądarce.
• Systemy kontroli wersji: Systemy kontroli wersji umożliwiają zarządzanie zmianami w projektach internetowych. Pozwala to na powrót do różnych wersji projektu bez ingerencji we wdrożony projekt, dopóki nie udoskonalisz tego, nad którym pracujesz. W użyciu jest kilka systemów kontroli wersji, ale zdecydowanie dominującym jest Git.
• Linia poleceń (terminal): do profesjonalnego tworzenia stron internetowych wymagana jest dokładna znajomość wiersza poleceń. Wiersz poleceń wygląda przerażająco, ale ułatwia przesyłanie nowych pakietów oprogramowania, a także bardzo ułatwia nawigację po plikach i folderach. Możesz nauczyć się opanować wiersz poleceń w jeden dzień.

Podstawowe technologie wspomagające tworzenie sieci Web

• Preprocesor CSS: ta technologia sprawia, że ​​pisanie i utrzymywanie CSS jest dziecinnie proste. Jak dotąd najpopularniejszym preprocesorem CSS jest SASS i można się go nauczyć w jeden dzień
• Struktury CSS: Jeśli chodzi o tworzenie złożonych zadań CSS, które są mniej czasochłonne, struktura CSS, którą musisz znać, to Twitter Bootstrap.
• CSS Flexbox i CSS Grid: są to oba układy CSS w modelu sieciowym, które znacznie pomagają w tworzeniu responsywnych stron internetowych.
• Narzędzia do grupowania: Webpack i Browserify z Gulp służą do szybszego ładowania strony do przeglądarki. Te narzędzia służą do zmniejszania lub odchudzania treści w celu szybszego ładowania.
• Biblioteki i struktury JavaScript: biblioteki i frameworki umożliwiają szybkie, łatwiejsze i wydajniejsze dodawanie interakcji JavaScript do stron internetowych. Pomagają także uprościć bardziej złożone aspekty JavaScript. Niektóre z popularnych bibliotek i frameworków to: JQuery, React i Angular.

Jak widać, trzeba się wiele nauczyć, aby zostać programistą front-end. Dobra wiadomość jest taka, że ​​WSZYSTKICH tych narzędzi, zasobów i technologii można się nauczyć za darmo. Już widać, że w samym YouTube jest mnóstwo darmowych zasobów…

Jeśli potrzebujesz bardziej wszechstronnej nauki, wszystkich tych narzędzi można się nauczyć prawie za darmo, korzystając z zasobów szkoleniowych online, takich jak Team Treehouse. Dostępne są również pojedyncze kursy, takie jak The Complete Front-End Development lub Modern React na Udemy.