Que faut-il apprendre pour devenir un bon ingénieur front-end ?

Qu'est-ce qu'un ingénieur front-end

Les ingénieurs front-end jouent un rôle professionnel indispensable en R&D dans le développement de produits logiciels à l’ère d’Internet. Au sens strict, les ingénieurs front-end utilisent des compétences professionnelles et des outils tels que HTML, CSS et JavaScript pour implémenter des ébauches de conception d'interface utilisateur dans des produits de sites Web, couvrant les PC des utilisateurs, les pages Web mobiles, traitant des problèmes visuels et d'interaction. D'une manière générale, toutes les parties des produits terminaux utilisateur liées à la vision et à l'interaction sont des domaines professionnels des ingénieurs front-end.

En 2005, la plupart des pages Web ressemblaient à ceci :

La page web actuelle ressemble généralement à ceci :

Quels sont les parcours de développement et les perspectives des ingénieurs front-end ?

Le front-end est une industrie relativement nouvelle. Au début du développement d’Internet (1995 ~ 2005), il n’existait pas d’ingénieurs front-end professionnels. Avec le développement d'Internet, à partir de 2005 environ, le rôle des ingénieurs front-end formels a été reconnu par l'industrie. En 2010, Internet a commencé à entrer pleinement dans l'ère mobile. Le statut des ingénieurs front-end est devenu de plus en plus important. important, et le développement technique dans le domaine du front-end est également devenu de plus en plus important, diverses nouvelles idées, modèles de conception, outils et plates-formes se développent rapidement et les exigences de compétences pour les ingénieurs front-end sont de plus en plus élevées.

Certaines données illustrent le développement rapide de l’industrie front-end.

● Un nombre considérable des nouveaux langages de programmation les plus populaires après 2010 sont liés au front-end, tels que Dart, Clojure, CoffeeScript et TypeScript.

● En tant que langage de programmation front-end le plus important, JavaScript figure fermement sur la liste des langages de programmation populaires sur la plateforme Github ces dernières années, à la fois en termes de volume de code et de nombre d'abonnés.

● La demande de front-end dans l'industrie continue d'augmenter et le salaire des programmeurs front-end occupe une position de leader dans l'industrie.

La plupart des langages de programmation les plus populaires ces dernières années sont des langages alternatifs JavaScript

JavaScript fait partie du top 10 des langages de programmation les plus populaires

Entreprises Internet ces dernières années L'équipe front-end double chaque année

Le salaire moyen des ingénieurs JavaScript se classe dans le top 10 d'ingénieurs en langage de programmation

De quels types de connaissances et de compétences les ingénieurs front-end ont-ils besoin ?

Certaines personnes disent que la pile technologique d'un ingénieur front-end est comme ceci :

D'autres disent ceci :

En fait, les compétences de base des ingénieurs front-end sont :

Dans le processus de développement de produits d'une entreprise Internet typique, la relation entre les ingénieurs front-end et les autres rôles est à peu près la suivante :

Le front-end est l'ingénieur le plus proche du produit et de la conception, et joue un rôle dans la connexion des produits et de la technologie. Le front-end est responsable des pièces que les utilisateurs peuvent voir, c'est donc également l'ingénieur le plus proche de l'utilisateur.

À l'ère du multi-terminal, si un produit prend en charge à la fois les PC et les terminaux mobiles, les ingénieurs front-end doivent assumer davantage de rôles :

JavaScript Pour le front-end, c'est la compétence la plus importante, donc un excellent ingénieur front-end doit avoir de solides compétences de base en JavaScript. Le langage de programmation JavaScript est également très apprécié dans le domaine de la programmation. Aujourd'hui, il n'est pas seulement utilisé pour développer le Web, mais peut également être utilisé dans divers aspects. (Tutoriel vidéo JavaScript)

JavaScript peut être utilisé sur "Raspberry Pi" Développement de ce type de puce matérielle intelligente

Les ingénieurs front-end sont également des ingénieurs logiciels, les connaissances de base des ingénieurs logiciels sont donc également très importantes. Ces connaissances de base incluent :

. ● Mathématiques

● Système informatique

● Système d'exploitation

● Structures de données et algorithmes

● Principe de compilation

HTML et CSS sont également des compétences de base très importantes pour les ingénieurs front-end. De nombreux étudiants, en particulier ceux qui aiment écrire du code, ont tendance à ignorer le langage de balisage. En fait, le ML est également un contenu très important dans les domaines liés à l'interface utilisateur et ne devrait pas le faire. être ignoré.

● HTML : Le niveau de vie (Tutoriel vidéo HTML)

● HTML & CSS (Tutoriel vidéo CSS)

Certains étudiants ont demandé : « Il existe de nombreuses exigences en matière de travail frontal, et il y a toujours des changements et des changements. Il n'y a pas beaucoup de points techniques réels. Le produit détermine la logique métier. Travailler sur les services de base sous-jacents sera-t-il plus difficile et aura-t-il un meilleur avenir professionnel ?"

En effet, plus on se rapproche du travail au niveau de l'entreprise et du produit, plus la différence de demande est grande et plus les changements peuvent être fréquents. Ce n'est pas seulement le front-end qui change encore et encore, les étudiants qui font des affaires sur le serveur PHP sont également confrontés à ce problème, et la logique métier change encore et encore. Plus la couche est basse, plus elle est polyvalente et il y a relativement peu de changements.

Cependant, tout a deux faces. Tout d’abord, vous pouvez vous demander si le marché des services de base sous-jacents est plus grand ou celui des entreprises et des produits Internet. Deuxièmement, l’universalité des services de base est facile à réaliser, mais comment l’universaliser au niveau des produits et comment utiliser l’ingénierie et les outils pour améliorer l’efficacité du développement de produits axés sur les entreprises est en réalité un problème difficile. Les produits Internet riches ont changé et changent nos vies. Cependant, en tant que créateurs de produits, la manière dont les ingénieurs peuvent améliorer leur situation est un domaine qui mérite d'être étudié.

De plus, ne pensez pas qu'il n'y a pas beaucoup de points techniques réels. Voici quelques exemples : mise en œuvre d'animations de courbes et de surfaces, calcul du chemin le plus court de la carte, création d'images statiques png effectuant des mouvements locaux similaires aux images gif, jeux de loterie. , et jeux HTML5 avec effets physiques, graphiques 3D, traitement de flux vidéo WebGL en réalité augmentée, etc., ce sont autant de problèmes pratiques rencontrés dans le domaine du front-end.

En ce qui concerne JavaScript, concevoir le modèle le plus approprié pour résoudre efficacement des problèmes réels dans des projets réels est en soi un véritable défi. En tant que langage de programmation typique de nouvelle génération, JavaScript est riche en fonctionnalités, flexible dans son utilisation et offre d'excellentes performances. La programmation fonctionnelle orientée objet, divers modèles de conception, MVC et MVVM sont suffisamment attrayants en eux-mêmes.

Le front-end doit résoudre les problèmes d’interface et d’interaction. En fait, les problèmes au niveau de l’interface utilisateur ont toujours été un problème difficile en génie logiciel car l’interface utilisateur est en constante évolution. La compatibilité des différentes versions de navigateurs, des normes Web, des appareils mobiles et l'adaptation multi-terminaux ont posé de grands défis aux ingénieurs front-end et ont également des exigences élevées en matière de capacités des ingénieurs front-end. De nombreux problèmes d'interface utilisateur ont plus d'une solution, et de nombreux problèmes ont des idées très intelligentes et des solutions merveilleuses. Front-end est un groupe très créatif parmi les ingénieurs, car cette industrie nécessite une créativité et une imagination riches.

Les ingénieurs front-end sont également les définisseurs, les praticiens et les promoteurs des normes Web, et les normes actuelles du W3C ne se limitent pas aux navigateurs, mais incluent également divers appareils intelligents portables, appareils montés sur véhicule, maisons intelligentes, etc. Dans l’ère future de l’Internet des Objets, les ingénieurs front-end ne seront pas seulement des ingénieurs sur les pages Web, mais aussi des ingénieurs dans tous les domaines d’interaction homme-machine.

Apprentissage et croissance des ingénieurs front-end

Le domaine front-end se développe rapidement et diverses nouvelles technologies et nouvelles idées émergent constamment. C'est un bon phénomène. Cependant, le développement rapide du front-end pose également quelques problèmes. Par exemple, un camarade de classe m'a demandé ce que je devais apprendre exactement, Angular.js, React, Node. .js, ES6, ES7, CoffeeScript, TypeScript... Il semble qu'il y ait toujours trop de choses à apprendre, et certaines choses semblent être remplacées par d'autres nouvelles technologies et devenir "obsolètes" avant d'être pleinement comprises.

En fait, c'est toujours la même phrase, Les ingénieurs front-end sont avant tout des ingénieurs logiciels, et la base est la plus importante si la base n'est pas solide, toutes les compétences applicatives seront des « nuages ​​». . Quels sont les fondements du front-end ? Compétences de base en HTML, CSS, JavaScript, compétences de base en mathématiques, algorithmes, structures de données, systèmes d'exploitation et principes de compilation.

Un excellent ingénieur front-end doit avoir un domaine dans lequel il est bon et s'y plonger suffisamment profondément. En même temps, il doit avoir une vision et être capable de « transfrontalier ». Vous pouvez faire carrière dans le front-end, mais ne limitez pas vos compétences au domaine du front-end, car il y a beaucoup de choses qui ne peuvent être vues plus clairement et plus complètement qu'en se tenant en dehors du front-end.

Ne suivez pas aveuglément la tendance lorsque vous apprenez quelque chose. Quand tout le monde parle d'AngularJS, vous irez immédiatement l'apprendre. Après quelques jours, tout le monde parlera de React, vous arrêterez donc AngularJS et irez apprendre React. Il existe de nombreux points de connaissances dans le domaine front-end, et il y a beaucoup de choses qui valent la peine d'être apprises. Les étudiants intelligents savent passer du temps à apprendre des connaissances systématiques et à les étudier suffisamment en profondeur, car ce n'est qu'ainsi que nous pouvons résumer les règles et former une méthodologie. , afin de maximiser la valeur de l’apprentissage.

Informé Correct utilisation - Un maître dans un domaine ne sera jamais une recrue dans un autre domaine similaire

Au cours de l'interview, l'intervieweur a demandé comment optimiser les performances du front-end. Certains étudiants ont pu répondre clairement en utilisant les règles militaires de Yahoo pour l'optimisation des performances. Ils ont souligné à plusieurs reprises l'utilisation d'outils pour compresser les ressources statiques, mais ils ont mis l'accent sur le service nginx du blog. construit n'a pas activé gzip. Tout le monde sait que les ressources statiques doivent être fusionnées et les requêtes HTTP doivent être réduites. Cependant, pourquoi les requêtes HTTP devraient-elles être réduites ? Dans quelle mesure les performances devraient-elles être améliorées et quels avantages peuvent être obtenus après la réduction des requêtes ? Vous devez comprendre ces problèmes, mais également avoir une compréhension approfondie du protocole HTTP lui-même.

Il y a une question plus intéressante. Tout le monde dit que la clé pour écrire du HTML est la sémantique, alors qu'est-ce que la sémantique exactement ? Ce problème a déconcerté de nombreux étudiants. Les étiquettes doivent être conformes à la sémantique. Cette réponse semble simple et standard, mais quel type d'étiquettes est conforme à la sémantique ? L'accent est mis sur l'utilisation de strong au lieu de b ? Donc, s'il existe une civilisation extraterrestre et que dans leur langage, fort équivaut à l'audacieux de la Terre, et gras équivaut au fort de la Terre, alors devraient-ils utiliser fort ou b ? Nous disons que la balise i signifie italique, alors pourquoi fontawesome.io l'utilise-t-il comme balise de police d'icône. Est-ce « anti-sémantique » ?

Dans le passé, il y avait une sorte d'atelier de teinture populaire dans les zones rurales de nombreux endroits pour fabriquer des teintures pour teindre les tissus. Il y a une grande cuve en fer dans ce genre de salle de teinture. Habituellement, un ouvrier très fort prend une longue tige de fer et la frappe fort à l'intérieur de la cuve à teinture. Plus le coup est fort, plus la couleur du colorant produit est foncée. Pourquoi la teinture s'améliore-t-elle à mesure que vous frappez fort sur la cuve en fer ? Les gens de la teinturerie disent que c'est une expérience transmise de génération en génération, et en fait c'est vrai. La couleur de la vraie teinture a beaucoup à voir avec la force du coup. Jusqu'au jour où un étudiant du village parti étudier la chimie a compris que le simple fait d'ajouter une proportion appropriée de limaille de fer au colorant pouvait provoquer une réaction chimique entre le colorant et les oxydes contenant du fer pour rendre le colorant plus vif. Il s'avère que les « rituels » transmis de génération en génération ne sont en réalité qu'une sorte de croyance et de religion face à de vrais principes. De même, si nous ne comprenons pas la nature de la technologie et nous arrêtons à son application, alors nous ne sommes que des adeptes de la religion de la technologie. Par conséquent, dans "Tutoriel vidéo Javascript de Li Yanhui" , il est dit que le langage informatique est comme un bâton magique dans la main d'un prêtre. Si le bâton magique est changé, le prêtre est toujours un prêtre, et. le monde se cognera toujours la tête comme une montagne. Les prêtres maîtrisaient la méthode de communication avec Dieu, mais le monde ne voyait que le bâton.

Sélectionnez l'interface par intérêt

Quand j'ai appris la programmation, j'ai appris le langage C. Cependant, tout ce livre ne m'a pas seulement appris à afficher Hello World et divers autres caractères sur une console noire, ou à saisir quelque chose sur le clavier et à afficher également des caractères. rien d'autre. Après avoir étudié pendant un certain temps, mon cœur s'est effondré pendant un moment, parce que je sentais que c'était différent de ce que je pensais. Après avoir appris tant de connaissances, je ne savais pas si j'avais « appris » le langage C, car en mon Il semble qu'il y ait encore un énorme écart entre ces systèmes d'exploitation colorés et divers logiciels d'application et la console noire.

Rétrospectivement, mes pensées à l'époque étaient bien sûr naïves et ridicules. À cette époque, je ne connaissais pas la différence entre les langages de programmation et les environnements d'exploitation, et je n'avais aucune idée des systèmes d'exploitation, des API utilisateur, des interfaces matérielles, etc. services réseau, etc. Cependant, cela ne peut pas m'être reproché, car le didacticiel du langage C ne me dit pas cela en un seul mot, et je ne sais pas quoi d'autre je devrais apprendre ensuite après avoir appris la grammaire du langage C.

Relativement parlant, le développement Web me semble plus attrayant, car il n'est pas nécessaire d'installer un environnement. Il suffit de saisir quelques caractères dans l'éditeur de texte, de les enregistrer et d'ouvrir le navigateur, et vous pouvez immédiatement voir les riches effets visuels. C’est l’avantage du front-end. Vos efforts sont immédiatement visibles.

Par rapport à l'entrée et à la sortie rigides, le développement Web est beaucoup plus coloré sur la couche visible de l'interface, ce qui m'attire. Si cela vous attire et vous fascine également, alors vous êtes apte à apprendre le front-end.

Avant de choisir le front-end comme carrière, vous devez clairement déterminer que vous êtes effectivement intéressé par le développement front-end. Le choix de faire du front-end doit être basé sur la confirmation que vous aimez et êtes adapté au front-end, pas à un emploi. ça a l'air décent et ça paie bien. Si vous n'êtes pas intéressé, voire ennuyé, par la création d'interfaces colorées et la gestion de diverses logiques d'interaction, alors le choix le plus sage est d'abandonner l'idée de devenir ingénieur front-end - parce que vous choisissez une carrière que vous ne faites pas. Je ne l'aime pas et je ne le supporte pas pendant des décennies jusqu'à ce que la retraite soit vraiment une chose triste.

Quelles capacités valorisons-nous pour les élèves des écoles ?

Certains étudiants ont demandé si les étudiants de première année devaient avoir une expérience pratique. Ici, je peux répondre : Non.

Pour les étudiants, les enquêteurs se soucient davantage de :

● Bases : y compris la maîtrise des mathématiques, des algorithmes, des structures de données et des bases informatiques.

● Capacité d'apprentissage et méthodes d'apprentissage : comment apprendre le front-end, combien de temps avez-vous étudié, dans quelle mesure vous avez appris, quels problèmes vous avez rencontrés et comment vous avez essayé de résoudre ces problèmes.

● Intérêt : votre intérêt pour le front-end. Cela peut se refléter dans de nombreux détails. Il existe un exemple négatif courant. De manière générale, je demanderai aux étudiants à quelles nouvelles connaissances frontales ils ont prêté attention récemment. Certains étudiants diront que je fais attention à tel ou tel. Mais quand je lui demande à nouveau à quoi. Dans la mesure où il y prête attention, je constaterai qu'il y prête réellement attention. Peu de temps a été consacré à ces nouvelles connaissances. Si vous ne consacrez pas de temps aux questions qui vous intéressent, comment pouvez-vous prouver votre « intérêt » dès le début.

● Capacité à résoudre des problèmes : comment résoudre des problèmes difficiles, comment réfléchir et enfin résoudre des problèmes que vous n'avez jamais rencontrés auparavant. À partir de là, vous pouvez juger si les étudiants ont une réflexion initiale. Il n'y a pas de réponses standard à ces questions. Nous ne poursuivons pas certaines « idées officielles » et valorisons le processus plutôt que les résultats.

Concernant les CV, certains étudiants ont mentionné que de nombreuses entreprises semblent désormais espérer que les étudiants puissent apprendre Node.js et React, mais je ne sais pas quoi faire moi-même.

Ce que je veux dire, c'est que nous n'exigeons pas que les étudiants les connaissent. Au contraire, j'encourage personnellement les étudiants à utiliser leur temps pour poser des bases solides. Écrivez simplement ce pour quoi vous excellez sur votre CV. Nous ne vous ignorerons pas simplement parce que vous ne voyez pas Node.js ou React sur votre CV. Tant que vous aimez vraiment le front-end et que vous l'apprenez attentivement, vous devez comprendre comment m'impressionner avec les bases du front-end. Certains étudiants aiment accumuler du vocabulaire sur leur CV. En fait, ce n'est pas forcément une bonne chose, car si vous écrivez quelque chose que vous connaissez peu et que vous êtes finalement interviewé lors de l'entretien, vous obtiendrez certainement des notes négatives.

La technologie elle-même est approfondie. L'étudiant A a déclaré : « Je connais React mais je n'ai jamais rien fait avec. » L'étudiant B a déclaré : « J'ai utilisé AngularJS pour écrire quelques petits projets personnels. » L'étudiant C a déclaré : « J'ai utilisé Elastic. » mise en page le mois dernier. J'ai écrit mon blog sur la base de cette idée, mais un bug d'affichage est apparu dans le navigateur Webkit de la version 4.1 du système Android. Au final, je l'ai résolu comme ça." Vous pensez que parmi les trois étudiants A, B et C, lequel choisirons-nous ?

L'entretien est un processus de communication mutuelle.Nous espérons voir les capacités et le potentiel de chacun dans le domaine du front-end. « Savoir » une chose n'est pas une capacité précieuse, surtout à l'ère d'Internet où la connaissance est bon marché. Nos étudiants ne doivent pas mémoriser quelque chose par cœur comme on le mémorise, mais doivent vraiment l'étudier avec leur cœur. Nos collèges et universités enseignent non seulement à tous des connaissances, mais aussi comment réellement apprendre et faire de la recherche, n'est-ce pas ?

Si vous êtes vraiment intéressé par le front-end et que vous avez du potentiel, vous devez savoir l'apprendre avec un peu de soin.

Enfin, je souhaite que tout le monde puisse devenir un excellent ingénieur front-end.

Liens connexes :
Parcours d'apprentissage Web front-end : Introduction rapide au développement WEB front-end