jak zacząć swoją przygodę z javascript?
TRANSCRIPT
phone +48 696 185 029 mail [email protected] twitter @functionite
Jak zacząć swoją przygodę z JavaScript?
Chcesz dodać obrazek do strony?Używasz znacznika <img> z HTML, bodo tego go stworzono
Co należy umieć by zabrać się za JavaScript?
Chcesz dodać obrazek do strony?Używasz znacznika <img> z HTML, bodo tego go stworzono
HTML, CSS
Chcesz dodać obrazek do strony?Używasz znacznika <img> z HTML, bodo tego go stworzono
Umieć HTML i CSS nie znaczy
wiesz, no ogarniam, takie znaczki się pisze w dziubkach,każdy jest do czegoś innego
no HTML się pisze, a potem CSS i coś tam wychodzi
umiałbym/umiałabym to zrobić, ale mi się nie chce, no daj spokój, to łatwe
Chcesz dodać obrazek do strony?Używasz znacznika <img> z HTML, bodo tego go stworzono
Co znaczy umieć HTML i CSS?
Chcesz dodać obrazek do strony?Używasz znacznika <img> z HTML, bodo tego go stworzono
Umieć HTML i CSS znaczy potrafić przełożyć grafikę (projekt strony w JPG/PSD) na kod, by
wyglądał tak samo/podobnie uruchomiony przeglądarce
Chcesz dodać obrazek do strony?Używasz znacznika <img> z HTML, bodo tego go stworzono
Można umieć HTML i CSS lepiej lub gorzej
Chcesz dodać obrazek do strony?Używasz znacznika <img> z HTML, bodo tego go stworzono
Nauka to proces
5 latmiesiąc
ekspert HTML i CSS
początkujący w HTML i CSS
rok
Chcesz dodać obrazek do strony?Używasz znacznika <img> z HTML, bodo tego go stworzono5 latmiesiąc
ekspert HTML i CSS
początkujący w HTML i CSS
nauka kodowania
zbieranie doświadczeń
rok
Kiedy mogę wziąć się za JSa?
czas na JS!
5 latmiesiąc
ekspert HTML i CSS
początkujący w HTML i CSS
rok
Co znaczy, że nauka programowania to proces?
Nie można nauczyć się raz, a dobrze
Każdy nowy projekt niesie za sobą nowe wyzwania
Cierpliwość!
Praca! Nie nastawiaj się na natychmiastowe efekty i medale
Co jest największą przeszkodą w nauce JSa?
Lenistwo. Szybkie poddawanie się.
Dobry rok zajęło mi, by napisać licznik znaków
Jak się uczyłem?
Metodą prób i błędów
Podpatrywaniem, jak zrobili to inni
Pytaniem innych (na forach, grupach etc.)
Zajęło mi to długi czas.Wracałem co jakiś czas do kodu z nowymi pomysłami, aż
wyszło.
Programowanie to odtwarzanie schematów
To samo z HTMLem
Zrobisz raz nawigację na stronie, prawdopodobnie użyjesz czegoś podobnego w następnym projekcie
<nav> <h1>Menu</h1> <ul> <li><a href="home.html">Home</a></li> <li><a href="about.html">About</a></li> </ul></nav>
<nav> <h1>Produkty</h1> <ul> <li><a href="/books">Książki</a></li> <li><a href="/Komputery">Komputery</a></li> </ul></nav>
<nav> <h1>Produkty</h1> <p>Nasze produkty są najlepsze na świecie.</p> <ul> <li><a href="/books">Książki</a></li> <li><a href="/Komputery">Komputery</a></li> </ul></nav>
<nav> <h1>Menu</h1> <ul> <li><a href="home.html">Home</a></li> <li><a href="about.html">About</a></li> </ul></nav>
W jednym projekcie...
W innym...
Co z tym JavaScriptem?
Programowania (w tym JavaScript) uczysz się raz, kolejne języki i biblioteki to tylko Twoje narzędzia
Niech nie przeraża Cię liczba nowości każdego dnia.Tak było i będzie!
Dobrze jest wybrać sobie jedną rzecz, którą chce się zrobić i próbować ją zrobić
Chcesz dodać obrazek do strony?Używasz znacznika <img> z HTML, bodo tego go stworzono
Ciężko nauczyć się JSa tylko siedząc i myśląc
Nauka to własna inicjatywa, zadawanie pytań, próbowanie (czyli pisanie kodu aż wyjdzie)
Jak można sobie pomóc w procesie nauki?
Zatrudnij się w jakiejś firmie jako Junior Developer
Front-end: pierwsza praca w HTML5, CSS3 i JavaScript
Czego wymagają pracodawcy?
HTML, CSS
Co dalej?
Przykładowa oferta
Jak ją widzimy
Chcesz dodać obrazek do strony?Używasz znacznika <img> z HTML, bodo tego go stworzono
Kogo szukamy?Jeśli rozpoznajesz większość z poniższych zagadnień, spotkajmy się:- Umiejętność tworzenia semantycznie poprawnych dokumentów HTML- Obsługa programów graficznych Adobe (Photoshop / Illustrator)- Znajomość zagadnień RWD- Dobra znajomość technologii webowych (SASS/CSS, HTML5)- Znajomość frameworków (Boostrap, Foundation etc.)- Umiejętność pracy z Gitem- Znajomość dobrych praktyk kodowania (DRY, KISS)
Jak widzi ją pracodawca
Kogo szukamy?
Jeśli rozpoznajesz większość z poniższych zagadnień, spotkajmy się:- Umiejętność tworzenia semantycznie poprawnych dokumentów HTML
- Obsługa programów graficznych Adobe (Photoshop / Illustrator)
- Znajomość zagadnień RWD
- Dobra znajomość technologii webowych (SASS/CSS, HTML5)
- Znajomość frameworków (Boostrap, Foundation etc.)
- Umiejętność pracy z Gitem
- Znajomość dobrych praktyk kodowania (DRY, KISS)
Jeśli znacie CSSa, na pewno ogarniecie SASSa
Jeśli znacie CSSa, na pewno ogarniecie SASSai ktoś Wam w firmie w tym pomoże
A co, gdy wymagają doświadczenia?
Umiejętność adaptacji, poszukiwania odpowiedzi i swobodnego poruszania się po sieci
Co z tym JSem na Juniora?
Daj sobie 3 miesiące przed zgłoszeniem do firmy
Spróbuj zrobić jakąś prostą funkcjonalność
- licznik znaków w formularzu- walidacja formularza (sprawdzenie czy user coś wpisał)- kliknięcie danego elementu sprawi, że inny się pojawi (tzw. pokaż więcej)- rysowanie w <canvas>- odtwarzanie różnych filmików w tle strony- podmiana obrazka na stronie co 5 sekund- pokazanie okienka z dwoma przyciskami po kliknięciu
To może być:
Inspiracja jest wszędzie
Paradoksalnie... wyjrzyj za okno, przeczytaj nową książkę, dowiedz się czegoś nowego, poznaj nowych ludzi
Nie masz pomysłu? Zapytaj
Przyjdź na jakiś hackaton/warsztat
Zacznij eksperymentować, pisać, podpatrywać kod innych, naśladować
Nie bój się zadawać pytań, napisać maila do swojego autorytetu
Publikuj swoje przemyślenia, kod, udzielaj się na grupach dyskusyjnych i Twitterze
Chwal innych, doceniaj lepszych, nie bój się utrzymywać kontaktu!
Nie masz dużo czasu (rodzina, dzieci, obecna praca), daj sobie 6+ miesięcy
Po tym okresie roześlij CV
A co ze studiami?
Na ile muszę umieć JSa?
Uważaj na firmy, które Junior Developeromzlecają pracę dla zwykłego Developera
Jak zachować się na rozmowie?
Daj komuś znać, że interesuje Cię to, co robisz
Pochwal się tym, co zrobiłeś.Nawet o błahostkach opowiadaj jak o dużej rzeczy.
Czytaj blogi, Twittery, bądź na czasie, pochwal się, co czytasz
Miej pojęcie (choćby szczątkowe), co można zrobić przy pomocy technologii, których będziesz używać w pracy
Staraj się opowiedzieć o swoich projektach jak najwięcej, w tym o trudnościach i problemach nie do przeskoczenia
Rozmawiaj szczerze o pieniądzach. Pytaj.Nie czyń jednak tego tematu głównym Twojej rekrutacji.
To po prostu źle wygląda.
Dostałem/Dostałam się, co dalej?
Przyjdę do firmy i ktoś mnie po niej oprowadzi jak matka?I bedzie dopytywał jak się czuję i czego się chcę w danym momencie
nauczyć?
Dostałem zadanie, którego nigdy w życiu nie robiłem. Co robić?
Chcesz dodać obrazek do strony?Używasz znacznika <img> z HTML, bodo tego go stworzono
Pracodawca przede wszystkim wymaga profesjonalizmu
Profesjonalizm polega na otwartym umyśle
Potrzebujesz czegoś? Zapytaj. Jesteśmy tu, by Ci pomóc.
Dostałeś zadanie, ale nie wiesz co to system QWERTY123(tm)?Wygoogluj, popytaj w sieci, w ostateczności zapytaj szefa/kolegi.
Profesjonalizm polega też na umiejętności zaadoptowania się do warunków
Pytaj z wyczuciem. Jeśli ktoś jest zajęty, napisz maila.
Nie siedź jednak bezczynnie, jeśli zatrzymałeś się na jakimś problemie.
Podczas Twojego okresu próbnego najważniejsza będzie komunikacja
Ćwicz umiejętności miękkie
Produkt to efekt wspólnej pracy
“Ja swoje zrobiłem, nie odpowiadam za resztę”
blame culture
Dobra współpraca z członkami zespołu
Profesjonalizm to nie żartowanie z innych i słowna agresja
Profesjonalizm to nie przeklinanie w miejscu publicznym np. biurze
Profesjonalizm to nie bycie głośnym i narzucanie innym swojego podejścia do sprawy (w tym nadużywanie
stereotypów)
Profesjonalizm to poczucie odpowiedzialności
Jak widzi mnie grupa? Co zrobić, by środowisko, w którym działam stało się jeszcze bardziej przyjazne?
Dlaczego środowisko pracy ma być przyjazne?
Pomyśl, co czują inni. Czy Twoje zachowanie nie dominuje w grupie, czy ludzie łatwo mogą wnosić swoje pomysły w
grupie?
Profesjonalizm to też umiejętność przyznania się do błędu
I've missed more than 9000 shots in my career. I've lost almost 300 games. 26 times, I've been trusted to take the game winning shot and missed. I've failed over and over and over again in my life. And that is
why I succeed. M. Jordan
Profesjonalizm to dobra komunikacjaże nie dam rady
że mnie nie będzieże potrzebuję więcej czasu na to zadanie
Profesjonalizm to zadawanie pytań innym członkom zespołu
Profesjonalizm to unikanie subiektywnych założeńwydaje mi się, że ona wie o tym, więc nie pytam
Profesjonalizm to szacunek dla wyborów innychà la pff, w PHP to teraz nikt nie pisze, wstyd
Ceń się
A jak stać się lepszym koderem w firmie?
Rób code review z kimś bardziej doświadczonym
Skorzystaj z pair programmingu
Znajdź bardziej doświadczonego mentora
Nauka to proces
Od prostej rzeczy w czystym JS do jQuery
Od jQuery do większej aplikacji (np. Todo) w czystym JSie
Od prostej rzeczy w czystym JS do jQuery
Chcesz dodać obrazek do strony?Używasz znacznika <img> z HTML, bodo tego go stworzono
Od prostej aplikacji do frameworka MVC (np. Angular.js)
Od jQuery do większej aplikacji (np. Todo) w czystym JSie
Od prostej rzeczy w czystym JS do jQuery
A co z nauką frameworków?
Ofert jest dużo, a pracodawcy robią wszystko, by ściągnąć Cię do teamu. Podaje się m.in. widełki płacowe.
Wyjedź za granicę, poznaj inne kultury i podejścia
Wyjazd do pracy za granicę był dla mnie najbardziej rozwojowym wydarzeniem w życiu
Praca zdalna?
Praca w UK?
Jakie książki czytać?
Speaking JavaScript
CSS Secrets
Eloquent JavaScript
Eloquent JavaScript
Illustrated Guide toFront-End
Development
Illustrated Guide toFront-End
Development
Maintainable JavaScriptWriting Readable Code
Effective JavaScript
http://diveintohtml5.info/index.html
Inne?
http://uptodate.frontendrescue.org/