Comme toujours, en plus des rapports, il y aura aussi des sessions intensives, des master classes et des ateliers, et, bien sûr, des discussions ouvertes (tout le monde peut le faire - suggérer un sujet de discussion et inviter des participants).
Pour élargir votre horizon, nous avons à nouveau choisi uniquement des rapports créatifs et pratiques sur des projets réels. Il y aura des rapports sur les nouvelles idées et des démonstrations sur la façon dont tout cela fonctionne et fonctionne. Lors des master classes, nous vous expliquerons comment les équipes résolvent des difficultés soudaines, quel nouveau savoir-faire elles ont inventé et ce qu'elles en ont obtenu. Nous parlerons également de beauté.
Et beau et sûr
Dans la piste des questions courantes, les orateurs n'ont pas peur d'approfondir la technologie et de revenir avec des résultats intéressants. Ils vous diront comment empêcher la pénétration de l'extérieur au niveau du code, ainsi que comment travailler dans le runtime de typage statique TypeScript. Les haut-parleurs ajouteront un peu de hardcore, et du développement du côté magnifique, il y aura beaucoup de choses intéressantes sur le son, la danse et les icônes.
Alexander Inkin (Tinkoff.ru), un développeur angulaire passionné, Google Developer Expert, compositeur et fan de cinéma, présentera son application pour jouer au synthétiseur dans un navigateur. Dans ses incroyables démos, Alexander vous expliquera comment vous pouvez utiliser l'impérative API Web Audio dans un style déclaratif. Il parlera également de ce qui vous aidera à réutiliser facilement les blocs créés, et en général, il est confortable d'utiliser l'API dans les environnements de composants Web ou de frameworks avec une approche par composants.
Vasilika Klimova (Avaloq) , une évangéliste 3D luxembourgeoise avec 11 ans d'expérience dans le développement Web, aimait utiliser la technologie 3D dans l'interface avant même qu'elle ne devienne grand public. A été Frontend Team Lead chez Artec3D, où je me suis familiarisé avec le monde 3D de WebGL.
Vasilika montrera comment elle a appris à danser son modèle 3D, et vous apprendrez ce qu'est le gréement, les modèles de skinning et pourquoi les modèles 3D osseux.
Dans notre industrie, les gens considèrent rarement ces petits articles ménagers comme des icônes svg. Nikita Mostovoy (HeadHunter) , le principal développeur frontend de l'équipe d'architecture, nous plongera dans leur monde merveilleux et nous expliquera comment optimiser l'ajout d'icônes sur le site via un composant en ligne. Nikita vous montrera également comment résoudre le problème des icônes sans mise en cache pendant la SSR, comment changer les icônes et optimiser le processus de leur chargement.
Si vous souhaitez ouvrir le code source et gagner quelques semaines d'entraînement, alors Roman Sedov de Tinkoff.ru, développeur angulaire et auteur d'un livre interactif sur l'angulaire avancé), vous dira ce que vous devez être capable de faire et de savoir. Roman soutient et développe des projets open source dans le monde angulaire et sait en pratique à quel point il est amusant de créer des bibliothèques NPM. Et aussi comment rédiger de la documentation, à quoi ressemble un paquet sans code inutile, comment ne pas donner l'impression de matières premières au lieu de sources, comment configurer la vérification du code et comment le télécharger.
Après avoir téléchargé le code, vous devez être prêt à ce que les pirates le comprennent également. Tatiana Novikova (TSARKA) , un pentester expérimenté et un auditeur de code source d'un point de vue de la sécurité, montrera quels vecteurs d'attaque existent et comment les pirates exploitent les vulnérabilités frontales. Il expliquera également pourquoi les frameworks Web ne protègent pas le développeur des erreurs de sécurité et comment les gérer toutes.
Tatiana fera un tour du monde des vulnérabilités frontales, en commençant par XSS et en terminant par les types d'attaques qui ne sont pas les plus populaires, afin que vous puissiez dire en toute confiance que vous avez un minimum d'hygiène.
Et bien sûr, où sans hardcore. Les technologies front-end sont en constante évolution et nous ne suivons pas toujours ce développement. Alexander Rudenko (X5Labs) , ingénieur logiciel senior / Community Lead chez Facebook Developer Circle: Moscou, le poursuivra à partir de la dernière conférence. L'année dernière, Alexander nous a présenté Relay Modern , et cette année, il vous expliquera comment travailler avec les couches de réseau et de données.
Alexander vous rappellera les principes de base de Relay Modern, puis plongera dans la couche de données et la couche réseau pour parler d'une connexion compétente côté serveur.
Mike Bashurov (WiseBits) , conférencier résident, samouraï TypeScript et fan de ReasonML, expliquera comment faire glisser la saisie statique dans le runtime de TS. Pourquoi? Par exemple, pour valider JSON, d'autres données ou pour des tests basés sur les propriétés. Ce n'est pas facile, mais si vous le voulez vraiment, vous le pouvez!
Mike vous montrera ce qu'est l'émission dirigée par type, comment l'utiliser, la comparer avec d'autres solutions et plonger dans les spécificités de l'API de transpilateur (et nous verrons quel est le râteau de cette approche. Venez voir comment les types se déplacent vers l'exécution et valider les données ...
Beau non seulement à l'extérieur, mais aussi à l'intérieur
Les développeurs veulent également travailler dans un code beau et pratique. Bien sûr, il est difficile d'évaluer si l'architecture est bonne ou non - dans un projet, elle réussira, et dans un autre "quelque chose va mal tourner". Néanmoins, une architecture claire facilite toujours le travail sur un projet: l'extension ou la modification du code se fait sans grandes difficultés de compréhension et de test. Même si vous venez de recevoir le code de quelqu'un d'autre entre vos mains. Les reportages de la piste "Architecture" ne concernent que la manière de simplifier la vie d'un développeur.
Denis Krasnovsky (DomClik) , responsable du développement technique, fera à nouveau plaisir avec un rapport sur l'optimisation du code. Cette fois, Denis parlera de la méthodologie de refactoring affinée sur de nombreux projets. Avec son aide, vous pouvez insuffler une nouvelle vie au code le plus incompréhensible.
Avec le nouvel algorithme, il sera plus facile de prendre une décision pour gérer les problèmes lorsque vous êtes déjà arrivé à un projet avec héritage.
Ivan Soloviev (Evrone) , non seulement un développeur JS frontend, mais aussi un praticien de Go and Rust - il aime les comparer les uns aux autres et à JavaScript. Ivan parlera de la manière dont le choix entre monolithe et microservices, ainsi que mono-référentiel et polyrep, affecte la lutte contre la complexité dans les grands projets.
Ivan expliquera également comment l'architecture choisie aidera à prévenir les maladies d'un grand frontend comme le cycle de publication, la vente en croissance, l'obsolescence du code, l'évaluation des dépendances, la duplication de code et le code partagé.
Ali Rahimov (Okko), développeur frontend depuis 2013, parlera des avantages de TypeScript dans l'architecture de développement Web et des raisons pour lesquelles les développeurs choisissent de plus en plus TypeScript pour leurs projets. Et aussi sur les avantages et les inconvénients de l'utilisation du langage et la facilité avec laquelle il est de démarrer votre premier site Web en TypeScript.
Un bloc séparé sera consacré aux typages, la pierre angulaire du langage sur lequel même les développeurs expérimentés trébuchent.
Andrey Marchenko (Tinkoff.ru) , techlead, plateforme de développement pour les développeurs, racontera l'histoire de son projet. Découvrez comment l'architecture frontale de Tinkoff a changé et évolué. Comment en 2015 5 développeurs ont créé le site tinkoff.ru sur React 0.13 et comment le projet vit maintenant.
Maintenant, il y a déjà 60 développeurs et le monolithe se compose de 40 applications distinctes, micro-fronts, monoreps et produits techniques.
Vladimir Grinenko (Yandex) , responsable du service des composants partagés au sein du département de développement de l'interface de recherche, vous montrera comment trouver l'équilibre parfait pour ne pas conduire tout le monde dans un système de conception unique et en même temps maintenir une auto-identification visuelle. Étant donné que Yandex fabrique des produits très différents (recherche, taxi, musique, nourriture, éducation et cinéma), la cohérence (cohérence) des interfaces à travers Yandex est un phénomène contradictoire d'un point de vue visuel et technologique.
Vladimir vous montrera la formule des avantages du code commun: où cela fonctionnera et où il est préférable d'écrire votre propre vélo, et vous dira comment réutiliser le code sans technofascisme et sans arrêter les expériences.
Sympa et avec résultat
Personne ne veut perdre de temps à tester avec des résultats incompréhensibles ou à traverser des conditions de test difficiles, même si les résultats sont bons. Pour que le résultat réponde à vos attentes, nos intervenants vous expliqueront comment rendre les tests compréhensibles même pour les testeurs et les managers, à quoi ressemblent les tests du point de vue d'un ancien QA qui est passé au développement. Et dans "Testing", en plus des rapports, il y aura des tests eux-mêmes, en particulier, nodejs-web-services et UI.
Alexander Iossa (Diginavis) , chef de produit, animateur de la chaîne sur les souffrances et les joies des ingénieurs en logiciel, parlera des tests BDD des applications Web et de la façon dont cela permet d'écrire des tests E2E moins chers et plus rapidement. Montre comment la syntaxe Gherkin en conjonction avec Cypress rend les tests compréhensibles non seulement pour les développeurs, mais aussi pour les testeurs et les gestionnaires.
Alexander enseignera comment écrire des tests, ainsi que qui et quand devrait et peut les écrire. Vous serez en mesure de définir la place des tests d'acceptation dans le pipeline ci / cd, de réutiliser des blocs précédemment écrits, puis il sera facile de maintenir et d'étendre le processus de test.
Alexandre sait aussi quoi pêcher à Innopolis, où il vit depuis plus de 4 ans. Ne manquez pas l'occasion de lui en parler)
Nikolay Moskalenko (Raiffeisenbank) , testeur avec 10 ans d'expérience, développeur frontend sur React et animateur, posera des questions délicates sur la qualité des tests. Nous verrons la situation avec des tests à travers les yeux d'un ancien QA qui est passé au développement. Et voyons comment tester rapidement le code (il y a plus de défauts qu'il n'y paraît!).
Nikolay vous indiquera également quels tests sont les meilleurs à choisir pour gagner du temps. Vous comprendrez quelles techniques et quels outils éliminent les dépendances externes lors du test des applications frontales. Mais ce n'est pas tout! Nikolay vous expliquera comment accélérer l'écriture des autotests en JavaScript et augmenter leur lisibilité à l'aide de la notation Gherking, la bibliothèque jest-cucumber.
Pour le dessert, il existe le modèle PageObject pour les tests de bout en bout sur Puppeteer, qui simplifie la prise en charge des autotests de l'interface utilisateur.
Et enfin, jusqu'à 2 master classes de test seront dirigées par Maxim Sosnov (SKB Kontur), un lead developer, un moteur d'une culture d'excellence technique qui s'efforce d'être agile et conforme à la philosophie DevOps. Maxim vous expliquera ce que sont les modèles et les anti-modèles, comment faire des tests utiles et comment vendre des tests à une équipe afin que les développeurs ne se montrent pas trop.
Master class 1. Test des services nodejs-web
Dans le premier master class, Maxim montrera comment tester correctement un service nodejs. Comment obtenir des tests fonctionnels fiables à l'aide de moka, chai, nock, supertest, en utilisant les meilleures pratiques de test et le bon sens. Voyons comment ces tests aident à la refactorisation.
Master class 2. Tests d'interface utilisateur
En collaboration avec Maxim, nous adapterons les meilleures pratiques de test à la mise en page et déterminerons quelle combinaison de tests est idéale pour les tests d'interface utilisateur. Il couvrira des pratiques telles que les tests de capture d'écran et les tests fonctionnels et comment les intégrer facilement dans votre processus de développement. Outils d'occasion:
- livre de contes
- loki.js
- test-bibliothèque
- plaisanter
Nice et rapide
Qu'arrive-t-il à l'utilisateur lorsqu'il ouvre l'application? Attend-il 2 minutes après chaque clic ou se plonge-t-il joyeusement dans le travail?
De nos jours, les performances ne sont plus améliorées rétroactivement, mais par le développement. Les développeurs vérifient immédiatement comment les décisions architecturales affectent la vitesse de chargement, le rendu, l'interactivité, etc. Cela nécessite une surveillance constante. Les tests et les mesures nécessitent des métriques qui dépendent d'un grand nombre de paramètres. Par exemple, sur quel appareil, dans quel navigateur, sur quel réseau et avec quel pare-feu l'utilisateur a-t-il ouvert l'application? Sans parler des serveurs de transfert, des caches, des proxys et d'autres détails. Et même après tous ces efforts, l'accélération reste un problème et un casse-tête pour les développeurs.
Malgré toutes ces difficultés,Nikolay Ryabov (Avito) , s'occupe de tout ce qui concerne les performances du frontend à l'intérieur d'Avito - collecte de métriques, profilage, optimisation. Nikolay est convaincu que la tâche d'une entreprise est de créer des fonctionnalités efficacement.
Lors de la conférence, Nikolai proposera de combiner les capacités de Lighthouse, Webpack-bundle-analyzer et Chrome DevTools Performance dans un seul outil. Découvrez pourquoi cet ensemble d'outils à lui seul ne vous aidera pas à surveiller les performances de manière continue.
Victor Rusakovich (GP Solutions), un développeur frontend qui a vu de nombreux frameworks et bibliothèques, travaillant avec jQuery, Backbone, Knockout, Angular, Elm, Clojure et RxJS et enfin React. Victor parlera en détail des mesures et des outils de collecte de statistiques sur les performances des sites clients, des conclusions qui peuvent être tirées, de la manière dont les statistiques collectent non seulement des données, mais améliorent également la vitesse des sites.
Les auditeurs du rapport recevront des réponses aux questions:
- Que collectons-nous et comment collectons-nous?
- Comment et pourquoi analysons-nous?
- Pourquoi collecter des statistiques auprès des utilisateurs?
- Comment savez-vous à quelle vitesse votre site se charge et fonctionne?
- Pourquoi se soucier de la vitesse du site Web?
Vitaly Sysolyatin (Delivery Club) , techlead, développeur JavaScript et frontend, vous expliquera comment rendre SSR aussi rapide que possible et quels problèmes vous devrez résoudre. Un exemple est le nouveau site delivery-club.ru, qui a été lancé en tant qu'application à page unique avec l'implémentation de rendu côté serveur.
Vitaly vous dira quel type de rake ils ont traversé, et quel sera le problème pour un développeur frontend en javascript dans un environnement serveur. En collaboration avec Vitaly, nous allons apprendre à contourner les faiblesses de JavaScript pour l'efficacité de l'application. De vraies histoires seront là aussi!
Alexander Baltsevich (Synesis), blogueuse principale et scientifique qui pratique des expériences éducatives. Sur Frontend Live, Alexander expliquera comment React atteint 60 fps même avec un énorme flux de mises à jour toutes les secondes. Voyons comment React a atteint la vitesse de comparaison O (n) avec les algorithmes les plus avancés avec des comparaisons d'arbres de l'ordre de O (n ^ 3).
Et bien sûr, nous verrons des exemples de combat sur la façon dont vous pouvez vous tirer une balle dans le pied avec une telle accélération!
Magnifiquement carré
Le cerveau du développeur et de l'utilisateur fonctionne sur des ondes différentes. Le premier trouvera la fonctionnalité géniale, tandis que le second sera tout simplement confus en essayant de modifier le nombre d'articles dans le panier. Et ce que veut l'utilisateur semble insupportablement simple pour un génie. Pourtant, les développeurs utilisent également des applications et souffrent de la même manière lorsque le design, l'interface ou même la couleur les empêchent de mettre la main sur ce qu'ils ont commandé. Dans la piste de conception, il y aura des rapports sur la couleur et l'interface pour les utilisateurs.
Glafira Zhur (SpurIT), chef d'équipe et développeur d'accessibilité, passionné par les interfaces et leur accessibilité dès le plus jeune âge. Sur Frontend Live, il parlera de l'impact psychologique de la couleur, qui ne dépend pas de la mode, des tendances et du caprice du client. Il révélera comment la couleur de l'interface affecte la perception des informations et comment les développeurs peuvent l'utiliser pour contrôler l'humeur, le choix et l'expérience client.
Nous découvrirons également l'accessibilité des interfaces en termes de solutions couleur.
Anna Selezneva (Spiral Scout) , développeur frontend créatif, conférencière lors de conférences et de rencontres, co-organisatrice de rencontres MinskCSS et MinskJS et de conférences CSSMinskJS. Anna vous rappellera que nous développons des interfaces utilisateur -. Nous apprendrons à garder à l'esprit l'idée que de vraies personnes l'utiliseront lors de la mise en œuvre d'une interface.
Selon Anna, «il y a 10 ans, notre problème était les coins arrondis entre les navigateurs, et maintenant nous devons rendre le site réactif, accessible et efficace».
Enfin, Vitaly Fridman (Smashing Magazine) , co-fondateur du magazine en ligne, auteur de livres et consultant frontend / UX avec un large éventail d' intérêts, parlera de l'impact de la commodité du service sur les conversions et les principaux indicateurs commerciaux . La conférence de Vitaly portera sur le développement de formulaires Web pour l'utilisateur final, qui détermine souvent la commodité de l'ensemble du service précisément par eux.
Les formulaires Web sont souvent inaccessibles et difficiles à utiliser, et Vitaliy décrira les problèmes typiques que les clients rencontrent trop souvent. Enfin, nous allons apprendre à créer une interface qui nous permet de recevoir des informations du client de manière conviviale, aidant ainsi à la fois les conversions et augmentant les indicateurs clés de l'entreprise.
Consultez la liste complète des rapports sur le site Web de la conférence . Dans la version mobile du site, vous pouvez ajouter les conférences que vous aimez à votre emploi du temps. N'oubliez pas de réserver votre billet (les prix augmenteront le 15 septembre).
Frontend en direct 2020aura lieu du 23 septembre 2020 au 2 octobre 2020 en ligne dans le monde entier. Nous avons créé un nouveau format pour cela, qui est aussi efficace que les réunions hors ligne. Vous pouvez ressentir l'énergie de la communauté, la recharger, faire du réseautage avec des pairs de l'industrie et obtenir des conseils d'experts. Vous pouvez même organiser une afterparty en ligne avec des vélos jusqu'au matin pour votre vie et votre carrière. Tout est comme dans la vie :) Le
planning de chaque journée est déjà établi, mais de petits changements sont possibles. Et nous écrirons sur les puces événementielles de la conférence dans télégramme , Facebook , Twitter et VKontakte .