Taula de continguts:
- Què fa un desenvolupador frontal
- Domina els conceptes bàsics
- Eines bàsiques de desenvolupament web
- Tecnologies bàsiques de suport al desenvolupament web
Tot el que heu de saber per convertir-vos en desenvolupador web frontal.
Si voleu aprendre a codificar amb l’objectiu de ser desenvolupador frontal, hi ha moltes coses que heu de saber per tenir èxit i aconseguir una feina. Heu de començar amb una comprensió ferma dels conceptes bàsics del desenvolupament web i, a continuació, amplieu les vostres habilitats amb eines i recursos addicionals que utilitzen la majoria de desenvolupadors web.
Si heu fet la investigació i esteu segur que el camí a seguir és el desenvolupament del frontal, consulteu aquestes eines que també heu de dominar. Conèixer aquestes eines i recursos no només us ajudarà amb el procés de desenvolupament web, sinó que també us ajudarà a eliminar la competència fora de l’aigua quan sol·liciteu feina.
Finalment, si no esteu 100% segur que voleu provar d’aprendre a codificar, aquí teniu 10 raons per les quals hauríeu d’aprendre a codificar.
Què fa un desenvolupador frontal
Primer heu de saber exactament què és un desenvolupador web frontal. En general, el desenvolupament web es compon de tres tipus de feines segmentades:
- Desenvolupador frontal. Aquesta persona (també anomenada desenvolupador web frontal o enginyer frontal) és un desenvolupador web que treballa amb el frontal de llocs web i aplicacions web, que inclou tot allò que l'usuari veu i fa servir al navegador de la pàgina web.. Els desenvolupadors front-end se solen centrar en el disseny.
- Desenvolupador de fons. Aquesta persona és responsable del back-end o del servidor dels llocs web i aplicacions web. La part posterior és on es manipulen i actualitzen totes les dades. Els desenvolupadors posteriors solen ser pensadors lògics.
- Desenvolupador Full-Stack. Aquesta persona és un ninja especialitzat tant en la part davantera com en la posterior. Si us agrada treballar tant amb coses "boniques" com amb coses "súper tecnològiques", aquesta feina pot ser vostra…
A més, fa molt de temps en una galàxia molt, molt llunyana… hi havia un títol conegut com a Dissenyador web. El dissenyador de pàgines web no s’havia d’enfrontar realment a aprendre a codificar i es va centrar únicament en els aspectes de disseny de les pàgines web.
Actualment, com que els llocs web i les aplicacions web s’han convertit en molt més funcionals i interactius, el mercat laboral exigeix els serveis de persones que saben dissenyar i codificar.
Encara hi ha alguns treballs disponibles per als dissenyadors web, però la majoria dels dissenyadors web intenten aprendre a codificar per obtenir millors oportunitats, remuneració i seguretat laboral. En molts sentits, la feina d’un desenvolupador frontal es pot considerar com un dissenyador web que tingui coneixements en un llenguatge de programació, probablement JavaScript.
HTML és l’esquelet de les pàgines web, CSS és la pell i JavaScript és el cervell.
Domina els conceptes bàsics
Cal que tingueu una clara comprensió de les tres tecnologies bàsiques que s’utilitzen en el desenvolupament web:
- HTML: és el primer bloc bàsic de totes les pàgines web, que dóna estructura a les pàgines web. HTML és un llenguatge de codificació, però no és un llenguatge de programació complet, sinó un llenguatge de marcatge. Els llenguatges de marcatge us permeten "marcar" el text a efectes de processament.
- CSS: és el segon element bàsic de totes les pàgines web, és responsable de la "aparença" de les pàgines web. CSS tampoc no és un llenguatge de programació.
- JavaScript: és el tercer element bàsic i el primer llenguatge de programació real que aprenen la majoria de desenvolupadors web. JavaScript s’executa al navegador de l’ordinador i permet la funcionalitat d’una pàgina web.
Si us imagineu els tres blocs bàsics del desenvolupament web tal com imaginaríeu una persona, podríeu pensar-ho així: HTML és l’os i l’esquelet de les pàgines web, CSS proporciona la pell i JavaScript és el cervell.
Ara mateix, podeu aprendre a codificar fent el curs HTML de Brad Traversy, que és un WHIZ a l’hora d’ensenyar tecnologies de desenvolupament web:
Eines bàsiques de desenvolupament web
- Editor de text: escrivim codi mitjançant un editor de text, i heu de triar-ne un i familiaritzar-vos amb totes les seves capacitats. Alguns dels editors de text populars actuals inclouen: Atom, Sublime Text, Brackets, Visual Studio Code, i el bonic bloc de notes MS i Mac Text Edit.
- Eines per a desenvolupadors de navegadors: Google Chrome i Mozilla Firefox estan equipats amb eines de desenvolupador internes que us permeten veure i manipular el codi de qualsevol lloc web del vostre navegador.
- Aquestes eines són bones per depurar i, per descomptat… sou l’únic que pot veure els canvis que feu al lloc web amb eines per a desenvolupadors, perquè només esteu manipulant el lloc tal com apareix al vostre propi navegador.
- Sistemes de control de versions: els sistemes de control de versions us permeten gestionar els canvis als vostres projectes web. Això us permet tornar a diferents versions d'un projecte sense interferir amb el projecte desplegat fins que no hàgiu perfeccionat el que esteu treballant. Hi ha diversos sistemes de control de versions en ús, però Git és amb diferència el més dominant.
- Línia d’ordres (terminal): cal un domini exhaustiu de la línia d’ordres per al desenvolupament web professional. La línia d’ordres té por, però facilita la càrrega de nous paquets de programari i també facilita la navegació per fitxers i carpetes. Podeu aprendre a dominar la línia d’ordres en un dia.
Tecnologies bàsiques de suport al desenvolupament web
- Preprocessador CSS: aquesta tecnologia fa que escriure i mantenir CSS sigui una brisa. De llarg, el preprocessador CSS més comú és SASS i es pot aprendre en un dia
- Marcs CSS: a l’hora de fer que les tasques CSS complexes tinguin menys temps per crear-se, el marc CSS que haureu de conèixer és Twitter Bootstrap.
- CSS Flexbox i CSS Grid: tots dos són dissenys de models web CSS que ajuden significativament a fer que les vostres pàgines web siguin receptives per a mòbils.
- Eines d’ agrupació: Webpack i Browserify amb Gulp s’utilitzen per ajudar a carregar la pàgina més ràpidament al navegador. Aquestes eines serveixen per reduir o reduir el contingut per aconseguir temps de càrrega més ràpids.
- Biblioteques i marcs de JavaScript: les biblioteques i els marcs us permeten afegir interaccions de JavaScript a les pàgines web de manera més ràpida, senzilla i eficient. També ajuden a simplificar aspectes més complexos de JavaScript. Algunes de les biblioteques i marcs populars inclouen: JQuery, React i Angular.
Com podeu veure, hi ha molt que heu d’aprendre per convertir-vos en desenvolupador web frontal. La bona notícia és que TOTES aquestes eines, recursos i tecnologies es poden aprendre de forma gratuïta. Ja podeu veure que només hi ha un munt de recursos gratuïts a YouTube…
Si necessiteu un aprenentatge més complet, totes aquestes eines es poden aprendre gairebé sense res utilitzant recursos d’aprenentatge en línia com Team Treehouse. També hi ha cursos individuals disponibles, com el curs de desenvolupament complet de front-end o Modern React on Udemy.