Core na Kasanayan sa Master para sa Mga Nag-develop na Front-End

Ang pag-post ng trabaho ay iba sa kung ano ang hinahanap nila sa isang front-end developer. Ang ilang mga kumpanya ay nagnanais ng mga aplikante na alamin ang mga bagay tulad ng Ruby, Git, mga tool ng disenyo, pag-edit ng video- at ang listahan ay napupunta.

Gayunpaman, mayroong ilang mga kasanayan na nangangailangan ng anumang front-end na trabaho sa pag-unlad-ang "core" na kasanayan-at ilang iba pa na dapat mong sineseryoso mong isaalang-alang ang pagdaragdag sa iyong repertoire.

Anong kailangan mong malaman

Mag-browse ng mga listahan ng trabaho online sa paghahanap ng kung ano ang susi para sa mga developer ng front-end na malaman at maunawaan; may tatlong pangunahing bagay. Hindi ma-negosyante.

At ang mga ito ay:

1. HTML
2. CSS
3. JavaScript (jQuery)

Ito ang mga batayan. Sa kabutihang palad, may maraming mga libre o abot-kayang online learning platform kung saan maaari mong malaman ang mga kasanayang ito kung hindi mo alam ang mga ito.

HTML

Ang HyperText Markup Language, o HTML, ang pangunahing istruktura ng lahat ng mga website sa Internet. Tulad ng sabi ni Jennifer Kyrnin,

"Ang wika ng mga web page-ang markup language na binabasa ng mga browser upang mag-render ng mga web page."

Ang mga pahina ng web ay hindi maaaring umiiral nang walang HTML.

CSS

Ang CSS at HTML ay nagtutulungan: Ang CSS ay nagdaragdag ng estilo sa HTML. Gusto kong gamitin ang pagkakatulad na HTML ay tulad ng isang mukha, at CSS ay tulad ng pampaganda.

Kahit na ang CSS ay hindi kinakailangan upang makakuha ng isang website sa online, talaga bawat site online ay gumagamit ng ilang uri ng estilo.

Kung hindi, ito ay magiging medyo mayamot. Gamit ang pinakabagong mga bersyon ng CSS, maaari mong gawin ang mga bagay tulad ng mga animation at mas advanced na estilo na posible lamang sa JavaScript o Flash sa nakaraan.

JavaScript

Ang JavaScript, o JS, ay mabilis na sumusulong sa paglipas ng mga taon. Mayroong maraming mga layunin ngayon at maaaring magamit sa harap o likod na dulo.

May kaugnayan sa front-end development, ang JS ay mahalaga dahil ito ay tumutulong na gawing interactive ang mga web page. Maaari kang gumawa ng mga kahanga-hangang bagay tulad ng lumikha ng mga botohan, mga pagsusulit o pagsusumite ng form. Sa panahong ito mayroong maraming mga JS library online upang matulungan kang dalhin ang iyong mga web page sa susunod na antas.

Gayunpaman, upang maging isang front-end developer, kailangan mo lamang na maunawaan ang pangunahing JavaScript pati na rin ang pinakasikat na JS library - jQuery.

Nice-to-Have Skills

Pagkatapos bumaba ang mga pangunahing kaalaman, ang mga ito ay iba pang mga kasanayan na gandang magkaroon. (At maraming mga front-end na mga trabaho sa pag-unlad ang hinahanap para sa kanila.)

MV * Mga Framework ng JavaScript

Ang mga framework ng JavaScript ay tumutulong sa iyo na ayusin at patatagin ang iyong code.

Bilang malayo sa mga pagpipilian MV * (o MVC) pumunta, may mga tatlumpung out doon: dalawa sa mga pinaka-popular na pagiging backbone.js at angular.js.

Walang alinlangan, ang pag-aaral ng JS framework ay ang toughest bahagi ng pagiging isang tunay na front-end developer, ngunit ito ay ang pinakamahusay na paraan upang dalhin ang iyong mga kasanayan sa susunod na antas.

Mga Tool sa CSS

Kung ikukumpara sa mga balangkas ng JavaScript sa itaas, ang mga tool sa CSS sa ibaba ay medyo madaling matutunan. May tatlong uri upang hanapin ang:

• Precompiler: Ang paggamit ng isang precompiler (o preprocessor) ay may maraming mga pakinabang, mula sa paggawa ng mas malinis na code sa pagpapanatili ng samahan. Ito ay isang madaling paraan upang magsulat ng CSS at nagtataguyod ng mga prinsipyo ng Dry (Huwag Ulitin ang Iyong Sarili). Ang mga popular na CSS precompiler ay Sass, Less, and Stylus. Kung nagsisimula ka lang, manatili sa pag-aaral ng isa.
• Mga balangkas ng CSS: Tulungan ang mga framework ng CSS na i-optimize ang iyong workflow sa built-in na grids at iba pang mga sangkap ng CSS. Dalawang tanyag na halimbawa ang Bootstrap at Foundation.
• Nakikiramay na disenyo: Sa mga araw na ito, mayroong maraming iba't ibang mga uri ng mga device na maaaring ma-adapt ang iyong site sa lahat ng mga ito. Tinutulungan ka ng tumutugon na disenyo na bumuo ng mga site na gumagana sa lahat ng mga laki ng screen - desktop, tablet, at smartphone. Ang mga framework na tulad ng Bootstrap at Foundation ay may nakatutulong na disenyo na binuo, kaya kung matututunan mo ang isa sa mga iyon, naka-set ka.

Front-End Build Tools

Bilang isang developer, dapat mong pamahalaan ang laki ng file optimization at workflow na kahusayan. Ang mga tool na ito ay makakatulong.

• Pamamahala ng Package: Mahirap na maisaayos ang lahat ng mga aklatan, mga ari-arian, at iba pa, lalo na para sa mga malalaking proyekto o kung saan ka nagtatrabaho sa isang koponan. Gumamit ng manager ng pakete, tulad ng Bower, upang makuha ang lahat ng bagay na pinagsunod-sunod at panatilihin ang isang log ng iyong mga update.
• Yeoman.io: Kung minsan ay nagkakaproblema ka sa pagkuha ng mga proyekto mula sa lupa, gamitin ang Yeoman upang mabilis na makapagsimula sa mga proyekto at manatiling produktibo. Ito ay tumatakbo sa command line.
• Task Runners: Gamitin ang Grunt o Gulp, na tumatakbo rin sa command line, upang i-compress ang mga file at i-optimize ang workflow. Maaari silang kumilos bilang mga compiler para sa Sass o Less preprocessors, at mayroon ding malawak na hanay ng mga plugin na ipinagmamalaki ng iba pang mga tampok.

Konklusyon

Habang ang magaling sa pag-alala ay maaaring mukhang tulad ng maraming, isipin ang mga ito bilang mga kasanayan na dapat mong dagdag sa paglipas ng panahon. Ang mga pangunahing bagay na kailangan mong malaman ay HTML, CSS, at JavaScript.

Kung mayroon kang ibang mga kasanayang pang-web, kahit na hindi sila nauugnay sa harap, dalhin sila sa mesa, tulad ng disenyo, pag-edit ng video, SEO, atbp.