Frontend - początki

2016-02-18 01:58
Świetny Kot
0

Dobry wieczór wszystkim,
Zaczynam dopiero swoja przygodę z programowaniem web. Na studiach przerabiałem jakiś tam c++ ale to byly podstawy.
Chcialbym w jakiej kolejności uczyć sie tego wszystkiego ? Co musze znac by myśleć o szansie na staż, pierwsza pracę w frontend ?
Na tą chwile jestem w trakcie przerabiania HTML i CSS, ale co dalej od razu przeskakiwać na JS > jQuery (a moze cos zupelnie innego ?) czy uczyć sie bootstrapa czy czegoś w ten deseń. Proszę o jakies porady wskazówki. Z gory dziekuje :)

Oczywiście nie chce być po tygodniu programista i szukać pracy :)

Pozostało 580 znaków

2016-02-18 08:52
1

Na początek: HTML + CSS, następnie JavaScript, później dołóż do tego jQuery, na koniec stwórz sobie jakiś szablon z użyciem Bootstrapa, żeby też się go nauczyć. To jest tylko początek. Żeby liczyć się na rynku pracy musisz dorzucić znajomość, któregoś z frameworków frontendowych. Dwa najpopularniejsze obecnie do Angular (ale ciężko mi powiedzieć czy warto się uczyć jeszcze 1 czy już iść w 2) oraz React. Ten drugi zdobywa ostatnio bardzo dużą popularność. Bardzo dobre opinie ma również vue.js, ale jest zdecydowanie rzadziej używany i ciężko znaleźć ofertę pracy, która wymaga jego znajomości.

To znajomości frameworków i języków musisz dorzucić znajomość narzędzi.
1) Narzędzia graficzne: tu króluje Photoshop, ale na Makach Sketch. Ja polecam również rzucić okiem na Avocode (ale to już dla własnej wygody)
2) Narzędzia budowania i kompilowania: Browserify, Gulp, Grunt, Webpack, Brunch - generalnie Webpack szturmem przejmuje rynek, więc idź w niego, ale cała reszta też jest znana i używana. Naucz się jednego, a przejście na jakikolwiek inny będzie łatwe.

Myślę, że jak opanujesz taki zestaw (nie musisz być mistrzem, ważne żebyś się orientował o co chodzi): HTML, CSS, JS (+ jQuery), React/Angular, Webpack - to spokojnie możesz iść do pracy na stanowisko juniora. Staże omijaj, to bez sensu :)

Pokaż pozostałe 8 komentarzy
jQuery po prostu wygląda tak, jak powinno wyglądać natywne API przeglądarkowe. Nie traktowałbym tego jak frameworka, a po prostu jak cukier składniowy, wrappery na brzydkie jak noc API przeglądarkowe (document.getElementById('foo').addEventListener('click', handler, false) vs $("#foo").click(handler) ;) ) - LukeJL 2016-03-02 11:03
Już rozumiem z wyjątkiem paru rzeczy. Co to wrapper? (mniej więcej się domyślam ale chciałbym żeby ktoś to napisał. Prosiłem też o opinie na temat Polymer.js :) - shimizu 2016-03-02 20:36
@shimizu, wrapper to po polsku może być "owijka" ;) Czyli zestaw np. klasy i/lub funkcji, które są bardziej generyczne, łatwiejsze w użyciu, a pod spodem korzystają tak naprawdę z funkcji niższego poziomu, które są trudniejsze w użyciu i rozumieniu. Taki np. jQuery to w rzeczywistości wrapper na JavaScript. Zamiast pisać "document.getElementById("intro")" piszesz "$.('#intro')" - łatwiej, szybciej, czytelniej, mniej do pamiętania. Typowa owijka, która robi dokładnie ot samo. Niestety Polymera nie używałem i mało o nim słyszałem, ciężko mi coś o nim napisać. - Thyliamris 2016-03-03 08:48
niestety nie wszystkie "owijki' są tak przyjazne. Mogą być owijki, które niewiele robią (zby mały poziom abstrakcji, np. kiedyś uczyłem się pisania w MFC w C++ i byłem strasznie zawiedziony, bo niby miała być jakaś abstrakcja, a czułem się jakbym pisał w prawie surowym i nieprzyjaznym WinAPI), a mogą być owijki, które robią zbyt wiele/ukrywają zbyt wiele/mają zbyt wielki poziom abstrakcji - wtedy też jest źle, bo taki wrapper staje się strasznie nieelastyczny, nieprzejrzysty i trudny w nauce. Wtedy łatwiej robić coś na czystym interfejsie niż z wrapperem. - LukeJL 2016-03-03 10:00
Dziękuje :) - shimizu 2016-03-04 17:58

Pozostało 580 znaków

2016-02-18 08:56
0

HTML + CSS + JavaScript to nierozłączny pakiet. Posługując się efektywnie tymi trzema(a szczególnie tym ostatnim) można budować layouts'y. Przykładowo bootstrap to framework bazujący na tych trzech i podobnie jak każdy inny wymaga pewnej wiedzy z ich zakresu. Proponuję zrobić kilka layoutów na czystym html/css/js, a potem sięgnąć po "usprawniacze".

"na ostatnim", tj. layouty na JavaScripcie? Tak, można tak, ale na większości stron layouty będą w HTML/CSS a JavaScript będzie tylko glue language do zmieniania przedefiniowanych wcześniej klas/styli w CSS. Bootstrap też raczej bazuje bardziej na HTML/CSS niż na JS. - LukeJL 2016-02-18 09:20
nawet jak ktoś pisze np. w React, to mimo że pisze layouty bezpośrednio w JS, to i tak się tłumaczy na elementy HTML/CSS :) - LukeJL 2016-02-18 09:23
w sensie jak dla mnie layouty = głównie HTML/CSS. JavaScript bardziej do logiki i jako glue language :) więc jak ktoś chce robić layouty to moim zdaniem może olać JS na początku. - LukeJL 2016-02-18 09:24
można i w samym HTML - lukashid 2016-02-18 09:29

Pozostało 580 znaków

2016-02-18 10:10
2

Chcialbym w jakiej kolejności uczyć sie tego wszystkiego ?
np. tak:

    1. HTML/CSS
    1. Bootstrap (gdyż jest to taka nakładka na HTML/CSS)
    1. podstawy JavaScript + jQuery, na tyle, żeby dodać zdarzenie onClick czy zmienić coś na stronie

na tym etapie możesz już robić proste stronki.

    1. wzmocnienie wiedzy z CSS, np. Sass, responsywny design, metodyki (BEM, OOCSS etc. na czym polegają),
      jest to o tyle ważne, że w firmach się pracuje na projektach z dziesiątkami plików *.css i trzeba się w tym orientować jakoś
    1. ogarnięcie mocniejsze JavaScriptu w wersji ES5
    1. jakiś popularny framework (ja polecam Reacta, ale wiele osób poleca Angulara), warto na tym etapie wdrożyć się w ES6

przy czym punkt 4. niekoniecznie musi być przed 5 i 6. Zaawansowany CSS jest ważny, ale na którym etapie się tego nauczysz, to już względne. Zresztą dużo mozna się nauczyć w pracy (choćby Sass, po prostu czytasz dokumentację i po kilku dniach znasz)

Przy okazji. Przykra sprawa. Building. Nie wiem na którym etapie będziesz to potrzebował, ale na którymś zaczniesz.

  • a. ogarnięcie podstaw środowiska NodeJS (będzie ci potrzebne do dalszych kroków), na tyle zebys wiedzial co to są callbacki/asynchronicznosc i do czego sluzy funkcja require albo komenda npm install

  • b. Gulp, Browserify/Webpack/Babel (żeby skompilować zasoby i zbudować bundla), stawianie serwera developerskiego (np. poprzez komendę: python -m SimpleHTTPServer, chyba prościej nie można)

Także nauczyć się musisz gita, ale to akurat jest bardzo przyjemne i przydaje się zawsze, ułatwia kontrolę nad procesem tworzenia i róznymi wersjami jednego projektu.

No i paradoksalnie nie warto się uczyć dla samej nauki. Trzeba robić projekty, nawet bezsensowne (np. własną ToDoList), ale ważne, żeby pamiętać że nauka robienia projektów jest ważniejsza od znajomości technologii (technologie są tylko narzędziami. Opanowanie perfect obsługi śrubokręta nie sprawi, że staniesz się elektrykiem). Nie trzeba również się kurczowo trzymać tego, co jest poszukiwane na rynku, warto iść drogą pasji.


((0b10*0b11*(0b10**0b101-0b10)**0b10+0b110)**0b10+(100-1)**0b10+0x10-1).toString(0b10**0b101+0b100);
edytowany 4x, ostatnio: LukeJL, 2016-02-18 10:17
Dzięki :) - Desu 2016-02-18 11:32
@LukeJL mam jedno pytanie, to normalne, że przy ledwie 3 zależnościach npm install pobrało mi ponad 700 folderów? oO - Desu 2016-02-27 09:35
Niestety normalne, bo te główne 3 zależności mają swoje podzależności itp. Chociaż to co można zrobić to: 1. wyłączyć pasek postępu z npm: https://twitter.com/gavinjoyce/status/691773956144119808 żeby instalowało szybciej 2. druga rzecz, ważniejsza - pomyśleć nad zmniejszaniem builda (niestety z tym sam mam problem... :/ ) - LukeJL 2016-02-27 11:59
Dobrze wiedzieć, bo zrobiłem npm install i się mocno zdziwiłem jak zobaczyłem ile tam tego nawaliło :/ - Desu 2016-02-27 12:01

Pozostało 580 znaków

2016-02-18 11:07
1

i podstawowa kwestia, gdzie mieszkasz, bo jeśli w małym mieście to na wejście musisz mieć w planach przeprowadzkę, inaczej umęczysz się nauką rok, dwa, a dostaniesz propozycje na poziomie kasjera z biedrony czy hostessy


Pozostało 580 znaków

2016-02-18 11:27
Świetny Kot
0

Dziękuje wszystkim za odpowiedź i nakierowanie co i jak robić.
Dodatkowo chciałbym zapytać jeszcze o 2 kwestie.

  1. Z czego się uczyć? Na tą chwile HTML5 i CSS3 przerabiałem z jakiś kursów/przeszukiwania internetu, ale czy nie lepiej po prostu kupić książkę? Wydaje mi się, że w tych czasach przy takich forach jak to, stackoverflow książki zostają trochę z tyłu, dobrze myślę? Jeżeli nie proszę o wyprowadzenie mnie z błędu i polecenie w miarę możliwości jakiś książek. Z góry odpowiem, że oczywiście wolę, Polskie, ale jeżeli w naszym rodzimym języku nic wartego nie znajdę mogę powalczyć z Angielskimi książkami.
  2. Troszkę mnie zaniepokoił ostatni post, związany z miejscem zamieszkania. Co rozumiemy przez małą miejscowość?
    Moja miejscowość jest dość mała ~32k ludzi, lecz obok 10-15km ode mnie jest miasto wielkości ~180k ludzi. Czy takie miasto możemy uznać za "wystarczające", czy jednak pod słowem duże kryją się miasta wielkości Krakowa, Katowic, Warszawy?

Pozostało 580 znaków

2016-02-18 11:33
0

po prostu zrób rozeznanie czy w twojej okolicy w ogóle jest praca dla początkującego juniora bez doświadczenia, bo zwykle janusze nie chętnie inwestują w takowych, szukając raczej osoby "na teraz" czyli siadasz robisz stronę, sklep, czy poprawki, obojętne w czym byle była kasa

czasami szybciej znajdzie pracę gościu "od presty" niż klepacz bez doświadczenia który "może" się zwróci po kilku miesiącach, proza życia ...


Pozostało 580 znaków

2016-02-18 11:45
1

Angular to trochę loteria - jak wspomniał @Thyliamris, nie wiadomo czy jeszcze się uczyć 1 czy już 2.
1.x jest "martwy", przez jakiś czas pewnie jeszcze będzie wspierany, ale już teraz wiadomo, że to ślepa uliczka. Jak ktoś już go zna to będzie mieć kasę, w końcu ktoś musi utrzymać to co zostało przy jego użyciu stworzone ;)
Angular 2 z kolei jest dopiero tworzony, pewnie się przyjmie, ale nie wiadomo czy w takim stopniu jak 1.x, bo zanim to nastąpi to może pojawić się już nowa moda, poza tym - przeglądając sieć - niektórzy ludzie nieufnie do niego podchodzą - skoro porzucono 1.x to to samo może się stać z 2 (chociaż to może dotknąć każdego frameworka).
Tak od siebie dodam - jako początkujący robiłem bezskuteczne podejścia zarówno do Angulara 1 jak i 2. 1.x szybko okazał się bardzo nieprzyjemny, nie potrafiłem się w nim odnaleźć, "Angular way" do mnie nie trafiał, czułem się trochę jak debil. Trochę poczytałem internetów i zauważyłem, że nie tylko ja tak mam.
Niedawno natrafiłem na Meteor i jak na razie jest bardzo fajnie - dużo dobrze opisanych materiałów, które ułatwiają zrozumienie logiki frameworka, będąc na tym samym etapie z Angularem robiłem często "yyyyyyy?" a tutaj jest "no tak, no tak" (znaczy pozytywnie reaguję na nową wiedzę). Świetnym źródłem wiedzy jest http://pl.discovermeteor.com/ gdzie chłopaki fajnie opisali co się z czym je, dzięki czemu łatwo jest zrozumieć jak to wszystko działa. Z tego co czytałem to jest bardzo pozytywnie oceniany przez szybkość tworzenia aplikacji, wydajność i skalowalność (brak mi doświadczenia aby samemu wydać już teraz wyrok). Minusem może być jego niepopularność w naszym kraju, ale ja do tego podchodzę bardziej na zasadzie pasji, co nie znaczy, że nie chciałbym się z nim zaprzyjaźnić na dłużej i czerpać z jego znajomości korzyści finansowych :P

Pozostało 580 znaków

2016-02-18 12:01
Świetny Kot
0

Dziękuje :)
Takie pytanie znalazłem taką oto książkę do Bootstrapa przed którym właśnie stoją.
http://helion.pl/ksiazki/boot[...]azle-rahman,bootst.htm#opinie
Cena przyzwoita, opinie dobre. Miał ktoś styczność z tą książką?

Pozostało 580 znaków

2016-02-18 12:12
Świetny Kot
0

przepraszam za post pod postem ale nie mam możliwość edytacji.
Oczywiście, ta książka w momencie gdy moje myślenie o nauce z internetu było złe :)

Pozostało 580 znaków

2016-02-18 12:35
0
Świetny Kot napisał(a):

Dziękuje :)
Takie pytanie znalazłem taką oto książkę do Bootstrapa przed którym właśnie stoją.
http://helion.pl/ksiazki/boot[...]azle-rahman,bootst.htm#opinie
Cena przyzwoita, opinie dobre. Miał ktoś styczność z tą książką?

Bootstrap nie jest trudny, jeżeli znasz HTML, CSS i JS to spokojnie poznasz podstawy Bootstrapa w kilka godzin czytając np. http://getbootstrap.com/ . Jeżeli tego nie znasz to lepiej zacznij od podstaw, Bootstrap(Foundation zresztą też) jest zbiorem gotowych elementów, które i tak będziesz stylować pod określony projekt , więc Cię to nie ominie ;)
W opiniach na stronie Heliona można znaleźć informację, że nie przedstawia nic ponad to co oferuje dokumentacja, więc jak dla mnie lepiej tą kasę przeznaczyć na jakieś przyjemności.

edytowany 1x, ostatnio: Pietruch, 2016-02-18 12:36

Pozostało 580 znaków

Liczba odpowiedzi na stronę

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0