Habituellement, démarrer avec une nouvelle technologie n'est pas si simple. Un débutant se retrouve dans une mer sans fin de manuels et d'articles de formation. De plus, derrière chacun de ces documents se trouve l'opinion personnelle de son auteur, et chaque auteur prétend que c'est par sa bouche que la vérité parle.
Du point de vue du bon sens, il est clair que tous les articles publiés sur Internet ne peuvent pas apporter de réels avantages, de sorte que ceux qui tentent d'apprendre quelque chose de nouveau doivent évaluer les publications pour tenter de trouver la réponse à la question de savoir s'il faut dépenser pour eux votre temps.
Avant de partir avec la tête pour étudier, le programmeur doit comprendre les bases de la technologie qui l'intéresse. Ensuite, vous devez former votre vision de cette technologie, apprendre à penser en fonction de celle-ci. Par conséquent, si quelqu'un commence à apprendre React, il doit d'abord apprendre à "penser à React". Et déjà après avoir développé cette qualité en lui-même, il sera en mesure de se familiariser de manière significative avec les opinions des autres et, en sélectionnant les plus utiles, de se développer dans une direction choisie.
L'auteur de l'article, dont nous publions aujourd'hui la traduction, souhaite partager avec tous ceux qui veulent en savoir plus sur React lors de la formation de sa propre vision de cette technologie, au cours de son étude et de son accumulation d'expérience dans ce domaine. Ici, il parlera de ce qu'il a réussi à comprendre en un an, travaillant en tant que programmeur React, réalisant ses propres projets pendant son temps libre et partageant ses idées lors d'une conférence JavaScript.
React est une technologie en constante évolution.
Étant donné que React est en constante évolution, quiconque souhaite maîtriser cette technologie doit être prêt à maintenir constamment ses connaissances et ses compétences à jour. Si vous vous souvenez de l'annonce de React 16.3.0, vous connaissez l'enthousiasme de la communauté des programmeurs qui a apporté de nouvelles fonctionnalités. Parmi eux, le contexte d'API officiel, les API createRef et forwardRef, le mode strict et les modifications du cycle de vie des composants. La principale équipe de développement de React et tous ceux qui ont apporté une contribution réalisable au développement du projet ont fait un travail incroyable en essayant d'améliorer notre cadre préféré. Ce travail ne s'arrête pas. Ainsi, par exemple, la version 16.4.0 a introduit la prise en charge des
événements de pointeur .
React continue d'évoluer, l'innovation n'est qu'une question de temps. Parmi ces innovations, le rendu asynchrone, la mise en cache, de nombreux changements attendus dans React 17.0.0 et quelque chose que personne ne connaît.
Compte tenu de ce qui précède, il est clair que si vous voulez rester à la pointe du développement de React, vous devez être au courant des innovations. Cela signifie que vous devez savoir comment fonctionnent les nouveaux mécanismes-cadres et pourquoi ils ont été créés. Vous devez comprendre quels problèmes ils résolvent et comment ils simplifient le développement.
N'ayez pas peur de casser votre code en petits fragments
React est basé sur les composants. Cela suggère que ce concept devrait être utilisé et briser audacieusement de gros morceaux de code en morceaux plus petits. Parfois, un simple composant ne peut comprendre que 4 à 5 lignes de code et, dans certains cas, c'est tout à fait normal.
Vous devriez aborder la fragmentation du code afin que si un nouveau développeur se connecte à votre projet, il n'aurait pas à passer plusieurs jours à comprendre comment ce projet fonctionne et comment il fonctionne.
// , ? return ( [ <ChangeButton onClick={this.changeUserApprovalStatus} text="Let's switch it!" />, <UserInformation status={status}/> ] );
Vous n'avez pas à créer d'énormes composants qui contiennent toute la logique nécessaire à leur travail. Un composant, par exemple, ne peut décrire qu'une représentation visuelle d'une entité. Si l'utilisation de petits composants améliorera la lisibilité du code, le rendra plus facile à tester et facilitera le soutien du projet à l'avenir, alors l'application systématique de cette approche est une merveilleuse solution qui affectera positivement le travail de chaque membre de l'équipe.
import ErrorMessage from './ErrorMessage'; const NotFound = () => ( <ErrorMessage title="Oops! Page not found." message="The page you are looking for does not exist!" className="test_404-page" /> );
L'exemple ci-dessus applique des propriétés statiques. Nous avons devant nous un composant propre qui est responsable de l'affichage du message d'erreur
Not Found et de rien d'autre.
De plus, si vous ne souhaitez pas que les classes CSS et les noms de classe apparaissent partout dans votre code, je vous recommande d'utiliser des composants stylisés. Cela peut améliorer considérablement la lisibilité du code.
const Number = styled.h1` font-size: 36px; line-height: 40px; margin-right: 5px; padding: 0px; `; //.. <Container> <Number>{skipRatePre}</Number> <InfoName>Skip Rate</InfoName> </Container>
Si vous avez peur de créer trop de petits composants car il vous semble que leurs fichiers obstruent les dossiers avec les matériaux du projet, réfléchissez à la manière de structurer votre code différemment. J'ai utilisé la
structure fractale du projet pour organiser les matériaux, et je dois dire que c'est tout simplement merveilleux.
Ne vous reposez pas sur vos lauriers après avoir compris les bases.
Parfois, il peut vous sembler que vous ne comprenez pas assez bien pour procéder à l'étude et à l'utilisation de choses plus avancées. Habituellement, en règle générale, vous ne devriez pas vous inquiéter particulièrement à ce sujet - commencez simplement à maîtriser ce qui vous semble trop compliqué et à vous prouver que vous êtes capable de le comprendre et de l'utiliser.
Par exemple, si vous êtes au début du chemin d'un développeur React, vous pouvez trouver de nombreux modèles de conception apparemment compliqués que vous devriez explorer. Parmi eux, les composants composés, les composants de haut niveau, les accessoires de rendu, les composants intelligents, les composants muets et bien plus encore (par exemple, il est recommandé de maîtriser la technologie de profilage des performances des composants).
Maîtrisez toutes ces technologies et vous comprendrez pourquoi et pourquoi elles sont utilisées. À la suite de leur étude, vous constaterez qu'il est maintenant plus pratique pour vous de développer des projets sur React.
// ? // , , . render() { const children = React.Children.map(this.props.children, (child, index) => { return React.cloneElement(child, { onSelect: () => this.props.onTabSelect(index) }); }); return children; }
De plus, n'ayez pas peur d'utiliser quelque chose de nouveau au cours du travail, naturellement, dans des limites raisonnables. Dans le même temps, ne limitez pas l'utilisation de nouvelles approches uniquement aux expériences dans des projets que vous faites pendant votre temps libre.
Si ceux avec qui vous travaillez ont des questions sur vos innovations, sachez que cela est tout à fait normal. Soyez prêt à défendre vos décisions avec des arguments solides en leur faveur.
Votre objectif devrait être de résoudre un problème existant, de simplifier le développement ou simplement d'améliorer la lisibilité du code qui avait l'air désordonné. Même si vos propositions, à la suite de discussions avec l'équipe, sont rejetées, vous apprendrez au moins quelque chose de nouveau, et c'est bien mieux que de ne rien proposer de nouveau et de ne pas vous développer en tant que développeur.
Ne cherchez pas à trop compliquer les projets
Peut-être cette recommandation vous semblera-t-elle contraire à la précédente, consacrée à l'expérimentation de nouvelles technologies, mais, en fait, ce n'est pas le cas. Partout, dans la vie, dans la programmation, nous avons besoin d'équilibre. Ne simplifiez pas exagérément quelque chose juste pour démontrer aux autres leur propre avancement. Il est préférable d'aborder ce qui se passe en termes pratiques. Écrivez du code facile à comprendre et qui résout les tâches qui lui sont assignées.
Par exemple, si Redux n'est pas nécessaire dans votre projet, mais que vous souhaitez utiliser cette bibliothèque uniquement parce que tout le monde l'utilise et que vous ne pensez pas vraiment aux objectifs de l'utilisation de Redux, ne le faites pas. Mieux - traitez avec Redux, construisez une compréhension de cette technologie et si vous voyez que ce qui se passe dans votre projet est contraire à ce que vous comprenez, soyez prêt à défendre votre point de vue.
Parfois, il peut vous sembler qu'en utilisant les dernières technologies et en créant du code complexe, vous dites au monde entier quelque chose comme ceci: «Je ne suis pas un développeur débutant, je deviens un professionnel. C'est le code que j'écris! "
Honnêtement, j'étais moi-même au début de la carrière d'un développeur. Mais au fil du temps, on se rend compte que le code qui est écrit sans le désir de prouver quelque chose à quelqu'un, un code dans lequel les technologies ne sont pas utilisées uniquement parce qu'elles peuvent y être utilisées, sans raisons sérieuses de recourir à ces technologies, le rend beaucoup plus facile. la vie de tout développeur. Voici ce que cela signifie:
- Non seulement celui qui comprend la conception de ce projet, mais aussi les autres membres de l'équipe peuvent travailler sur un projet qui n'est pas trop compliqué. En conséquence, les tâches de développement, de correction de bogues, de test et bien d'autres, peuvent être résolues non seulement par le créateur de ce projet.
- D'autres programmeurs peuvent comprendre ce que vous faites sans passer trop de temps à écouter vos explications. Vous pouvez les mettre à jour en quelques minutes.
- Lorsque le développeur principal, par exemple, part en vacances de deux semaines, d'autres sont libres de s'acquitter de ses tâches, et ils n'auront pas à consacrer une journée entière à ce qui est fait pendant quelques heures.
Les gens sont bons pour ceux qui ne compliquent pas leur vie. Ainsi, si vous voulez être respecté par l'équipe et être en règle avec vos supérieurs, essayez d'écrire du code pour l'équipe, pas pour vous-même. Vous deviendrez ainsi une personne avec qui il est facile et agréable de travailler.
La refactorisation est OK
Pendant le travail sur un certain projet, vous pouvez changer votre point de vue des dizaines de fois sur certaines choses, et le chef de projet peut encore plus souvent réviser ses vues. Quelqu'un critique ce que vous avez fait et vous, si la critique est justifiée, commencez à changer quelque chose; vous critiquez le travail des autres et ils, en vous écoutant, refont ce qu'ils ont écrit. En conséquence, le code doit être constamment réécrit.
Ne prenez pas cela comme quelque chose de négatif. Étant donné que les programmeurs doivent constamment apprendre quelque chose de nouveau, la refactorisation est tout à fait normale. Le développement est généralement le chemin des essais et des erreurs. Et plus souvent quelqu'un trébuche, évoluant dans cette voie, plus il lui sera facile de faire face aux difficultés et de passer à autre chose.
Cependant, pour éviter que le refactoring ne se transforme en cauchemar, il est recommandé d'accorder une attention suffisante aux tests. N'hésitez pas à tester tout ce que vous pouvez atteindre. Peut-être que chaque programmeur a déjà rencontré ou rencontrera toujours une situation dans laquelle de bons tests lui permettront de gagner une tonne de temps. Et si vous, comme beaucoup d'autres, pensez que les tests sont une perte de temps, essayez de les faire différemment qu'auparavant. À savoir, voici les avantages que le développeur et son équipe tirent de bons tests:
- Vous n'avez pas besoin de passer du temps avec vos collègues pendant longtemps pour leur expliquer comment tout fonctionne.
- Vous n'avez pas à expliquer les raisons pour lesquelles quelque chose s'est mal passé.
- Vous n'avez pas à corriger les erreurs des autres.
- Vous n'avez pas à corriger les bugs qui sont apparus quelques semaines après la sortie.
- Grâce à l'organisation précise des vérifications de projet, vous avez le temps de résoudre divers problèmes qui ne sont pas liés aux erreurs de débogage qui viennent de nulle part.
En fait, voici juste une petite liste des avantages qu'un programmeur et ses collègues reçoivent d'un système de test de projet bien organisé.
L'amour pour son travail est la base du succès
Il y a un an, j'ai décidé de devenir un développeur React plus avancé. Je voulais, entre autres, prendre la parole lors de divers événements, partager la joie d'apprendre de nouvelles choses avec d'autres personnes.
Je peux m'asseoir devant l'ordinateur toute la nuit, faire ce que j'aime et profiter de chaque minute de ce qui se passe. Le point ici est que si une personne cherche vraiment quelque chose, alors, d'une manière ou d'une autre, tout ce qui l'entoure l'aide à atteindre le but. Par exemple, récemment, j'ai parlé pour la première fois lors d'une petite conférence devant deux cents spectateurs.
Pendant ce temps, j'ai grandi en tant que développeur React, j'ai beaucoup appris. En particulier, cela s'applique à divers modèles de conception, principes de développement de projet, mécanismes de cadre interne. Maintenant, je peux communiquer sur des sujets qui m'étaient auparavant inaccessibles et, de plus, je peux enseigner aux autres ce que je n'osais pas regarder auparavant. En même temps, je ressens aujourd'hui le même plaisir et le même plaisir qu'il y a un an.
Par conséquent, je recommanderais à tout le monde de se demander: "Aimez-vous ce que vous faites?" Si la réponse à cette question est négative, trouvez ce que vous aimez vraiment, quelque chose dont vous pouvez parler pendant des heures, quelque chose que vous pouvez faire jour et nuit, en vous sentant complètement heureux. Pour grandir et se développer dans n'importe quel domaine, chacun doit trouver ce qu'il aime. L'homme ne peut être forcé de réussir quoi que ce soit. Une personne ne peut réussir que lorsqu'elle fait consciemment et avec plaisir ce qu'elle aime.
Si je pouvais revenir en arrière il y a un an et me retrouver là-bas, je me le dirais pour me préparer au grand et intéressant chemin qui m'attend.
Chers lecteurs! Quels conseils, inspirés par l'expérience, pourriez-vous partager avec des développeurs Web novices?
