{"id":319487,"date":"2021-03-12T21:00:16","date_gmt":"2021-03-12T21:00:16","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=319487"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=319487","title":{"rendered":"\u0423\u0434\u0432\u043e\u0439\u0442\u0435 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043e\u0434\u0430 \u043d\u0430 React \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u044d\u0442\u0438\u0445 \u043f\u0440\u043e\u0441\u0442\u044b\u0445 \u0442\u0440\u044e\u043a\u043e\u0432"},"content":{"rendered":"\n<div class=\"post__text post__text_v2\" id=\"post-content-body\">\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/a79\/906\/6e0\/a799066e0f5be75e2e0b75dd75ab8f6e.png\" alt=\"\" title=\"\" width=\"875\" height=\"553\"><figcaption><\/figcaption><\/figure>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442\u0435 \u0441 React \u0438\u043b\u0438 React Native \u0438 \u0447\u0443\u0432\u0441\u0442\u0432\u0443\u0435\u0442\u0435, \u0447\u0442\u043e \u0443 \u0432\u0430\u0441 \u043c\u0435\u0434\u043b\u0435\u043d\u043d\u0430\u044f \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043e\u0434\u0430, \u0432\u044b \u0442\u0440\u0430\u0442\u0438\u0442\u0435 \u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u043f\u043e\u0438\u0441\u043a \u043e\u0448\u0438\u0431\u043e\u043a, \u0430 \u043d\u0435 \u043d\u0430 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043d\u043e\u0432\u043e\u0433\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u0430, \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442\u0435 \u0441 \u0431\u043e\u043b\u044c\u0448\u0438\u043c\u0438 \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u043c\u0438 \u0444\u0430\u0439\u043b\u0430\u043c\u0438 \u0438 \u0432\u0430\u043c \u0441\u043b\u043e\u0436\u043d\u043e \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c \u043d\u0443\u0436\u043d\u044b\u0435 \u0447\u0430\u0441\u0442\u0438 \u043a\u043e\u0434\u0430, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043c\u043d\u043e\u0433\u043e\u043a\u0440\u0430\u0442\u043d\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u0442\u0435 \u043e\u0434\u043d\u0443 \u0438 \u0442\u0443 \u0436\u0435 \u043b\u043e\u0433\u0438\u043a\u0443, \u0442\u043e \u044d\u0442\u0430 \u0441\u0442\u0430\u0442\u044c\u044f \u0434\u043b\u044f \u0432\u0430\u0441. \u0412\u044b \u0443\u0434\u0432\u043e\u0438\u0442\u0435 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043e\u0434\u0430, \u0435\u0441\u043b\u0438 \u043e\u0442\u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u0442\u0435 \u043a\u043e\u0434 \u0432 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438. <\/p>\n<p>\u041c\u044b \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c React \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u043e\u0436\u043d\u043e \u0445\u043e\u0440\u043e\u0448\u043e \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c. \u0418 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0448\u0430\u0433 \u0437\u0430 \u0448\u0430\u0433\u043e\u043c \u0440\u0435\u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u044b\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u0434\u043e \u0445\u043e\u0440\u043e\u0448\u0435\u0433\u043e \u0443\u0440\u043e\u0432\u043d\u044f. \u0412\u044b \u0443\u0432\u0438\u0434\u0438\u0442\u0435 \u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0438\u0434\u0435\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u0432\u044b\u0441\u044f\u0442 \u0432\u0430\u0448\u0443 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043e\u0434\u0430.<\/p>\n<blockquote>\n<p>\u0421 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u043c\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u043c\u0438 \u0438 \u0445\u0443\u043a\u0430\u043c\u0438 \u043b\u0435\u0433\u043a\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0447\u0442\u043e-\u0442\u043e \u043f\u043e\u0442\u0440\u044f\u0441\u0430\u044e\u0449\u0435\u0435. \u042d\u0442\u043e \u043f\u043e\u0445\u043e\u0436\u0435 \u043d\u0430 \u0441\u0431\u043e\u0440\u043a\u0443 \u0447\u0430\u0441\u0442\u0435\u0439 Lego.<\/p>\n<p>\u2013 <a href=\"https:\/\/medium.com\/u\/e986f7cdb458?source=post_page-----ca2e47d1bf97--------------------------------\">Cory House<\/a>. <a href=\"https:\/\/medium.com\/@housecor\/designing-reusable-react-components-1cbeb897b048\">\u041f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 React<\/a><\/p>\n<\/blockquote>\n<blockquote>\n<p>\u0420\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433, \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433 \u0438 \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433 \u2013 \u044d\u0442\u043e \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e; \u0432\u0430\u043c \u043f\u0440\u0438\u0434\u0451\u0442\u0441\u044f \u043c\u0435\u043d\u044f\u0442\u044c \u0441\u0432\u043e\u0439 \u043a\u043e\u0434 \u043c\u043d\u043e\u0433\u043e-\u043c\u043d\u043e\u0433\u043e \u0440\u0430\u0437; \u044d\u0442\u043e \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 \u043f\u0440\u043e\u0446\u0435\u0441\u0441 \u043e\u0431\u0443\u0447\u0435\u043d\u0438\u044f.<\/p>\n<p>\u2014<a href=\"https:\/\/medium.com\/u\/ac4e83345a52?source=post_page-----ca2e47d1bf97--------------------------------\">Tomas Eglinskas<\/a>. <a href=\"https:\/\/medium.com\/free-code-camp\/mindset-lessons-from-a-year-with-react-1de862421981#3bb9\">\u0421\u0430\u043c\u044b\u0435 \u0432\u0430\u0436\u043d\u044b\u0435 \u0443\u0440\u043e\u043a\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u044f \u0438\u0437\u0432\u043b\u0451\u043a \u0437\u0430 \u0433\u043e\u0434 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 React<\/a><\/p>\n<\/blockquote>\n<ul>\n<li>\n<p>\u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u0431\u0443\u0434\u0435\u0442 \u043c\u043d\u043e\u0433\u043e \u043a\u043e\u0434\u0430 \u043d\u0430 React. \u041d\u0435 \u0431\u043e\u0439\u0442\u0435\u0441\u044c \u043a\u043e\u0434\u0430. \u041d\u0435 \u0442\u043e\u0440\u043e\u043f\u0438\u0442\u0435\u0441\u044c, \u043f\u0440\u043e\u0447\u0442\u0438\u0442\u0435 \u0438 \u043f\u043e\u0439\u043c\u0438\u0442\u0435 \u0435\u0433\u043e.&nbsp;<\/p>\n<\/li>\n<li>\n<p>\u042d\u0442\u043e \u0431\u043e\u043b\u044c\u0448\u0430\u044f \u0441\u0442\u0430\u0442\u044c\u044f. \u0421\u043e\u0434\u0435\u0440\u0436\u0430\u043d\u0438\u0435 \u0432\u0441\u0435\u043e\u0431\u044a\u0435\u043c\u043b\u044e\u0449\u0435\u0435. \u041d\u0435 \u0441\u0442\u0435\u0441\u043d\u044f\u0439\u0442\u0435\u0441\u044c \u0441\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c \u044d\u0442\u0443 \u0441\u0442\u0430\u0442\u044c\u044e \u0432 \u0441\u0432\u043e\u0438\u0445 \u0432\u043a\u043b\u0430\u0434\u043a\u0430\u0445 \u0438 \u043f\u0440\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u0435\u0451 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0440\u0430\u0437.<\/p>\n<\/li>\n<li>\n<p>\u0414\u0430\u0436\u0435 \u043d\u0435\u0441\u043c\u043e\u0442\u0440\u044f \u043d\u0430 \u0442\u043e, \u0447\u0442\u043e \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u0442 \u043d\u0430 React Native, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043b\u0435\u0433\u043a\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u044d\u0442\u0443 \u0441\u0442\u0430\u0442\u044c\u044e, \u0447\u0442\u043e\u0431\u044b \u0443\u043b\u0443\u0447\u0448\u0438\u0442\u044c \u0441\u0432\u043e\u0438 \u043d\u0430\u0432\u044b\u043a\u0438 React.<\/p>\n<\/li>\n<\/ul>\n<h2>\u0418\u0441\u0445\u043e\u0434\u043d\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u0442\u044c<\/h2>\n<p>\u041f\u0440\u043e\u0441\u0442\u043e\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442, \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u043d\u044b\u0439 \u0442\u0430\u043a\u0438\u043c \u0436\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u043c, \u043a\u0430\u043a \u0432\u044b. \u0427\u0442\u043e \u043e\u043d \u0434\u0435\u043b\u0430\u0435\u0442:<\/p>\n<ul>\n<li>\n<p>\u041f\u043e\u043b\u0443\u0447\u0430\u0435\u0442 \u0441\u043f\u0438\u0441\u043e\u043a \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432 \u0441 \u0441\u0435\u0440\u0432\u0435\u0440\u0430.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u00ab\u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438\u00bb \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d\u043d\u044b\u0439 \u0441\u043f\u0438\u0441\u043e\u043a \u0432 \u0432\u0438\u0434\u0435 \u0441\u043f\u0438\u0441\u043a\u0430 \u043a\u0430\u0440\u0442\u043e\u0447\u0435\u043a.<\/p>\n<\/li>\n<li>\n<p>\u041a\u043e\u0433\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043d\u0430\u0436\u0438\u043c\u0430\u0435\u0442 \u043d\u0430 \u043a\u0430\u0440\u0442\u043e\u0447\u043a\u0443, \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0435 \u043e\u043a\u043d\u043e \u0441 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u044b\u043c \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435\u043c \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430.<\/p>\n<\/li>\n<\/ul>\n<h3>\u042d\u0442\u043e\u0442 \u043a\u043e\u0434 \u043f\u043e\u0445\u043e\u0436 \u043d\u0430 \u0432\u0430\u0448?<\/h3>\n<p><iframe id=\"604b78c895bc5d2dedbee1b2\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b78c895bc5d2dedbee1b2\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<h2>\u0427\u0435\u043c \u0445\u043e\u0440\u043e\u0448 \u044d\u0442\u043e\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442:<\/h2>\n<ul>\n<li>\n<p>\u041e\u043d \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442: \u0441\u043f\u0438\u0441\u043e\u043a \u0431\u0443\u0434\u0435\u0442 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d \u0438 \u043f\u043e\u043a\u0430\u0437\u0430\u043d \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e \u0441\u043e \u0432\u0441\u0435\u043c\u0438 \u043e\u043f\u0438\u0441\u0430\u043d\u043d\u044b\u043c \u0432\u044b\u0448\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u043e\u043c.<\/p>\n<\/li>\n<li>\n<p>\u041e\u043d \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 React Hooks.<\/p>\n<\/li>\n<\/ul>\n<h2>\u0427\u0442\u043e \u043f\u043b\u043e\u0445\u043e\u0433\u043e \u0432 \u044d\u0442\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435<\/h2>\n<p>\u042d\u0442\u043e\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f <strong>\u043c\u043e\u043d\u043e\u043b\u0438\u0442\u043e\u043c<\/strong>, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043e\u043d \u0431\u044b\u043b \u0441\u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d \u0438 \u043d\u0430\u043f\u0438\u0441\u0430\u043d \u0434\u043b\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0432 \u043e\u0434\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435 \u0432 \u043e\u0434\u043d\u043e\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u0438\u043d \u0440\u0430\u0437.<\/p>\n<p><strong>\u0417\u0430\u043f\u043e\u043c\u043d\u0438\u0442\u0435 \u044d\u0442\u0443 \u043c\u0430\u043d\u0442\u0440\u0443:<\/strong><\/p>\n<p>\u0418\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u0431\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 \u2013 \u044d\u0442\u043e \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u043f\u0438\u0441\u0430\u0442\u044c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438.<\/p>\n<p>\u0427\u0435\u043c \u0431\u043e\u043b\u044c\u0448\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0435\u0439 \u0434\u043b\u044f \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0432\u0430\u0448\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0439, \u0442\u0435\u043c \u0432\u044b \u0431\u044b\u0441\u0442\u0440\u0435\u0435. \u042d\u0442\u043e \u0434\u0430\u0451\u0442 \u0432\u0430\u043c \u043e\u0433\u0440\u043e\u043c\u043d\u043e\u0435 \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u043e:<\/p>\n<ul>\n<li>\n<p><strong>\u0412\u044b \u0442\u0440\u0430\u0442\u0438\u0442\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/strong> \u041f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b\/\u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u043c\u043e\u0433\u0443\u0442 \u0441\u043a\u0440\u044b\u0432\u0430\u0442\u044c \u0442\u043e\u043d\u043d\u044b \u043a\u043e\u0434\u0430 \u0432\u043d\u0443\u0442\u0440\u0438 \u0441\u0435\u0431\u044f \u0438 \u043c\u043e\u0433\u0443\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0441\u043e\u0442\u043d\u0438 \u0440\u0430\u0437. \u0410 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0438\u0445 \u043d\u0443\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u0438\u043d \u0440\u0430\u0437. \u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u044c\u0442\u0435, \u0447\u0442\u043e \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437, \u043a\u043e\u0433\u0434\u0430 \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u043e\u0431\u0440\u0430\u0442\u0438\u0442\u044c\u0441\u044f \u043a API, \u0432\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 \u00abfetch(URL)\u00bb, \u0430 \u044d\u0442\u043e \u0437\u0430\u043c\u0435\u0434\u043b\u044f\u0435\u0442 \u0432\u0430\u0448\u0443 \u0440\u0430\u0431\u043e\u0442\u0443.<\/p>\n<\/li>\n<li>\n<p><strong>\u0412\u044b \u0442\u0440\u0430\u0442\u0438\u0442\u0435 \u0435\u0449\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/strong> \u0413\u043e\u0440\u0430\u0437\u0434\u043e \u0431\u044b\u0441\u0442\u0440\u0435\u0435 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u043d\u043e\u0432\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0432 \u043e\u0434\u043d\u043e \u043c\u0435\u0441\u0442\u043e, \u0447\u0435\u043c \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u0438\u0445 \u0432 10 \u0440\u0430\u0437\u043d\u044b\u0445 \u043c\u0435\u0441\u0442. \u0415\u0441\u043b\u0438 \u0432\u044b \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 \u0441\u0432\u043e\u0438 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438, \u0443 \u0432\u0430\u0441 \u0431\u0443\u0434\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u043d\u043e \u043c\u0435\u0441\u0442\u043e \u0434\u043b\u044f \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0432\u0430\u0448\u0438\u0445 \u0444\u0443\u043d\u043a\u0446\u0438\u0439. \u0420\u0435\u0430\u043b\u0438\u0437\u0443\u0439\u0442\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0432 \u043e\u0434\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435, \u0430 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0439\u0442\u0435 \u0432\u0435\u0437\u0434\u0435.<\/p>\n<\/li>\n<li>\n<p><strong>\u0412\u044b \u0442\u0440\u0430\u0442\u0438\u0442\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u043f\u043e\u0438\u0441\u043a \u043e\u0448\u0438\u0431\u043e\u043a.<\/strong> \u0412\u044b \u0431\u0443\u0434\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0443\u0436\u0435 \u043f\u0440\u043e\u0432\u0435\u0440\u0435\u043d\u043d\u044b\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438. \u041d\u043e\u0432\u044b\u0439 \u043a\u043e\u0434 \u043d\u0443\u0436\u043d\u043e \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c, \u043d\u043e \u0441\u0442\u0430\u0440\u043e\u043c\u0443 \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0432\u0435\u0440\u044f\u0442\u044c.<\/p>\n<\/li>\n<li>\n<p><strong>\u0412\u044b \u0442\u0440\u0430\u0442\u0438\u0442\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u0447\u0442\u0435\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/strong> \u0415\u0441\u043b\u0438 \u0432\u044b \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u0431\u043b\u043e\u043a, \u044d\u0442\u043e \u0441\u044d\u043a\u043e\u043d\u043e\u043c\u0438\u0442 \u0432\u0430\u0448\u0435 \u0432\u0440\u0435\u043c\u044f \u043d\u0430 \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430. \u041b\u0435\u0433\u0447\u0435 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u044b \u0438\u0437 \u0437\u043d\u0430\u043a\u043e\u043c\u044b\u0445 \u0447\u0430\u0441\u0442\u0435\u0439.<\/p>\n<\/li>\n<li>\n<p><strong>\u0412\u044b \u0442\u0440\u0430\u0442\u0438\u0442\u0435 \u0435\u0449\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u0447\u0442\u0435\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/strong> \u041e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438 \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u0444\u0430\u0439\u043b\u0430\u0445, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u044b \u0431\u0443\u0434\u0435\u0442\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0441 \u043c\u0435\u043d\u044c\u0448\u0438\u043c\u0438 \u043c\u043e\u0434\u0443\u043b\u044f\u043c\u0438 \u0438 \u043d\u0430 \u0432\u0430\u0448\u0435\u043c \u044d\u043a\u0440\u0430\u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u043c\u0435\u043d\u044c\u0448\u0435 \u043a\u043e\u0434\u0430. \u0422\u0430\u043a\u0436\u0435 \u044d\u0442\u043e \u0443\u043b\u0443\u0447\u0448\u0438\u0442 \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u0432\u0430\u0448\u0435\u0433\u043e \u043a\u043e\u0434\u0430.<\/p>\n<\/li>\n<\/ul>\n<p>\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u043e\u0431\u044b\u0447\u043d\u043e \u0442\u0440\u0430\u0442\u0438\u0442 \u0431\u043e\u043b\u044c\u0448\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u0432\u044b\u044f\u0441\u043d\u0435\u043d\u0438\u0435 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u0434\u0435\u043b\u0430\u0435\u0442 \u043a\u043e\u0434, \u0430 \u043d\u0435 \u043d\u0430 \u0435\u0433\u043e \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435. \u2013 <a href=\"https:\/\/medium.com\/u\/f9f631989d8e?source=post_page-----ca2e47d1bf97--------------------------------\">Alexis Mangin<\/a>. <a href=\"https:\/\/medium.com\/@alexmngn\/why-react-developers-should-modularize-their-applications-d26d381854c1\">\u041f\u043e\u0447\u0435\u043c\u0443 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 React \u0434\u043e\u043b\u0436\u043d\u044b \u0440\u0430\u0437\u0431\u0438\u0432\u0430\u0442\u044c \u0441\u0432\u043e\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0430 \u043c\u043e\u0434\u0443\u043b\u0438?<\/a><\/p>\n<ul>\n<li>\n<p><strong>\u0412\u044b \u043f\u0438\u0448\u0435\u0442\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u0442\u0435\u0441\u0442\u043e\u0432 \u0434\u043b\u044f \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0431\u043b\u043e\u043a\u043e\u0432.<\/strong> \u0422\u0435\u0441\u0442\u044b \u0434\u0435\u043b\u0430\u044e\u0442 \u0432\u0430\u0448\u0443 \u0436\u0438\u0437\u043d\u044c \u0441\u043b\u0430\u0434\u043a\u043e\u0439, \u043a\u0430\u043a \u043c\u0451\u0434, \u043d\u043e \u0441 \u043c\u043e\u043d\u043e\u043b\u0438\u0442\u043e\u043c \u0432\u044b \u043e\u0431\u043d\u0430\u0440\u0443\u0436\u0438\u0442\u0435, \u0447\u0442\u043e \u0441\u043d\u043e\u0432\u0430 \u0438 \u0441\u043d\u043e\u0432\u0430 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442\u0435 \u043e\u0434\u043d\u0443 \u0438 \u0442\u0443 \u0436\u0435 \u043b\u043e\u0433\u0438\u043a\u0443. \u0411\u043e\u043b\u044c\u0448\u0435 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0431\u043b\u043e\u043a\u043e\u0432 = \u043c\u0435\u043d\u044c\u0448\u0435 \u0442\u0435\u0441\u0442\u043e\u0432.<\/p>\n<\/li>\n<\/ul>\n<p>\u041c\u043e\u043d\u043e\u043b\u0438\u0442 = \u043c\u0435\u0434\u043b\u0435\u043d\u043d\u043e\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/p>\n<p>\u041c\u043d\u043e\u0433\u043e\u0440\u0430\u0437\u043e\u0432\u044b\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438 = \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/p>\n<h2>\u041a\u0430\u043a \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u044d\u0442\u0438 100 \u0441\u0442\u0440\u043e\u043a \u043a\u043e\u0434\u0430 \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0438\u0433\u043e\u0434\u043d\u044b\u043c\u0438 \u0434\u043b\u044f \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f<\/h2>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0441\u043d\u0430\u0447\u0430\u043b\u0430 \u043f\u043e\u043f\u0440\u043e\u0431\u0443\u0435\u043c \u0447\u0442\u043e-\u043d\u0438\u0431\u0443\u0434\u044c \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0431\u0430\u0437\u043e\u0432\u043e\u0435 \u0438 \u043f\u0440\u043e\u0441\u0442\u043e\u0435, \u0430 \u0437\u0430\u0442\u0435\u043c \u043f\u0435\u0440\u0435\u0439\u0434\u0451\u043c \u043a \u0431\u043e\u043b\u0435\u0435 \u0441\u043b\u043e\u0436\u043d\u044b\u043c \u0432\u0435\u0449\u0430\u043c. \u041a\u0430\u043a \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0440\u0430\u0441\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c \u044d\u0442\u0438 100 \u0441\u0442\u0440\u043e\u043a \u0432 \u0440\u0430\u0437\u043d\u044b\u0435 \u043c\u0435\u0441\u0442\u0430?<\/p>\n<h2>\u041f\u0435\u0440\u0435\u043d\u0435\u0441\u0442\u0438 \u043a\u043e\u043d\u0441\u0442\u0430\u043d\u0442\u044b \u0432 \u043f\u0440\u043e\u043f\u0441\u044b \u0432\u0430\u0448\u0435\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430<\/h2>\n<p><iframe id=\"604b78afaa2e6ed27439fa27\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b78afaa2e6ed27439fa27\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u041c\u044b \u043f\u0435\u0440\u0435\u043c\u0435\u0441\u0442\u0438\u043b\u0438 \u043a\u043e\u043d\u0441\u0442\u0430\u043d\u0442\u0443 URL-\u0430\u0434\u0440\u0435\u0441\u0430 \u0432 \u043f\u0440\u043e\u043f\u0441\u044b \u0438 \u0443\u0436\u0435 \u043c\u043e\u0436\u0435\u043c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 Browser \u0441 \u0434\u0440\u0443\u0433\u0438\u043c URL-\u0430\u0434\u0440\u0435\u0441\u043e\u043c. \u041d\u0435\u0441\u043e\u043c\u043d\u0435\u043d\u043d\u043e, \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u0432\u043b\u0438\u044f\u043d\u0438\u0435 \u043d\u0430 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435, \u043d\u043e \u044d\u0442\u043e \u043e\u0447\u0435\u043d\u044c \u043b\u0435\u0433\u043a\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c.<\/p>\n<p>\u0420\u0430\u0437\u043e\u0433\u0440\u0435\u043b\u0438\u0441\u044c? \u0422\u043e\u0433\u0434\u0430 \u0434\u0430\u0432\u0430\u0439 \u043f\u043e\u043f\u0440\u043e\u0431\u0443\u0435\u043c \u0447\u0442\u043e-\u043d\u0438\u0431\u0443\u0434\u044c \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043a\u0440\u0443\u0442\u043e\u0435.<\/p>\n<h2>\u0420\u0430\u0437\u0434\u0435\u043b\u0438\u0442\u0435 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0443 \u0438 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441<\/h2>\n<blockquote>\n<p>\u0416\u0438\u0437\u043d\u044c \u043f\u0440\u043e\u0449\u0435, \u043a\u043e\u0433\u0434\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 \u043d\u0435 \u0437\u043d\u0430\u044e\u0442 \u043e \u0441\u0435\u0442\u0438, \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0435 \u0438\u043b\u0438 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u044f \u043e\u0434\u043d\u0438 \u0438 \u0442\u0435 \u0436\u0435 \u043f\u0440\u043e\u043f\u0441\u044b, \u0432\u0441\u0435\u0433\u0434\u0430 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0439\u0442\u0435 \u043e\u0434\u043d\u0438 \u0438 \u0442\u0435 \u0436\u0435 \u0434\u0430\u043d\u043d\u044b\u0435. \u2013 <a href=\"https:\/\/medium.com\/u\/c359511de780?source=post_page-----ca2e47d1bf97--------------------------------\">Eric Elliott<\/a>, <a href=\"https:\/\/medium.com\/javascript-scene\/the-missing-introduction-to-react-62837cb2fd76\">\u041d\u0435\u0434\u043e\u0441\u0442\u0430\u044e\u0449\u0435\u0435 \u0432\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0432 React<\/a><\/p>\n<\/blockquote>\n<p><strong>\u042d\u0442\u043e \u0441\u0430\u043c\u0430\u044f \u0432\u0430\u0436\u043d\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0441\u0442\u0430\u0442\u044c\u0438.<\/strong> \u0415\u0441\u043b\u0438 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0432\u044b\u0443\u0447\u0438\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u043d\u0443 \u0432\u0435\u0449\u044c, \u043f\u0443\u0441\u0442\u044c \u0435\u044e \u0431\u0443\u0434\u0435\u0442 \u043e\u043d\u0430:<\/p>\n<p>\u0418\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u0431\u044b\u0442\u044c \u0431\u044b\u0441\u0442\u0440\u044b\u043c React-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u043c \u2013 \u044d\u0442\u043e \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u043e\u0442\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0438 \u043e\u0442 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<p>\u0423\u0445 \u0442\u044b, \u043a\u0430\u043a\u043e\u0439 \u0432\u0441\u043f\u043b\u0435\u0441\u043a \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438! \u041d\u0435 \u0431\u043e\u0439\u0442\u0435\u0441\u044c, \u044f \u043d\u0430\u0443\u0447\u0443 \u0432\u0430\u0441.<\/p>\n<p><strong>\u0411\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0430:<\/strong> \u043b\u043e\u0433\u0438\u043a\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0440\u0435\u0448\u0435\u043d\u0438\u044f \u0438 \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u0435\u0442 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: \u0432\u0441\u0451, \u0447\u0442\u043e \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432 &lt;Browsers \/&gt; \u0432\u044b\u0448\u0435 \u043a\u043b\u044e\u0447\u0435\u0432\u043e\u0433\u043e \u0441\u043b\u043e\u0432\u0430 <strong>return<\/strong>.<\/p>\n<p><strong>\u0418\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441:<\/strong> \u0432\u0441\u0451, \u0447\u0442\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 \u0438 \u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0435\u0442 \u0432\u0432\u043e\u0434 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f: \u0432\u0441\u0451, \u0447\u0442\u043e \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 <strong>return(\u2026)<\/strong><\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0441\u0434\u0435\u043b\u0430\u0435\u043c \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u0448\u0430\u0433 \u0432\u043f\u0435\u0440\u0451\u0434 \u0438 \u0440\u0430\u0437\u0434\u0435\u043b\u0438\u043c \u043d\u0430\u0448 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043d\u0430 2 \u0447\u0430\u0441\u0442\u0438, \u0430 \u0437\u0430\u0442\u0435\u043c \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c, \u043a\u0430\u043a \u044d\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u0435\u0442 \u043d\u0430\u0448 \u043a\u043e\u0434 \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0438\u0433\u043e\u0434\u043d\u044b\u043c \u0434\u043b\u044f \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f.<\/p>\n<p><strong>\u0427\u0442\u043e \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0434\u0435\u043b\u0430\u0442\u044c:<\/strong><\/p>\n<ul>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0439 \u0445\u0443\u043a useBrowsers() \u0434\u043b\u044f \u043d\u0430\u0448\u0435\u0439 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0438.<\/p>\n<\/li>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 &lt;BrowsersList \/&gt; \u0441 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e\u043c \u043f\u0440\u043e\u043f\u0441\u043e\u0432 \u0434\u043b\u044f \u043d\u0430\u0448\u0435\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<\/li>\n<\/ul>\n<p><iframe id=\"604b789a30f707d266c0ec9a\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b789a30f707d266c0ec9a\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u0425\u043e\u0440\u043e\u0448\u043e, \u043d\u0430\u0448 \u043a\u043e\u0434 \u0434\u0430\u043b\u0451\u043a \u043e\u0442 \u0441\u043e\u0432\u0435\u0440\u0448\u0435\u043d\u0441\u0442\u0432\u0430, \u043d\u043e \u0441\u0442\u0430\u043b \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0438\u0433\u043e\u0434\u043d\u044b\u043c \u0434\u043b\u044f \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f:<\/p>\n<ul>\n<li>\n<p>\u041c\u044b \u043c\u043e\u0436\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c &lt;BrowsersList \/&gt; \u0441 \u0434\u0440\u0443\u0433\u0438\u043c \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u043e\u043c \u0434\u0430\u043d\u043d\u044b\u0445. \u0420\u0430\u043d\u044c\u0448\u0435 \u043c\u044b \u0431\u044b\u043b\u0438 \u043e\u0431\u044f\u0437\u0430\u043d\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0441 \u043e\u0434\u043d\u043e\u0433\u043e \u043c\u0435\u0441\u0442\u0430, \u043d\u043e \u0442\u0435\u043f\u0435\u0440\u044c \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0438\u0445 \u0438\u0437 \u043f\u0430\u043c\u044f\u0442\u0438, \u0441 \u0434\u0438\u0441\u043a\u0430 \u0438\u043b\u0438 \u043b\u044e\u0431\u043e\u0433\u043e \u0434\u0440\u0443\u0433\u043e\u0433\u043e \u043c\u0435\u0441\u0442\u0430.<\/p>\n<\/li>\n<li>\n<p>\u041c\u044b \u043c\u043e\u0436\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c useBrowsers() \u0441 \u0434\u0440\u0443\u0433\u0438\u043c \u044d\u043a\u0440\u0430\u043d\u043e\u043c \u0438\u043b\u0438 \u0434\u0430\u0436\u0435 \u0431\u0435\u0437 \u044d\u043a\u0440\u0430\u043d\u0430. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c useBrowsers() \u0432 \u0434\u0440\u0443\u0433\u043e\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0441 \u0434\u0440\u0443\u0433\u0438\u043c \u0434\u0438\u0437\u0430\u0439\u043d\u043e\u043c.<\/p>\n<\/li>\n<\/ul>\n<p>\u041d\u043e \u043d\u0430\u0448 \u0440\u0430\u0437\u0434\u0435\u043b\u0451\u043d\u043d\u044b\u0439 \u043a\u043e\u0434 \u0434\u0430\u043b\u0451\u043a \u043e\u0442 \u0441\u043e\u0432\u0435\u0440\u0448\u0435\u043d\u0441\u0442\u0432\u0430! \u041c\u044b \u0432\u0441\u0451 \u0435\u0449\u0451 \u043c\u043e\u0436\u0435\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u044d\u0442\u043e\u0442 \u043a\u043e\u0434 \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0438\u0433\u043e\u0434\u043d\u044b\u043c \u0434\u043b\u044f \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f.<\/p>\n<p>\u041f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438 = \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/p>\n<h2>\u0420\u0430\u0437\u0434\u0435\u043b\u0438\u0442\u0435 \u0441\u0432\u043e\u0439 \u043a\u043e\u0434 \u043d\u0430 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u0445 \u0444\u0430\u0439\u043b\u043e\u0432<\/h2>\n<p>\u041f\u0435\u0440\u0432\u043e-\u043d\u0430\u043f\u0435\u0440\u0432\u043e. \u0420\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u043c\u043e\u043d\u043e\u043b\u0438\u0442\u0430 \u043d\u0430 2 \u0447\u0430\u0441\u0442\u0438 \u043e\u0442\u043a\u0440\u044b\u043b\u043e \u043d\u043e\u0432\u044b\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u0434\u043b\u044f \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0430. \u041c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043d\u0430\u0448\u0443 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0443 \u0431\u043e\u043b\u0435\u0435 \u0447\u0438\u0442\u0430\u0435\u043c\u043e\u0439 (\u0430 \u0432\u0430\u0441 \u2013 \u0431\u044b\u0441\u0442\u0440\u0435\u0435), \u0435\u0441\u043b\u0438 \u0440\u0430\u0437\u0434\u0435\u043b\u0438\u043c \u043d\u0430\u0448 \u043a\u043e\u0434 \u043d\u0430 \u0440\u0430\u0437\u043d\u044b\u0435 \u0444\u0430\u0439\u043b\u044b\/\u043c\u043e\u0434\u0443\u043b\u0438. \u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u0438\u0442 \u043d\u0430\u043c \u0434\u0443\u043c\u0430\u0442\u044c \u043e \u043a\u0430\u0436\u0434\u043e\u043c \u043c\u043e\u0434\u0443\u043b\u0435 \u0438\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e,\u0430 \u0442\u0430\u043a\u0436\u0435 \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043a\u0430\u0436\u0434\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c \u0431\u043e\u043b\u0435\u0435 \u0447\u0438\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u044b\u043c \u0438 \u043c\u043d\u043e\u0433\u043e\u0440\u0430\u0437\u043e\u0432\u044b\u043c.<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/955\/d7b\/127\/955d7b1278c1abc77c95caccc616fa0a.png\" alt=\"\u0422\u0438\u043f\u0438\u0447\u043d\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u043d\u0430 React\" title=\"\u0422\u0438\u043f\u0438\u0447\u043d\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u043d\u0430 React\" width=\"406\" height=\"279\"><figcaption>\u0422\u0438\u043f\u0438\u0447\u043d\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u043d\u0430 React<\/figcaption><\/figure>\n<ul>\n<li>\n<p>index.js \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u0442 &lt;Browsers \/&gt; \u0441 Browsers.jsx.<\/p>\n<\/li>\n<li>\n<p>\u0412 \u043f\u0430\u043f\u043a\u0430\u0445 \u00abcomponents\u00bb \u0438 \u00abhooks\u00bb \u0445\u0440\u0430\u043d\u044f\u0442\u0441\u044f \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438, \u043e\u0442\u043d\u043e\u0441\u044f\u0449\u0438\u0435\u0441\u044f \u043a \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0443 &lt;Browsers \/&gt;.<\/p>\n<\/li>\n<li>\n<p>BrowsersList.jsx \u0442\u0430\u043a\u0436\u0435 \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0435\u0432\u0440\u0430\u0442\u0438\u0442\u044c\u0441\u044f \u0432 \u043f\u0430\u043f\u043a\u0443 \u0441\u043e \u0441\u0432\u044f\u0437\u0430\u043d\u043d\u044b\u043c\u0438 \u00ab\u0445\u0443\u043a\u0430\u043c\u0438\u00bb, \u00ab\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u043c\u0438\u00bb \u0438 \u0438\u043d\u0434\u0435\u043a\u0441\u043e\u043c.<\/p>\n<\/li>\n<\/ul>\n<p>\u0424\u0430\u0439\u043b\u043e\u0432\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430 React \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0431\u043e\u0439 \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u043e\u0435 \u0434\u0435\u0440\u0435\u0432\u043e.<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/51b\/276\/3a0\/51b2763a088e4c1779bff374514713ab.png\" alt=\"\u0412\u043e\u0437\u043c\u043e\u0436\u043d\u0430\u044f \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\" title=\"\u0412\u043e\u0437\u043c\u043e\u0436\u043d\u0430\u044f \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\" width=\"410\" height=\"440\"><figcaption>\u0412\u043e\u0437\u043c\u043e\u0436\u043d\u0430\u044f \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/figcaption><\/figure>\n<p>\u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043e \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0435 React-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439 \u0447\u0438\u0442\u0430\u0439\u0442\u0435 \u0432 \u0441\u0442\u0430\u0442\u044c\u0435 \u0430\u0432\u0442\u043e\u0440\u0430 <a href=\"https:\/\/medium.com\/u\/f735d3b0f2f3?source=post_page-----ca2e47d1bf97--------------------------------\">David Gilbertson<\/a> <a href=\"https:\/\/medium.com\/hackernoon\/the-100-correct-way-to-structure-a-react-app-or-why-theres-no-such-thing-3ede534ef1ed\">\u041d\u0430 100 % \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0439 \u0441\u043f\u043e\u0441\u043e\u0431 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c React-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 (\u0438\u043b\u0438 \u043f\u043e\u0447\u0435\u043c\u0443 \u0442\u0430\u043a\u043e\u0433\u043e \u0441\u043f\u043e\u0441\u043e\u0431\u0430 \u043d\u0435\u0442).<\/a><\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0430 \u043d\u0430\u0448 BrowsersList.jsx.<\/p>\n<p><iframe id=\"604b787ec373282e340f481f\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b787ec373282e340f481f\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u0421\u0442\u0430\u043b\u043e \u0433\u043e\u0440\u0430\u0437\u0434\u043e \u043c\u0435\u043d\u044c\u0448\u0435 \u043a\u043e\u0434\u0430. \u041e\u043d \u0441\u0442\u0430\u043b \u0433\u043e\u0440\u0430\u0437\u0434\u043e \u043c\u0435\u043d\u0435\u0435 \u0437\u0430\u0433\u0440\u043e\u043c\u043e\u0436\u0434\u0451\u043d\u043d\u044b\u043c. \u0422\u0435\u043f\u0435\u0440\u044c \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u043e\u0441\u0440\u0435\u0434\u043e\u0442\u043e\u0447\u0438\u0442\u044c\u0441\u044f \u043d\u0430 \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0435 \u044d\u0442\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u043a\u043e\u0434\u0430.<\/p>\n<p>\u041c\u0435\u043d\u044c\u0448\u0435 \u0431\u0435\u0441\u043f\u043e\u0440\u044f\u0434\u043a\u0430 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 = \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430<\/p>\n<p>\u041d\u043e, \u043f\u0440\u0435\u0436\u0434\u0435 \u0447\u0435\u043c \u043c\u044b \u0441\u0434\u0435\u043b\u0430\u0435\u043c \u044d\u0442\u043e\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0438\u0433\u043e\u0434\u043d\u044b\u043c \u0434\u043b\u044f \u043c\u043d\u043e\u0433\u043e\u0440\u0430\u0437\u043e\u0432\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f, \u043f\u043e\u0437\u0432\u043e\u043b\u044c\u0442\u0435 \u043c\u043d\u0435 \u0437\u0430\u0442\u0440\u043e\u043d\u0443\u0442\u044c \u0431\u043e\u043b\u044c\u0448\u0443\u044e \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0443 \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u0434\u0438\u0437\u0430\u0439\u043d\u0430.<\/p>\n<h2>\u0411\u043e\u043b\u044c\u0448\u0430\u044f \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u0441 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e\u043c \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u0445 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445 \u0444\u0430\u0439\u043b\u043e\u0432&nbsp;<\/h2>\n<p>\u041f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u0442\u0435 \u043d\u0430 \u043d\u0430\u0448 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 &lt;BrowsersList \/&gt;:<\/p>\n<ul>\n<li>\n<p>\u0435\u0441\u043b\u0438 \u043c\u044b \u043f\u0435\u0440\u0435\u0438\u043c\u0435\u043d\u0443\u0435\u043c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u043e\u043f\u0441\u044b, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 changeDescription \u0432 setSelectedBrowser \u0438\u043b\u0438 description \u0432 browser,<\/p>\n<\/li>\n<li>\n<p>\u0438\u043b\u0438 \u043c\u044b \u0443\u0434\u0430\u043b\u0438\u043c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u043e\u043f\u0441\u044b,<\/p>\n<\/li>\n<li>\n<p>\u0438\u043b\u0438 \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u043e\u043f\u0441\u044b,<\/p>\n<\/li>\n<\/ul>\n<p>\u0412 \u043a\u0430\u0436\u0434\u043e\u043c \u043c\u0435\u0441\u0442\u0435, \u0433\u0434\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f &lt;BrowsersList \/&gt;, \u0431\u0443\u0434\u0435\u0442 \u043e\u0448\u0438\u0431\u043a\u0430!<\/p>\n<p>\u041a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437, \u043a\u043e\u0433\u0434\u0430 \u0432\u044b \u043c\u0435\u043d\u044f\u0435\u0442\u0435 \u0432\u0445\u043e\u0434\u044f\u0449\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430, \u0432\u044b \u043b\u043e\u043c\u0430\u0435\u0442\u0435 \u043a\u0430\u0436\u0434\u043e\u0435 \u043c\u0435\u0441\u0442\u043e \u0441\u0432\u043e\u0435\u0433\u043e \u043a\u043e\u0434\u0430, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u044d\u0442\u043e\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442. \u0418 \u0432\u044b \u0431\u0443\u0434\u0435\u0442\u0435 \u0447\u0430\u0441\u0442\u043e \u043c\u0435\u043d\u044f\u0442\u044c \u0432\u0445\u043e\u0434\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435, \u0442\u0430\u043a \u043a\u0430\u043a \u0441\u043b\u043e\u0436\u043d\u043e \u0432\u0441\u0451 \u043f\u0440\u043e\u0434\u0443\u043c\u0430\u0442\u044c \u0432 \u043f\u0435\u0440\u0432\u044b\u0439 \u0436\u0435 \u0434\u0435\u043d\u044c, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: \u0434\u0438\u0437\u0430\u0439\u043d \u0447\u0430\u0441\u0442\u043e \u0432\u043e\u0437\u043d\u0438\u043a\u0430\u0435\u0442 \u0438\u0437 \u0442\u043e\u0433\u043e, \u043a\u0430\u043a \u0432\u044b \u043f\u0438\u0448\u0435\u0442\u0435 \u043a\u043e\u0434. \u0410 \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u043c\u044b \u0441\u043e\u0441\u0440\u0435\u0434\u043e\u0442\u043e\u0447\u0435\u043d\u044b \u043d\u0430 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e, \u0432\u043e \u043c\u043d\u043e\u0433\u0438\u0445 \u043c\u0435\u0441\u0442\u0430\u0445 \u0431\u0443\u0434\u0443\u0442 \u0432\u043e\u0437\u043d\u0438\u043a\u0430\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0438.<\/p>\n<p>\u0412\u0430\u0448\u0430 IDE \u043d\u0435 \u043c\u043e\u0436\u0435\u0442 \u043f\u0435\u0440\u0435\u0438\u043c\u0435\u043d\u043e\u0432\u044b\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u043f\u0441\u044b \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0430. \u0412\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u044d\u0442\u043e \u0432\u0440\u0443\u0447\u043d\u0443\u044e. \u0412\u0440\u0443\u0447\u043d\u0443\u044e \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u043a\u0430\u0436\u0434\u043e\u0435 \u043c\u0435\u0441\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f. \u042d\u0442\u043e \u0437\u0430\u043c\u0435\u0434\u043b\u0438\u0442 \u0432\u0430\u0448\u0443 \u0440\u0430\u0431\u043e\u0442\u0443.<\/p>\n<p>\u0418 \u0445\u0443\u0436\u0435 \u0432\u0441\u0435\u0433\u043e \u0442\u043e, \u0447\u0442\u043e \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u043c \u043e\u0448\u0438\u0431\u043a\u0443 \u0438 \u043d\u0435 \u0443\u0437\u043d\u0430\u0435\u043c \u043e\u0431 \u044d\u0442\u043e\u043c. \u0415\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 \u0441\u043f\u043e\u0441\u043e\u0431 \u043f\u043e\u0439\u043c\u0430\u0442\u044c \u0435\u0451 \u2013 \u044d\u0442\u043e:<\/p>\n<ul>\n<li>\n<p>\u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435;<\/p>\n<\/li>\n<li>\n<p>\u0432\u0440\u0443\u0447\u043d\u0443\u044e \u043f\u0435\u0440\u0435\u0439\u0442\u0438 \u043a \u0441\u043b\u043e\u043c\u0430\u043d\u043d\u043e\u043c\u0443 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0443 \u0438<\/p>\n<\/li>\n<li>\n<p>\u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0443;<\/p>\n<\/li>\n<li>\n<p>\u043f\u0440\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u0442\u0435\u043a\u0441\u0442 \u043e\u0448\u0438\u0431\u043a\u0438;<\/p>\n<\/li>\n<li>\n<p>\u0438\u0441\u043f\u0440\u0430\u0432\u0438\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0443 \u0438 \u043f\u043e\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u0442\u044c \u0435\u0449\u0451 \u0440\u0430\u0437.<\/p>\n<\/li>\n<\/ul>\n<p>\u042d\u0442\u043e \u043c\u0435\u0434\u043b\u0435\u043d\u043d\u0430\u044f \u0438 \u0443\u0442\u043e\u043c\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u0437\u0430\u0434\u0430\u0447\u0430. \u0412\u043e\u0442 \u0442\u0430\u043a \u043d\u0435\u043f\u0440\u0438\u044f\u0442\u043d\u044b\u0435 \u0431\u0430\u0433\u0438 \u043f\u043e\u043f\u0430\u0434\u0430\u044e\u0442 \u0432 \u043f\u0440\u043e\u0434\u0430\u043a\u0448\u043d. \u0410 \u0442\u0430\u043a\u043e\u0435 \u0431\u044b\u0432\u0430\u0435\u0442 \u043e\u0447\u0435\u043d\u044c \u0447\u0430\u0441\u0442\u043e.<\/p>\n<p>\u041f\u0440\u043e\u0432\u0435\u0440\u044c\u0442\u0435, \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043b\u0438 \u043d\u0430\u0448 Browsers.jsx?<\/p>\n<p><iframe id=\"604b786a189a112e083e61ee\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b786a189a112e083e61ee\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u041a\u0442\u043e \u0437\u043d\u0430\u0435\u0442! \u0414\u043b\u044f \u0443\u0432\u0435\u0440\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u043e\u0442\u043a\u0440\u044b\u0442\u044c BrowsersList.jsx \u0438 useBrowsers.js \u0438 \u0432\u0440\u0443\u0447\u043d\u0443\u044e \u0441\u0440\u0430\u0432\u043d\u0438\u0442\u044c \u0432\u0445\u043e\u0434\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435.<\/p>\n<p>\u042d\u0442\u043e\u0442 \u043a\u043e\u0434 \u043d\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442?<\/p>\n<p><iframe id=\"604b785a189a112e083e61ed\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b785a189a112e083e61ed\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u0414\u0430. \u0423 \u00abdescripton\u00bb \u0432 useBrowsers.js \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u00abi\u00bb, \u044d\u0442\u043e \u043e\u043f\u0435\u0447\u0430\u0442\u043a\u0430.<\/p>\n<p>\u041c\u043d\u043e\u0433\u0438\u0435 \u0434\u0436\u0443\u043d\u0438\u043e\u0440-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u0447\u0430\u0441\u0430\u043c\u0438 \u043e\u0442\u043b\u0430\u0436\u0438\u0432\u0430\u044e\u0442 \u0441\u0432\u043e\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u043f\u044b\u0442\u0430\u044e\u0442\u0441\u044f \u043d\u0430\u0439\u0442\u0438, \u043a\u0430\u043a\u043e\u0439 \u043f\u0440\u043e\u043f\u0441 \u0431\u044b\u043b \u0441\u043b\u043e\u043c\u0430\u043d \u0438\u043b\u0438 \u043a\u0430\u043a\u043e\u0439 \u043f\u0440\u043e\u043f\u0441 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u043d\u0435\u0432\u0435\u0440\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 (\u0441\u0442\u0440\u043e\u043a\u0430 \u0432\u043c\u0435\u0441\u0442\u043e \u0447\u0438\u0441\u043b\u0430). \u0415\u0441\u0442\u044c \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u044d\u0442\u043e\u0439 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b.<\/p>\n<h2>\u041f\u0435\u0440\u0435\u0441\u0442\u0430\u043d\u044c\u0442\u0435 \u043c\u0435\u0434\u043b\u0435\u043d\u043d\u043e \u043f\u0438\u0441\u0430\u0442\u044c \u043a\u043e\u0434 \u043d\u0430 JavaScript, \u0443\u0441\u043a\u043e\u0440\u044c\u0442\u0435 \u0441\u0435\u0431\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e TypeScript!<\/h2>\n<p>\u041d\u0430\u0441\u0442\u0443\u043f\u0438\u043b 2021 \u0433\u043e\u0434, \u0438 \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a React\/React Native \u0434\u043e\u043b\u0436\u0435\u043d \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c TypeScript. \u0424\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043d\u0435\u0442 \u043f\u0440\u0438\u0447\u0438\u043d \u043d\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0435\u0433\u043e.<\/p>\n<p>\u041e\u043d \u043c\u043e\u0436\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0441\u0442\u0440\u0430\u0448\u043d\u043e.<\/p>\n<p>\u041f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430 TypeScript \u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043f\u0435\u0440\u0435\u0432\u0435\u0448\u0438\u0432\u0430\u044e\u0442 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0442 \u0432 JavaScript. \u041d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u0437\u043d\u0430\u0447\u0438\u043c\u044b\u043c\u0438 \u0434\u043b\u044f \u043d\u0430\u0441 \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0440\u0430\u0441\u0445\u043e\u0434\u044b \u043d\u0430 \u043e\u0431\u0443\u0447\u0435\u043d\u0438\u0435.<\/p>\n<p>\u041d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u043e\u0447\u0435\u0432\u0438\u0434\u043d\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u044d\u0442\u043e\u0439 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u2013 \u043f\u0440\u043e\u0441\u0442\u043e \u0432\u043a\u043b\u044e\u0447\u0438\u0442\u0435 TypeScript, \u043d\u0435 \u043c\u0435\u043d\u044f\u044f \u043a\u043e\u0434, \u0434\u043e\u0431\u0430\u0432\u044c\u0442\u0435 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043f\u0440\u043e\u0441\u0442\u044b\u0445 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u0439 \u0442\u0438\u043f\u043e\u0432. \u0412 \u043a\u043e\u043d\u0446\u0435 \u043a\u043e\u043d\u0446\u043e\u0432, \u043d\u0430\u0448 \u043e\u043f\u044b\u0442 \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442, \u0447\u0442\u043e \u043f\u0440\u0438 \u043f\u0440\u043e\u0441\u0442\u0435\u0439\u0448\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 TypeScript \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u043c\u043d\u043e\u0433\u043e \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432. \u2013 <a href=\"https:\/\/medium.com\/u\/23626b04abce?source=post_page-----ca2e47d1bf97--------------------------------\">Felix Rieseberg<\/a>, <a href=\"https:\/\/slack.engineering\/typescript-at-slack\/\">TypeScript \u0432 Slack<\/a>.<\/p>\n<h2>\u041a\u043b\u0430\u0441\u0441\u043d\u044b\u0435 \u0444\u0438\u0447\u0438 TypeScript<\/h2>\n<p>\u041c\u0435\u043d\u044c\u0448\u0435 \u043e\u0448\u0438\u0431\u043e\u043a. <\/p>\n<p>\u041c\u0435\u043d\u044c\u0448\u0435 \u043e\u0448\u0438\u0431\u043e\u043a = \u0431\u043e\u043b\u0435\u0435 \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/p>\n<p><a href=\"https:\/\/www.reddit.com\/r\/typescript\/comments\/aofcik\/38_of_bugs_at_airbnb_could_have_been_prevented_by\/?utm_content=title&amp;utm_medium=post_embed&amp;utm_name=fc4ab3de4e5246c9af46861786aa801e&amp;utm_source=embedly&amp;utm_term=aofcik\">38% \u043e\u0448\u0438\u0431\u043e\u043a \u0432 Airbnb \u043c\u043e\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u043f\u0440\u0435\u0434\u043e\u0442\u0432\u0440\u0430\u0442\u0438\u0442\u044c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e TypeScript, \u0441\u043e\u0433\u043b\u0430\u0441\u043d\u043e \u0430\u043d\u0430\u043b\u0438\u0437\u0443.<\/a><\/p>\n<p>TypeScript \u0438\u0437\u0431\u0430\u0432\u043b\u044f\u0435\u0442 \u043e\u0442 \u043e\u0448\u0438\u0431\u043e\u043a.<\/p>\n<p>\u041c\u044b \u0431\u044b \u0441\u0440\u0430\u0437\u0443 \u043d\u0430\u0448\u043b\u0438 \u043e\u043f\u0435\u0447\u0430\u0442\u043a\u0443 \u0441 \u0431\u0443\u043a\u0432\u043e\u0439 \u00abi\u00bb:<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/4e4\/600\/6cc\/4e46006ccbc7802e2b88ad480eeb881d.png\" alt=\"TypeScript \u0432\u044b\u0434\u0435\u043b\u044f\u0435\u0442 \u043e\u0448\u0438\u0431\u043a\u0438\" title=\"TypeScript \u0432\u044b\u0434\u0435\u043b\u044f\u0435\u0442 \u043e\u0448\u0438\u0431\u043a\u0438\" width=\"344\" height=\"290\"><figcaption>TypeScript \u0432\u044b\u0434\u0435\u043b\u044f\u0435\u0442 \u043e\u0448\u0438\u0431\u043a\u0438<\/figcaption><\/figure>\n<p>\u0412\u0430\u0448\u0430 IDE \u043f\u043e\u043b\u0443\u0447\u0438\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0430\u0432\u0442\u043e\u0437\u0430\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u0434\u043b\u044f \u043f\u0440\u043e\u043f\u0441\u043e\u0432 \u0432 React. \u042d\u0442\u043e \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u044d\u043a\u043e\u043d\u043e\u043c\u0438\u0442 \u0432\u0430\u0448\u0435 \u0432\u0440\u0435\u043c\u044f, \u043a\u043e\u0433\u0434\u0430 \u0432\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0441 \u043d\u0435\u0438\u0437\u0432\u0435\u0441\u0442\u043d\u044b\u043c\u0438 \u043f\u0440\u043e\u043f\u0441\u0430\u043c\u0438:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ec7\/583\/c99\/ec7583c99196110bf0572d058a77eb5e.gif\" alt=\"TypeScript \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u044b\" title=\"TypeScript \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u044b\" width=\"600\" height=\"475\"><figcaption>TypeScript \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u044b<\/figcaption><\/figure>\n<p>\u0412\u0430\u0448\u0430 IDE \u043f\u043e\u043b\u0443\u0447\u0438\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u00ab\u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0430\u00bb. \u042d\u0442\u043e \u0441\u044d\u043a\u043e\u043d\u043e\u043c\u0438\u0442 \u0432\u0430\u043c \u0432\u0440\u0435\u043c\u044f \u043d\u0430 \u043f\u0435\u0440\u0435\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u0438\u0435 \u043f\u0440\u043e\u043f\u0441\u043e\u0432. \u0412\u0441\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u043f\u0440\u043e\u043f\u0441\u0430 \u0431\u0443\u0434\u0443\u0442 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0435\u0440\u0435\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u044b \u043e\u0434\u043d\u0438\u043c \u0449\u0435\u043b\u0447\u043a\u043e\u043c \u043c\u044b\u0448\u0438.<\/p>\n<p>\u0412\u044b \u043d\u0438\u043a\u043e\u0433\u0434\u0430 \u0431\u043e\u043b\u044c\u0448\u0435 \u043d\u0435 \u0437\u0430\u0431\u0443\u0434\u0435\u0442\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443 \u043d\u0430 null\/undefined.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/b5d\/b52\/c25\/b5db52c2594b14096a58dd6ea7e58675.png\" alt=\"?&nbsp; \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043d\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u044b\u043c.\" title=\"?&nbsp; \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043d\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u044b\u043c.\" width=\"916\" height=\"158\"><figcaption>?&nbsp; \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043d\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u044b\u043c.<\/figcaption><\/figure>\n<p>\u0418, \u043a\u043e\u043d\u0435\u0447\u043d\u043e \u0436\u0435, \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435 \u043e\u0431 \u043e\u0448\u0438\u0431\u043a\u0435, \u0435\u0441\u043b\u0438 \u043f\u043e\u043f\u044b\u0442\u0430\u0435\u043c\u0441\u044f \u043f\u043e\u043c\u0435\u0441\u0442\u0438\u0442\u044c \u043d\u0435\u0434\u043e\u043f\u0443\u0441\u0442\u0438\u043c\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u0432 \u043d\u0430\u0448 \u043f\u0440\u043e\u043f\u0441:&nbsp;<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/751\/174\/c62\/751174c62832c9c282cb99df8d4f3f4b.png\" alt=\"TypeScript \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u043e\u043f\u0441\u043e\u0432.\" title=\"TypeScript \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u043e\u043f\u0441\u043e\u0432.\" width=\"784\" height=\"306\"><figcaption>TypeScript \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u043e\u043f\u0441\u043e\u0432.<\/figcaption><\/figure>\n<p>TypeScript \u043b\u0435\u0433\u043a\u043e \u0441\u044d\u043a\u043e\u043d\u043e\u043c\u0438\u0442 \u0432\u0430\u043c \u043c\u0430\u0441\u0441\u0443 \u0447\u0430\u0441\u043e\u0432 \u0438 \u0438\u0437\u0431\u0430\u0432\u0438\u0442 \u043e\u0442 \u0441\u0442\u0440\u0435\u0441\u0441\u0430, \u0441\u0432\u044f\u0437\u0430\u043d\u043d\u043e\u0433\u043e \u0441 \u043e\u0442\u043b\u0430\u0434\u043a\u043e\u0439 \u043a\u043e\u0434\u0430.<\/p>\n<p>JavaScript = \u043c\u0435\u0434\u043b\u0435\u043d\u043d\u043e\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/p>\n<p>TypeScript = \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/p>\n<h2>\u041f\u0435\u0440\u0432\u044b\u0439 \u0448\u0430\u0433 \u043a \u0431\u044b\u0441\u0442\u0440\u043e\u043c\u0443 \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044e \u0441\u0438\u0441\u0442\u0435\u043c\u044b: \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u0435 \u0441\u0432\u043e\u0438 \u0442\u0438\u043f\u044b.<\/h2>\n<p>\u042d\u0442\u043e \u043d\u0435\u043f\u043e\u043b\u043d\u043e\u0435 \u0440\u0443\u043a\u043e\u0432\u043e\u0434\u0441\u0442\u0432\u043e \u043f\u043e TypeScript. \u0415\u0441\u043b\u0438 \u0432\u044b \u0447\u0443\u0432\u0441\u0442\u0432\u0443\u0435\u0442\u0435, \u0447\u0442\u043e \u0437\u0430\u0441\u0442\u0440\u044f\u043b\u0438, \u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u043d\u0430<a href=\"https:\/\/www.typescriptlang.org\/docs\/handbook\/basic-types.html\"> <em>typescriptlang.org<\/em><\/a>, \u0430 \u0437\u0430\u0442\u0435\u043c \u0432\u0435\u0440\u043d\u0438\u0442\u0435\u0441\u044c \u043a \u0441\u0442\u0430\u0442\u044c\u0435.<\/p>\n<p>\u0412\u0435\u0440\u043d\u0451\u043c\u0441\u044f \u043a \u043d\u0430\u0448\u0435\u043c\u0443 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0443 &lt;BrowsersList \/&gt; \u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u043c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0442\u0438\u043f\u044b \u0434\u043b\u044f \u0435\u0433\u043e \u043f\u0440\u043e\u043f\u0441\u043e\u0432 (\u043d\u0435 \u0437\u0430\u0431\u0443\u0434\u044c\u0442\u0435 \u043f\u0435\u0440\u0435\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u0442\u044c \u0444\u0430\u0439\u043b \u0441 .jsx \u0432 .tsx).<\/p>\n<p><iframe id=\"604b7840189a112e083e61ec\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b7840189a112e083e61ec\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u0418 \u043e\u0431\u043d\u043e\u0432\u0438\u0442\u0435 \u0441\u0438\u0433\u043d\u0430\u0442\u0443\u0440\u0443 \u0445\u0443\u043a\u0430 useBrowsers():<\/p>\n<p><iframe id=\"604b7829189a112e083e61eb\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b7829189a112e083e61eb\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c TypeScript \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442, \u0447\u0442\u043e useBrowsers() \u0438 BrowsersList \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u0438\u043c\u044b<strong>. <\/strong>\u0415\u0441\u043b\u0438 \u043c\u044b \u043a\u043e\u0433\u0434\u0430-\u043d\u0438\u0431\u0443\u0434\u044c \u0438\u0437\u043c\u0435\u043d\u0438\u043c \u0432\u0445\u043e\u0434\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f BrowsersList, \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u043c \u043e\u0448\u0438\u0431\u043a\u0443. \u041e\u0434\u0438\u043d \u044d\u0442\u043e\u0442 \u0444\u0430\u043a\u0442 \u0433\u0430\u0440\u0430\u043d\u0442\u0438\u0440\u0443\u0435\u0442 \u0433\u043e\u0440\u0430\u0437\u0434\u043e<strong> <\/strong>\u043c\u0435\u043d\u044c\u0448\u0435 \u043e\u0448\u0438\u0431\u043e\u043a \u0432 \u043f\u0440\u043e\u0434\u0430\u043a\u0448\u043d\u0435.<\/p>\n<p>\u041c\u0435\u043d\u044c\u0448\u0435 \u043e\u0448\u0438\u0431\u043e\u043a = \u0431\u043e\u043b\u0435\u0435 \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/p>\n<h2>\u0411\u044b\u0441\u0442\u0440\u0430\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u0430\u044f \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0430<\/h2>\n<p>BrowsersListProps \u0432 \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0435\u0435 \u0432\u0440\u0435\u043c\u044f \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0431\u0435\u0441\u043f\u043e\u0440\u044f\u0434\u043e\u0447\u043d\u043e:<\/p>\n<p><iframe id=\"604b78188b25a4d2350c14bc\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b78188b25a4d2350c14bc\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<ul>\n<li>\n<p>\u041a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0434\u043e\u043b\u0436\u0435\u043d \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f 1 \u0441\u0442\u0440\u043e\u043a\u0430 \u0432 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u0442\u0438\u043f\u0430.<\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043b\u0436\u0435\u043d \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u044c\u0441\u044f \u0441\u043f\u0438\u0441\u043e\u043a Browser[]. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f 1 \u0441\u0442\u0440\u043e\u043a\u0430 \u0432 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u0442\u0438\u043f\u0430.<\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043b\u0436\u043d\u043e \u043f\u043e\u044f\u0432\u0438\u0442\u044c\u0441\u044f \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0435 \u043e\u043a\u043d\u043e \u0441 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u044b\u043c \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435\u043c \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f 4 \u0441\u0442\u0440\u043e\u043a\u0438 \u0432 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u0442\u0438\u043f\u0430. \u042d\u0442\u0438 \u0441\u0442\u0440\u043e\u043a\u0438 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0438\u0432\u0430\u044e\u0442 \u043d\u0430\u0441 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435\u043c \u043f\u043e\u043b\u044f \u00abdescription\u00bb \u0432 \u043d\u0430\u0448\u0435\u043c \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u043c \u043e\u043a\u043d\u0435. \u0418 \u043a\u0430\u0436\u0435\u0442\u0441\u044f<strong>, <\/strong>\u0447\u0442\u043e \u0435\u0441\u0442\u044c \u0432\u0435\u0440\u043e\u044f\u0442\u043d\u043e\u0441\u0442\u044c, \u0447\u0442\u043e \u043d\u0430\u043c \u043f\u043e\u043d\u0430\u0434\u043e\u0431\u0438\u0442\u0441\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u044c \u0431\u043e\u043b\u044c\u0448\u0435 \u043f\u043e\u043b\u0435\u0439 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u0432 \u044d\u0442\u043e\u043c \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u043c \u043e\u043a\u043d\u0435. \u041f\u043e\u043c\u043d\u0438\u0442\u0435<strong>, <\/strong>\u043e\u0447\u0435\u043d\u044c \u0434\u043e\u0440\u043e\u0433\u043e \u043c\u0435\u043d\u044f\u0442\u044c \u0441\u0438\u0433\u043d\u0430\u0442\u0443\u0440\u0443 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430.<\/p>\n<\/li>\n<\/ul>\n<p>\u041c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043f\u0440\u0435\u0434\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438 \u0441\u043e\u043a\u0440\u0430\u0442\u0438\u0442\u044c \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0442\u0438\u043f\u0430 \u0438 \u0440\u0435\u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u00ab\u043c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043e\u043a\u043d\u0430\u00bb, \u0447\u0442\u043e\u0431\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0442\u0438\u043f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430.<\/p>\n<p>\u042d\u0442\u043e \u0441\u043d\u0438\u0437\u0438\u0442 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u043e\u043f\u0441\u043e\u0432:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/3a7\/899\/390\/3a7899390f80338ca2d1c82b468a92ce.png\" alt=\"TypeScript \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0441\u0438\u0433\u043d\u0430\u0442\u0443\u0440\u044b.\" title=\"TypeScript \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0441\u0438\u0433\u043d\u0430\u0442\u0443\u0440\u044b.\" width=\"620\" height=\"502\"><figcaption>TypeScript \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0441\u0438\u0433\u043d\u0430\u0442\u0443\u0440\u044b.<\/figcaption><\/figure>\n<p>\u042d\u0442\u043e \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u0443\u043f\u0440\u0430\u0436\u043d\u0435\u043d\u0438\u0435 \u043f\u043e \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0443 \u0434\u043e\u043b\u0436\u043d\u043e \u043f\u0440\u043e\u0434\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u0430\u043c \u0435\u0449\u0435 \u043e\u0434\u043d\u0443 \u0437\u0430\u043c\u0435\u0447\u0430\u0442\u0435\u043b\u044c\u043d\u0443\u044e \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u044c TypeScript \u2013 \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0441\u0438\u0441\u0442\u0435\u043c\u044b.<\/p>\n<p>\u0422\u0438\u043f\u044b \u043f\u0438\u0441\u0430\u0442\u044c \u043e\u0447\u0435\u043d\u044c \u043b\u0435\u0433\u043a\u043e. \u0418\u0445 \u0431\u044b\u0441\u0442\u0440\u043e \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c (4 \u0441\u0442\u0440\u043e\u0447\u043a\u0438 \u0442\u0438\u043f\u043e\u0432 \u043f\u0440\u043e\u0442\u0438\u0432 60 \u0441\u0442\u0440\u043e\u043a \u0444\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430), \u0430 \u0442\u0430\u043a\u0436\u0435 \u043e\u043d\u0438 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442 \u043c\u043d\u043e\u0433\u043e \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u043e \u0432\u0430\u0448\u0435\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u0435. \u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0442\u0438\u043f\u043e\u0432 \u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0441\u0432\u043e\u044e \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0443, \u0444\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043d\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u0432 \u043d\u0438\u043a\u0430\u043a\u043e\u0433\u043e \u043a\u043e\u0434\u0430. \u042d\u0442\u043e \u0441\u044d\u043a\u043e\u043d\u043e\u043c\u0438\u0442 \u0432\u0430\u043c \u043c\u043d\u043e\u0433\u043e-\u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0443.<strong> <\/strong><\/p>\n<p>\u041f\u0435\u0440\u0432\u044b\u0439 \u0448\u0430\u0433 \u0432 \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438 \u043b\u044e\u0431\u043e\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u044b: \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0432\u0430\u0448\u0438\u0445 \u0442\u0438\u043f\u043e\u0432.<\/p>\n<p>\u0410\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0430 \u0438 \u043f\u043b\u0430\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0441 \u0442\u0438\u043f\u0430\u043c\u0438 TypeScript = \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/p>\n<h2>\u041f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e \u043a\u0430\u043a \u0432\u044b \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u043b\u0438 \u0441\u0432\u043e\u0438 \u0442\u0438\u043f\u044b, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043d\u0430\u0447\u0430\u0442\u044c \u043f\u0438\u0441\u0430\u0442\u044c \u043b\u043e\u0433\u0438\u043a\u0443 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430<\/h2>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0438\u0441\u043f\u0440\u0430\u0432\u0438\u043c &lt;BrowsersList \/&gt;, \u0442\u0430\u043a \u043a\u0430\u043a \u043e\u043d \u0431\u0443\u0434\u0435\u0442 \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u043d\u043e\u0432\u0443\u044e \u0441\u0438\u0433\u043d\u0430\u0442\u0443\u0440\u0443 BrowsersListProps. \u041c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u043e\u0432\u0435\u0441\u0442\u0438 \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433 &lt;BrowserItem \/&gt;, \u0442\u0430\u043a \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043b\u043e\u0441\u044c \u0431\u044b \u0442\u043e\u043b\u044c\u043a\u043e 2 \u043f\u0440\u043e\u043f\u0441\u0430 \u0432\u043c\u0435\u0441\u0442\u043e \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u0430. \u042d\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u0435\u0442 \u043a\u043e\u0434 \u0431\u043e\u043b\u0435\u0435 \u0447\u0438\u0442\u0430\u0435\u043c\u044b\u043c, \u0430 \u043d\u0430\u0441 \u2013 \u0431\u044b\u0441\u0442\u0440\u0435\u0435.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u0443 \u0432\u0430\u0448\u0435\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u043c\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u043f\u0441\u043e\u0432, \u044d\u0442\u043e \u0445\u043e\u0440\u043e\u0448\u0438\u0439 \u043d\u0430\u043c\u0451\u043a \u043d\u0430 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u0439 \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433.<\/p>\n<p><iframe id=\"604b77e18b25a4d2350c14bb\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b77e18b25a4d2350c14bb\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u042d\u0442\u043e\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0443\u0436\u0435 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0431\u043e\u043b\u0435\u0435 \u0447\u0438\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u044b\u043c \u0438 \u043c\u0435\u043d\u0435\u0435 \u043f\u0443\u0433\u0430\u044e\u0449\u0438\u043c.<\/p>\n<p>\u041c\u0435\u043d\u044c\u0448\u0435 \u0431\u0435\u0441\u043f\u043e\u0440\u044f\u0434\u043a\u0430 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 = \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/p>\n<h2>\u0418\u0437\u0432\u043b\u0435\u0447\u0435\u043d\u0438\u0435 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u043e\u0435\u0439 \u043b\u043e\u0433\u0438\u043a\u0438 &lt;UIFriendlyList\/&gt; \u043e\u0442 &lt;BrowsersList\/&gt;<\/h2>\n<p>\u041f\u0440\u043e\u0441\u0442\u043e \u043d\u0430\u0431\u043b\u044e\u0434\u0430\u044f \u0437\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u043c, \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0438\u0441\u043f\u044b\u0442\u044b\u0432\u0430\u0435\u0442 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u0440\u0430\u0437\u043d\u044b\u0445 \u043e\u0449\u0443\u0449\u0435\u043d\u0438\u0439. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u044f \u0447\u0443\u0432\u0441\u0442\u0432\u0443\u044e, \u0447\u0442\u043e \u00ab\u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0442\u044c \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u0434\u043b\u044f \u0441\u043f\u0438\u0441\u043a\u0430\u00bb \u0432 &lt;BrowsersList \/&gt; \u2013 \u044d\u0442\u043e \u043e\u0447\u0435\u043d\u044c \u043a\u0440\u0443\u0442\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f. \u041d\u0430\u0441\u0442\u043e\u043b\u044c\u043a\u043e \u043a\u0440\u0443\u0442\u0430\u044f, \u0447\u0442\u043e, \u0441\u043a\u043e\u0440\u0435\u0435 \u0432\u0441\u0435\u0433\u043e, \u043e\u043d\u0430 \u0431\u0443\u0434\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0432 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u0445.<\/p>\n<p>\u042d\u0442\u043e \u043f\u043e\u0442\u0435\u043d\u0446\u0438\u0430\u043b\u044c\u043d\u043e \u043e\u0447\u0435\u043d\u044c \u043f\u043e\u043b\u0435\u0437\u043d\u0430\u044f \u0438 \u043c\u043d\u043e\u0433\u043e\u0440\u0430\u0437\u043e\u0432\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u043d\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041d\u043e \u0432 \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0435\u0435 \u0432\u0440\u0435\u043c\u044f \u043e\u043d\u0430<strong> <\/strong>\u0441\u0432\u044f\u0437\u0430\u043d\u0430 \u0441 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u043c &lt;BrowsersList \/&gt;, \u0438 \u043c\u044b \u043d\u0435 \u043c\u043e\u0436\u0435\u043c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0435\u0451 \u0432 \u0434\u0440\u0443\u0433\u043e\u043c \u043c\u0435\u0441\u0442\u0435. \u0414\u0430\u0432\u0430\u0439 \u0438\u0441\u043f\u0440\u0430\u0432\u0438\u043c \u044d\u0442\u043e.<\/p>\n<p>\u041c\u044b \u0445\u043e\u0442\u0438\u043c \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u043d\u043e\u0432\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 &lt;UIFriendlyList \/&gt; \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u0432\u043c\u0435\u0441\u0442\u043e &lt;FlatList \/&gt;. \u042d\u0442\u043e\u0442 &lt;UIFriendlyList \/&gt; \u0441\u043c\u043e\u0436\u0435\u0442 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0442\u044c \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438.<\/p>\n<p>\u041a\u0430\u043a \u0432\u0441\u0435\u0433\u0434\u0430, \u043c\u044b \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u043c \u0441 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0442\u0438\u043f\u043e\u0432:<\/p>\n<p><iframe id=\"604b77c830f707d266c0ec99\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b77c830f707d266c0ec99\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<ul>\n<li>\n<p>\u00abT\u00bb \u2013 \u044d\u0442\u043e \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442 \u0442\u0438\u043f\u0430. \u0422\u0438\u043f\u044b \u0441 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u043d\u0430\u0437\u044b\u0432\u0430\u044e\u0442\u0441\u044f <a href=\"https:\/\/www.typescriptlang.org\/docs\/handbook\/generics.html\">\u0414\u0436\u0435\u043d\u0435\u0440\u0438\u043a<\/a>. \u00abT\u00bb \u0434\u043b\u044f \u00abUIFriendlyList &lt;T&gt;\u00bb \u2013 \u0442\u043e \u0436\u0435 \u0441\u0430\u043c\u043e\u0435, \u0447\u0442\u043e \u00abarg\u00bb \u0434\u043b\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u00abfoo (arg)\u00bb. \u0415\u0441\u043b\u0438 \u0432\u044b \u0445\u043e\u0442\u0438\u0442\u0435 \u043f\u043e\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0441\u0432\u043e\u0439 \u0442\u0438\u043f \u0438\u0437 \u0434\u0440\u0443\u0433\u043e\u0433\u043e \u0442\u0438\u043f\u0430, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 Generic. \u0414\u043b\u044f \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u043e\u0437\u043d\u0430\u043a\u043e\u043c\u044c\u0442\u0435\u0441\u044c \u0441 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0451\u0439 <a href=\"https:\/\/medium.com\/u\/7cbf2b1d5a4e?source=post_page-----ca2e47d1bf97--------------------------------\">Ross Bulat<\/a>.<\/p>\n<\/li>\n<\/ul>\n<p><a href=\"https:\/\/rossbulat.medium.com\/typescript-generics-explained-15c6493b510f\">\u041e\u0431\u044a\u044f\u0441\u043d\u0435\u043d\u0438\u0435 \u0434\u0436\u0435\u043d\u0435\u0440\u0438\u043a\u043e\u0432 \u0432 TypeScript<\/a><\/p>\n<ul>\n<li>\n<p>\u00ab&amp;\u00bb \u2013 \u044d\u0442\u043e<a href=\"https:\/\/www.typescriptlang.org\/docs\/handbook\/unions-and-intersections.html#intersection-types\"> \u043f\u0435\u0440\u0435\u0441\u0435\u0447\u0435\u043d\u0438\u0435<\/a>. \u00abType X = A &amp; B\u00bb \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e X \u0431\u0443\u0434\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c A \u0438 B.<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u0442\u0435 \u043d\u0430 \u044d\u0442\u043e \u043a\u0440\u0443\u0442\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435:<\/p>\n<ul>\n<li>\n<p>\u041c\u044b \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u043c \u0442\u0438\u043f\u044b \u0434\u043b\u044f \u043d\u0430\u0448\u0438\u0445 \u043f\u0440\u043e\u043f\u0441\u043e\u0432 UIFriendlyListProps.<\/p>\n<\/li>\n<li>\n<p>\u041c\u044b \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u043c <a href=\"https:\/\/www.typescriptlang.org\/docs\/handbook\/generics.html\">\u0443\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u0442\u0438\u043f<\/a>: \u0441\u043f\u0438\u0441\u043e\u043a \u043c\u043e\u0436\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043b\u044e\u0431\u043e\u0433\u043e \u0442\u0438\u043f\u0430.<\/p>\n<\/li>\n<li>\n<p>UIFriendlyListProps \u0440\u0430\u0441\u0448\u0438\u0440\u044f\u0435\u0442 FlatListProps \u0438\u0437 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 React Native \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043d\u0430\u0448\u0435\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u00ab\u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u0430 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438\u00bb.<\/p>\n<\/li>\n<li>\n<p>\u0418\u0442\u0430\u043a, \u043c\u044b \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u043c \u0442\u0438\u043f UIFriendlyListProps \u043a\u0430\u043a <a href=\"https:\/\/www.typescriptlang.org\/docs\/handbook\/unions-and-intersections.html#intersection-types\">\u043f\u0435\u0440\u0435\u0441\u0435\u0447\u0435\u043d\u0438\u0435 \u0442\u0438\u043f\u043e\u0432<\/a> \u0438\u0437 FlatListProps \u0438 {loading ?: boolean}<\/p>\n<\/li>\n<\/ul>\n<p>\u041d\u0430\u0441\u043a\u043e\u043b\u044c\u043a\u043e&nbsp;\u044d\u0442\u043e \u043a\u0440\u0443\u0442\u043e?<\/p>\n<p>\u042f \u0434\u043e\u0432\u043e\u043b\u0435\u043d \u044d\u0442\u0438\u043c \u0434\u0438\u0437\u0430\u0439\u043d\u043e\u043c, \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043d\u0430\u043f\u0438\u0448\u0435\u043c \u0442\u0435\u043b\u043e \u044d\u0442\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u0438 \u043f\u0435\u0440\u0435\u043c\u0435\u0441\u0442\u0438\u043c \u0435\u0433\u043e \u0432 \u0434\u0440\u0443\u0433\u043e\u0439 \u0444\u0430\u0439\u043b UIFriendlyList.jsx<\/p>\n<p><iframe id=\"604b7a2eb4c396d242e09773\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b7a2eb4c396d242e09773\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u041c\u044b \u0442\u0430\u043a\u0436\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u043b\u0438 \u043f\u0443\u0441\u0442\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435. \u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0431\u0443\u0434\u0435\u0442 \u0443\u0432\u0435\u0440\u0435\u043d, \u0447\u0442\u043e \u0441\u043f\u0438\u0441\u043e\u043a \u043f\u0443\u0441\u0442 \u0438 \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u0436\u0434\u0430\u0442\u044c \u043f\u043e\u0441\u0442\u0443\u043f\u043b\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445. \u041e\u0447\u0435\u043d\u044c \u0434\u0440\u0443\u0436\u0435\u043b\u044e\u0431\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<p>&lt;UIFriendlyList \/&gt; \u2013 \u044d\u0442\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e, \u0438 \u043e\u043d \u043d\u0430\u0432\u0435\u0440\u043d\u044f\u043a\u0430 \u0441\u044d\u043a\u043e\u043d\u043e\u043c\u0438\u0442 \u043d\u0430\u043c \u0432\u0440\u0435\u043c\u044f \u0432 \u0431\u0443\u0434\u0443\u0449\u0435\u043c. \u0421 \u044d\u0442\u0438\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u043c \u043c\u044b \u0441\u0442\u0430\u043b\u0438 \u0431\u043e\u043b\u0435\u0435 \u0431\u044b\u0441\u0442\u0440\u044b\u043c React-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u043c.<\/p>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u043c \u043d\u0430\u0448 &lt;BrowsersList \/&gt;:<\/p>\n<p><iframe id=\"604b7bc4b4c396d242e09774\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b7bc4b4c396d242e09774\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u0412\u043e\u0442 \u043e \u0447\u0451\u043c \u044f \u0433\u043e\u0432\u043e\u0440\u0438\u043b. \u042d\u0442\u043e\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043d\u0430\u043c\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0449\u0435 \u043f\u043e\u043d\u044f\u0442\u044c \u043f\u043e \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u044e \u0441<a href=\"https:\/\/gist.github.com\/aleksejkozin\/98ebb0c3fc826c23bbd9afc30cfda24f\"> \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u043c BrowsersList<\/a><u> <\/u>. \u0418 \u0443 \u043d\u0430\u0441 \u0435\u0441\u0442\u044c \u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 &lt;UIFriendlyList \/&gt;, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043d\u0430\u0432\u0435\u0440\u043d\u044f\u043a\u0430 \u0441\u044d\u043a\u043e\u043d\u043e\u043c\u0438\u0442 \u043d\u0430\u043c \u0432\u0440\u0435\u043c\u044f. \u041c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u043e\u0439\u0442\u0438 \u0435\u0449\u0435 \u0433\u043b\u0443\u0431\u0436\u0435 \u0438 \u043f\u0440\u0435\u0434\u043f\u043e\u043b\u043e\u0436\u0438\u0442\u044c, \u0447\u0442\u043e \u043c\u044b \u0445\u043e\u0442\u0438\u043c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043b\u043e\u0433\u0438\u043a\u0443 ModalWindow + List, \u043d\u043e \u043c\u044b \u043d\u0430 \u044d\u0442\u043e\u043c \u043e\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u043c\u0441\u044f.<\/p>\n<p>\u042d\u0442\u043e\u0442 \u043f\u0440\u043e\u0446\u0435\u0441\u0441 \u00ab\u0438\u0437\u0432\u043b\u0435\u0447\u0435\u043d\u0438\u044f \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445 \u0447\u0430\u0441\u0442\u0435\u0439\u00bb \u0431\u0435\u0441\u043a\u043e\u043d\u0435\u0447\u0435\u043d \u0438 \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u0432\u0440\u0435\u043c\u0435\u043d\u0438. \u0412\u0430\u043c \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u043e\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c\u0441\u044f, \u0435\u0441\u043b\u0438 \u0432\u044b \u0447\u0443\u0432\u0441\u0442\u0432\u0443\u0435\u0442\u0435, \u0447\u0442\u043e \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u0440\u043e\u0432\u0435\u0441\u0442\u0438 \u0432\u0440\u0435\u043c\u044f \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0438\u0432\u043d\u043e \u0432 \u0434\u0440\u0443\u0433\u043e\u043c \u043c\u0435\u0441\u0442\u0435.<\/p>\n<p>\u041c\u044b, \u043b\u044e\u0434\u0438, \u0441\u043a\u043b\u043e\u043d\u043d\u044b \u043f\u0438\u0441\u0430\u0442\u044c \u043a\u043e\u0434 \u043a\u0430\u043a \u0444\u043e\u0440\u043c\u0443 \u043f\u0440\u043e\u043a\u0440\u0430\u0441\u0442\u0438\u043d\u0430\u0446\u0438\u0438, \u043e\u0442\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u044f \u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u043f\u0440\u043e\u0431\u043b\u0435\u043c, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0443 \u043d\u0430\u0441 \u0435\u0441\u0442\u044c \u0441\u0435\u0439\u0447\u0430\u0441, \u043f\u0443\u0442\u0451\u043c \u0440\u0435\u0448\u0435\u043d\u0438\u044f \u0433\u0438\u043f\u043e\u0442\u0435\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u0431\u0443\u0434\u0443\u0449\u0435\u0433\u043e. \u2013 <a href=\"https:\/\/medium.com\/u\/c2cca5f47e14?source=post_page-----ca2e47d1bf97--------------------------------\">Justin Travis Waith-Mair<\/a>. <a href=\"https:\/\/medium.com\/the-non-traditional-developer\/stop-writing-reusable-react-components-bd649cba2700\">\u041f\u0440\u0435\u043a\u0440\u0430\u0442\u0438\u0442\u0435 \u043f\u0438\u0441\u0430\u0442\u044c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b React.<\/a><\/p>\n<p>\u041c\u044b \u0437\u0430\u043a\u043e\u043d\u0447\u0438\u043b\u0438 \u0441 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u043e\u043c, \u043f\u043e\u0440\u0430 \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0443 \u0432 \u0445\u0443\u043a\u0435 useBrowsers().<\/p>\n<h2>\u0420\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0438 \u0432 \u0445\u0443\u043a\u0435 useBrowsers()<\/h2>\n<p>\u041a\u0430\u043a \u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c\u044b\u0435 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0445\u0443\u043a\u0438. \u042d\u0442\u043e \u0434\u0435\u043b\u0430\u0435\u0442 \u043a\u043e\u0434 \u0431\u043e\u043b\u0435\u0435 \u0447\u0438\u0442\u0430\u0435\u043c\u044b\u043c, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043a\u043e\u0434\u043e\u0432\u0430\u044f \u0431\u0430\u0437\u0430 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0430 \u043d\u0430 \u0431\u043e\u043b\u0435\u0435 \u043c\u0435\u043b\u043a\u0438\u0435, \u043c\u043d\u043e\u0433\u043e\u0440\u0430\u0437\u043e\u0432\u044b\u0435 \u0431\u043b\u043e\u043a\u0438. \u2013 <a href=\"https:\/\/medium.com\/u\/9cf5c71f047d?source=post_page-----ca2e47d1bf97--------------------------------\">Bikash Paneru<\/a>. <a href=\"https:\/\/medium.com\/better-programming\/how-to-write-better-functional-components-in-react-bc974f777145\">\u041a\u0430\u043a \u043b\u0443\u0447\u0448\u0435 \u043f\u0438\u0441\u0430\u0442\u044c \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0432 React.<\/a><\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u043f\u0440\u043e\u0432\u0435\u0434\u0435\u043c \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433 useBrowsers(), \u0447\u0442\u043e\u0431\u044b \u0432\u0435\u0440\u043d\u0443\u0442\u044c \u0432\u0430\u043b\u0438\u0434\u043d\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442 BrowsersListProps. \u042f \u0442\u0430\u043a\u0436\u0435 \u043e\u0442\u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043b \u00abloading\u00bb: \u0442\u0435\u043f\u0435\u0440\u044c \u043f\u0440\u043e\u043f\u0441 \u0431\u0443\u0434\u0435\u0442 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d \u0432 \u00abtrue\u00bb \u043f\u0435\u0440\u0435\u0434 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u043c \u0438 \u043d\u0430 \u00abfalse\u00bb \u2013 \u043f\u043e\u0441\u043b\u0435.<\/p>\n<p><iframe id=\"604b7c0b8b25a4d2350c14bd\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b7c0b8b25a4d2350c14bd\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u0412\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u043d\u0435\u043f\u043b\u043e\u0445\u043e, \u043d\u043e \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u043e\u0439\u0442\u0438 \u0434\u0430\u043b\u044c\u0448\u0435 \u0438 \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043c\u043d\u043e\u0433\u043e\u0440\u0430\u0437\u043e\u0432\u044b\u0439 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u0431\u043b\u043e\u043a. \u0424\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b \u00ab\u0437\u0430\u043f\u0440\u043e\u0441\u0438\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0438 \u0441\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432 \u0441\u0442\u0435\u0439\u0442, \u043f\u043e\u043a\u0430 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442\u0441\u044f \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0430\u00bb \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u043a\u0430\u043a \u043a\u0440\u0443\u0442\u043e\u0439 \u043c\u043d\u043e\u0433\u043e\u0440\u0430\u0437\u043e\u0432\u044b\u0439 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u0431\u043b\u043e\u043a. \u041c\u044b \u0445\u043e\u0442\u0438\u043c \u043e\u0442\u0434\u0435\u043b\u0438\u0442\u044c \u0435\u0433\u043e \u043e\u0442 useBrowsers().<\/p>\n<p>\u041a\u0430\u043a \u0432\u0441\u0435\u0433\u0434\u0430, \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043d\u0430\u0447\u043d\u0451\u043c \u0441 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0442\u0438\u043f\u043e\u0432. \u041c\u044b \u0445\u043e\u0442\u0438\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0445\u0443\u043a useFetch(), \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043c\u043e\u0436\u0435\u0442 \u0445\u0440\u0430\u043d\u0438\u0442\u044c \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u0432 \u0441\u0442\u0435\u0439\u0442\u0435, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0432\u043a\u043b\u044e\u0447\u0430\u0442\u044c \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438. \u041c\u044b \u0442\u0430\u043a\u0436\u0435 \u0445\u043e\u0442\u0438\u043c \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c \u0444\u043e\u0440\u043c\u0443 \u0434\u0430\u043d\u043d\u044b\u0445, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u043e\u0442 API, \u043a\u0430\u043a FetchBrowsersResults:<\/p>\n<p><iframe id=\"604b7c378a93442df67822a2\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b7c378a93442df67822a2\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u041d\u0435\u043f\u043b\u043e\u0445\u043e \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442, \u0442\u0435\u043f\u0435\u0440\u044c \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u043c \u0442\u0435\u043b\u043e useFetch() \u0438 \u043f\u0435\u0440\u0435\u043c\u0435\u0441\u0442\u0438\u043c \u0435\u0433\u043e \u0432 \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0439 \u0444\u0430\u0439\u043b useFetch.ts:<\/p>\n<p><iframe id=\"604b7c45aa2e6ed27439fa28\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b7c45aa2e6ed27439fa28\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u042f \u0442\u0430\u043a\u0436\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u043b \u043d\u043e\u0442\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438 \u043d\u0430 \u0441\u043b\u0443\u0447\u0430\u0439 \u043e\u0448\u0438\u0431\u043a\u0438 \u0437\u0430\u043f\u0440\u043e\u0441\u0430. \u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0443\u0432\u0438\u0434\u0438\u0442 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043e\u0448\u0438\u0431\u043a\u0438.<\/p>\n<p>useFetch() \u2013 \u044d\u0442\u043e \u043c\u043d\u043e\u0433\u043e\u0440\u0430\u0437\u043e\u0432\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043d\u0430\u0432\u0435\u0440\u043d\u044f\u043a\u0430 \u0441\u044d\u043a\u043e\u043d\u043e\u043c\u0438\u0442 \u043d\u0430\u043c \u0432\u0440\u0435\u043c\u044f \u0432 \u0431\u0443\u0434\u0443\u0449\u0435\u043c. \u0421 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u044d\u0442\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u043c\u044b \u0441\u0442\u0430\u043b\u0438 \u0431\u043e\u043b\u0435\u0435 \u0431\u044b\u0441\u0442\u0440\u044b\u043c React-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u043c.<\/p>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u0437\u0430\u0439\u043c\u0451\u043c\u0441\u044f \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u043e\u043c \u0445\u0443\u043a\u0430 useBrowsers():<\/p>\n<p><iframe id=\"604b7c5696f977d25608baa0\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b7c5696f977d25608baa0\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u0421\u0440\u0430\u0432\u043d\u0438\u0442\u0435 \u0441<a href=\"https:\/\/gist.github.com\/aleksejkozin\/98ebb0c3fc826c23bbd9afc30cfda24f\"> \u0438\u0437\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u044b\u043c useBrowsers<u>()<\/u><\/a>, \u043e\u043d \u043d\u0430\u043c\u043d\u043e\u0433\u043e \u043c\u0435\u043d\u044c\u0448\u0435 \u043f\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u0443 \u0438 \u043f\u0440\u043e\u0441\u0442 \u0434\u043b\u044f \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f.<\/p>\n<p>\u042f \u043d\u0435 \u0432\u0438\u0436\u0443 \u043b\u043e\u0433\u0438\u043a\u0438, \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u043c\u043e\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0431\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e, \u0438\u0437 \u044d\u0442\u043e\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430. \u0418\u0442\u0430\u043a, \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u0434\u0432\u0438\u0433\u0430\u0442\u044c\u0441\u044f \u0434\u0430\u043b\u044c\u0448\u0435.<\/p>\n<h2>4 \u043f\u0440\u043e\u0441\u0442\u044b\u0445 \u0441\u043e\u0432\u0435\u0442\u0430, \u043a\u0430\u043a \u0441\u0442\u0430\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u0431\u044b\u0441\u0442\u0440\u044b\u043c React-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u043c.<\/h2>\n<p>\u0421 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0447\u0430\u0441\u0442\u044c\u044e \u043c\u044b \u0437\u0430\u043a\u043e\u043d\u0447\u0438\u043b\u0438, \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043d\u0435\u043c\u043d\u043e\u0433\u043e \u0440\u0430\u0441\u0441\u043b\u0430\u0431\u0438\u043c\u0441\u044f. \u042f \u0434\u0430\u043c \u0432\u0430\u043c 4 \u043f\u0440\u043e\u0441\u0442\u044b\u0445 \u0441\u043e\u0432\u0435\u0442\u0430.<\/p>\n<h2>1. \u041d\u0438\u043a\u043e\u0433\u0434\u0430 \u043d\u0435 \u0444\u043e\u0440\u043c\u0430\u0442\u0438\u0440\u0443\u0439\u0442\u0435 \u043a\u043e\u0434 \u0432\u0440\u0443\u0447\u043d\u0443\u044e.<\/h2>\n<p>\u0412\u0430\u0448\u0430 IDE \u0434\u043e\u043b\u0436\u043d\u0430 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0432\u0430\u043c \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u00ab\u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0430 \u043a\u043e\u0434\u0430\u00bb. \u0412\u0430\u0448 \u043f\u0440\u043e\u0435\u043a\u0442 \u043d\u0430 React \u0434\u043e\u043b\u0436\u0435\u043d \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c \u0444\u0430\u0439\u043b\u044b .eslintrc.js \u0438 .prettierrc.js. \u041e\u043d\u0438 \u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u044e\u0442 \u043b\u0438\u043d\u0442\u0438\u043d\u0433 \u0438 \u0441\u0442\u0438\u043b\u044c \u043a\u043e\u0434\u0430. \u0412\u044b \u0434\u043e\u043b\u0436\u043d\u044b \u0438\u043c\u0435\u0442\u044c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0442\u044c \u044d\u0442\u043e\u0442 \u0441\u0442\u0438\u043b\u044c, \u043d\u0430\u0436\u0430\u0432 \u0433\u043e\u0440\u044f\u0447\u0443\u044e \u043a\u043b\u0430\u0432\u0438\u0448\u0443:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/883\/48b\/97e\/88348b97ebfb3110bb7c1a39d7d34c26.gif\" alt=\"\u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0430\" title=\"\u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0430\" width=\"600\" height=\"510\"><figcaption>\u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0430<\/figcaption><\/figure>\n<h2>2. \u041d\u0438\u043a\u043e\u0433\u0434\u0430 \u043d\u0435 \u0438\u043c\u043f\u043e\u0440\u0442\u0438\u0440\u0443\u0439\u0442\u0435 \u043c\u043e\u0434\u0443\u043b\u0438 \u0432\u0440\u0443\u0447\u043d\u0443\u044e.<\/h2>\n<p>\u0412\u0430\u0448\u0430 IDE \u0434\u043e\u043b\u0436\u043d\u0430 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0432\u0430\u043c \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u00ab\u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0438\u043c\u043f\u043e\u0440\u0442\u0430\u00bb. \u041d\u0438\u043a\u043e\u0433\u0434\u0430 \u043d\u0435 \u0432\u0432\u043e\u0434\u0438\u0442\u0435 \u00ab..\/..\/..\/\u00bb \u0432\u0440\u0443\u0447\u043d\u0443\u044e \u0438 \u043d\u0435 \u0442\u0440\u0430\u0442\u044c\u0442\u0435 \u0432\u0440\u0435\u043c\u044f \u043d\u0430 \u0432\u0432\u043e\u0434\/\u0443\u0434\u0430\u043b\u0435\u043d\u0438\u0435 \u0438\u043c\u043f\u043e\u0440\u0442\u0430 \u0432\u0440\u0443\u0447\u043d\u0443\u044e.<\/p>\n<p>\u041f\u043e\u043f\u0440\u043e\u0431\u0443\u0439\u0442\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u00ab\u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0438\u043c\u043f\u043e\u0440\u0442\u0430\u00bb \u0432 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0438:<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/f04\/3bc\/f9b\/f043bcf9b530bb1eab70a9a19c20d6a4.gif\" alt=\"\u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u0441\u0435\u044a \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0445 \u0438\u043c\u043f\u043e\u0440\u0442\u043e\u0432.\" title=\"\u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u0441\u0435\u044a \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0445 \u0438\u043c\u043f\u043e\u0440\u0442\u043e\u0432.\" width=\"400\" height=\"430\"><figcaption>\u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u0441\u0435\u044a \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0445 \u0438\u043c\u043f\u043e\u0440\u0442\u043e\u0432.<\/figcaption><\/figure>\n<h2>3. \u041f\u0435\u0440\u0435\u043c\u0435\u0449\u0430\u0439\u0442\u0435\u0441\u044c \u043f\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0443 \u043a\u0430\u043a \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b<\/h2>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b \u0441\u0442\u0440\u043e\u0438\u0442\u0435 \u0441\u0432\u043e\u0439 \u043f\u0440\u043e\u0435\u043a\u0442 \u0438\u0437 \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u0445 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445 \u0447\u0430\u0441\u0442\u0435\u0439, \u0443 \u0432\u0430\u0441 \u0431\u0443\u0434\u0435\u0442 \u043c\u043d\u043e\u0433\u043e \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u0445 \u0444\u0430\u0439\u043b\u043e\u0432 \u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e. \u0421\u043a\u043e\u0440\u043e \u0432\u0430\u043c \u0441\u0442\u0430\u043d\u0435\u0442 \u044f\u0441\u043d\u043e, \u0447\u0442\u043e \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u00ab\u043c\u044b\u0448\u0438 \u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u044b\u0445 \u0432\u043a\u043b\u0430\u0434\u043e\u043a\u00bb \u0438 \u00ab\u0432\u044b\u0431\u043e\u0440\u0430 \u0444\u0430\u0439\u043b\u0430 \u0432 \u0441\u043f\u0438\u0441\u043a\u0435 \u0444\u0430\u0439\u043b\u043e\u0432\u00bb \u0441\u0442\u0430\u043d\u0435\u0442 \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043d\u0435\u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0439.<\/p>\n<p>\u041f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u0442\u0435 \u043d\u0430 \u044d\u0442\u0443 \u043e\u0433\u0440\u043e\u043c\u043d\u0443\u044e \u0444\u0430\u0439\u043b\u043e\u0432\u0443\u044e \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0443 \u043a\u0440\u043e\u0448\u0435\u0447\u043d\u043e\u0433\u043e \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f:<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/7aa\/8fe\/d4e\/7aa8fed4e713a59bc9b86449d49f2715.gif\" alt=\"\u041e\u0433\u0440\u043e\u043c\u043d\u0430\u044f \u0444\u0430\u0439\u043b\u043e\u0432\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\" title=\"\u041e\u0433\u0440\u043e\u043c\u043d\u0430\u044f \u0444\u0430\u0439\u043b\u043e\u0432\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\" width=\"400\" height=\"366\"><figcaption>\u041e\u0433\u0440\u043e\u043c\u043d\u0430\u044f \u0444\u0430\u0439\u043b\u043e\u0432\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/figcaption><\/figure>\n<p>\u0417\u043d\u0430\u0435\u0442\u0435 \u043b\u0438 \u0432\u044b, \u043a\u0430\u043a \u043c\u0443\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043f\u044b\u0442\u0430\u0442\u044c\u0441\u044f \u043d\u0430\u0439\u0442\u0438 \u043d\u0443\u0436\u043d\u044b\u0439 \u0444\u0430\u0439\u043b \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0430\u0445?<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/36f\/7e8\/1ee\/36f7e81ee56e19fcafc95a54edb9121d.png\" alt=\"\u041e\u0442\u043a\u0440\u044b\u0442\u043e 10 \u0432\u043a\u043b\u0430\u0434\u043e\u043a. \u0413\u0434\u0435 \u0444\u0430\u0439\u043b, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u044f \u0438\u0449\u0443?\" title=\"\u041e\u0442\u043a\u0440\u044b\u0442\u043e 10 \u0432\u043a\u043b\u0430\u0434\u043e\u043a. \u0413\u0434\u0435 \u0444\u0430\u0439\u043b, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u044f \u0438\u0449\u0443?\" width=\"1974\" height=\"254\"><figcaption>\u041e\u0442\u043a\u0440\u044b\u0442\u043e 10 \u0432\u043a\u043b\u0430\u0434\u043e\u043a. \u0413\u0434\u0435 \u0444\u0430\u0439\u043b, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u044f \u0438\u0449\u0443?<\/figcaption><\/figure>\n<p>\u0412\u0430\u0448\u0430 IDE \u0434\u043e\u043b\u0436\u043d\u0430 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0432\u0430\u043c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b:<\/p>\n<ul>\n<li>\n<p>\u043f\u0435\u0440\u0435\u0439\u0442\u0438 \u043a \u0444\u0430\u0439\u043b\u0443 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0441\u0442\u0440\u043e\u043a\u0438 \u043f\u043e\u0438\u0441\u043a\u0430;<\/p>\n<\/li>\n<li>\n<p>\u043f\u0435\u0440\u0435\u0439\u0442\u0438 \u043a \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0443 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0441\u0442\u0440\u043e\u043a\u0438 \u043f\u043e\u0438\u0441\u043a\u0430;<\/p>\n<\/li>\n<li>\n<p>\u043f\u0435\u0440\u0435\u0439\u0442\u0438 \u043a \u0440\u0430\u043d\u0435\u0435 \u043e\u0442\u043a\u0440\u044b\u0442\u043e\u043c\u0443 \u0444\u0430\u0439\u043b\u0443;<\/p>\n<\/li>\n<li>\n<p>\u043f\u0435\u0440\u0435\u0439\u0442\u0438 \u043a \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043a\u0443\u0440\u0441\u043e\u0440\u0430;<\/p>\n<\/li>\n<li>\n<p>\u043f\u0435\u0440\u0435\u0439\u0442\u0438 \u043a \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430.<\/p>\n<\/li>\n<\/ul>\n<p>\u0418\u0437\u0443\u0447\u0438\u0442\u0435 \u0433\u043e\u0440\u044f\u0447\u0438\u0435 \u043a\u043b\u0430\u0432\u0438\u0448\u0438 \u0441\u0432\u043e\u0435\u0439 IDE. \u042d\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u0435\u0442 \u0432\u0430\u0448\u0443 \u0440\u0430\u0431\u043e\u0442\u0443 \u0433\u043b\u0430\u0434\u043a\u043e\u0439, \u043a\u0430\u043a \u043c\u0430\u0441\u043b\u043e.<\/p>\n<h2>4. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u043b\u0438\u043d\u0442\u0438\u043d\u0433 ESLint<\/h2>\n<p>\u041a\u0430\u0436\u0434\u044b\u0439 React-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0437\u043d\u0430\u0435\u0442 \u043e \u0431\u043e\u043b\u0438 \u043d\u0435\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u0439 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u0445\u0443\u043a\u043e\u0432 useEffect\/Memo\/Callback. \u0412 \u043d\u0438\u0445 \u0432\u0441\u0435\u0433\u0434\u0430 \u0441\u043b\u043e\u0436\u043d\u043e \u043d\u0430\u0439\u0442\u0438 \u043e\u0448\u0438\u0431\u043a\u0438:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/139\/4ec\/4e1\/1394ec4e13b8a65f6608ed9a1b46bbf8.png\" alt=\"\u041d\u0430\u0439\u0442\u0438 \u044d\u0442\u0438 \u043e\u0448\u0438\u0431\u043a\u0438 \u0431\u0435\u0437 \u043b\u0438\u043d\u0442\u0438\u043d\u0433\u0430 \u043e\u0447\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e\" title=\"\u041d\u0430\u0439\u0442\u0438 \u044d\u0442\u0438 \u043e\u0448\u0438\u0431\u043a\u0438 \u0431\u0435\u0437 \u043b\u0438\u043d\u0442\u0438\u043d\u0433\u0430 \u043e\u0447\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e\" width=\"1436\" height=\"364\"><figcaption>\u041d\u0430\u0439\u0442\u0438 \u044d\u0442\u0438 \u043e\u0448\u0438\u0431\u043a\u0438 \u0431\u0435\u0437 \u043b\u0438\u043d\u0442\u0438\u043d\u0433\u0430 \u043e\u0447\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u043e<\/figcaption><\/figure>\n<p>ESLint \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0431\u0435\u0437 \u0442\u0440\u0443\u0434\u0430 \u043a\u0435\u0448\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u044d\u0442\u0438 \u043e\u0448\u0438\u0431\u043a\u0438.<\/p>\n<p>\u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438, \u0442\u0430\u043a\u0438\u0435 \u043a\u0430\u043a eslint \u0438 typescript, \u043f\u043e\u043c\u043e\u0433\u0430\u044e\u0442 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c \u043a\u043e\u0434\u043e\u0432\u0443\u044e \u0431\u0430\u0437\u0443 \u0432 \u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u043a\u043e\u043c\u0430\u043d\u0434\u0435. \u0425\u043e\u0440\u043e\u0448\u0438\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0443\u043c\u0435\u0435\u0442 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c. \u0425\u043e\u0440\u043e\u0448\u0438\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0443\u043c\u0435\u0435\u0442 \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0432 \u043a\u043e\u043c\u0430\u043d\u0434\u0435. \u2013 <a href=\"https:\/\/medium.com\/u\/97cb4df60473?source=post_page-----ca2e47d1bf97--------------------------------\">Roman Nguyen<\/a>. <a href=\"https:\/\/blog.usejournal.com\/architecting-your-react-application-5af9cd65a891\">\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u044b \u0432\u0430\u0448\u0435\u0433\u043e React \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041f\u0435\u0440\u0441\u043f\u0435\u043a\u0442\u0438\u0432\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0438 \u0431\u0438\u0437\u043d\u0435\u0441\u0430, \u043e \u0447\u0451\u043c \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0437\u043d\u0430\u0442\u044c.<\/a><\/p>\n<p>\u0412\u0441\u0435 \u044d\u0442\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b \u0432 IDE Webstorm. \u042f \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u044e \u0432\u0430\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c Webstorm \u0434\u043b\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u043d\u0430 TypeScript \u0441 React.<\/p>\n<h2>\u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435: \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0431\u043b\u043e\u043a\u043e\u0432<\/h2>\n<p>\u0418\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u0431\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 \u2013 \u044d\u0442\u043e \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u043f\u0438\u0441\u0430\u0442\u044c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438.<\/p>\n<p>\u0427\u0442\u043e\u0431\u044b \u0431\u044b\u0442\u044c \u0431\u044b\u0441\u0442\u0440\u044b\u043c, \u0432\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e:<\/p>\n<ul>\n<li>\n<p>\u041e\u0442\u0434\u0435\u043b\u0438\u0442\u044c \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0443 \u043e\u0442 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<\/li>\n<li>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c TypeScript, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0442\u044c \u043c\u0435\u043d\u044c\u0448\u0435 \u043e\u0448\u0438\u0431\u043e\u043a.<\/p>\n<\/li>\n<li>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c TypeScript \u0434\u043b\u044f \u0432\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u043c\u043e\u0449\u043d\u044b\u0445 \u0444\u0443\u043d\u043a\u0446\u0438\u0439 IDE: \u043b\u0438\u043d\u0442\u0438\u043d\u0433\u0430, \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0430 \u0438\u043c\u0435\u043d, \u0430\u0432\u0442\u043e\u0437\u0430\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p>\u041e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0442\u044c \u0442\u0438\u043f\u044b \u043f\u0435\u0440\u0435\u0434 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435\u043c \u043a\u043e\u0434\u0430 \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u044b.<\/p>\n<\/li>\n<li>\n<p>\u0420\u0430\u0437\u0434\u0435\u043b\u044f\u0442\u044c \u0441\u0432\u043e\u0439 \u043a\u043e\u0434 \u043d\u0430 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u0445 \u0444\u0430\u0439\u043b\u043e\u0432 \u043c\u043d\u043e\u0433\u043e\u043a\u0440\u0430\u0442\u043d\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f, \u0447\u0442\u043e\u0431\u044b \u0443\u043c\u0435\u043d\u044c\u0448\u0438\u0442\u044c \u0431\u0435\u0441\u043f\u043e\u0440\u044f\u0434\u043e\u043a.<\/p>\n<\/li>\n<li>\n<p>\u0421 \u043f\u043e\u043c\u043e\u0449\u044c\u044e IDE \u0444\u043e\u0440\u043c\u0430\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043a\u043e\u0434 \u0438 \u0438\u043c\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043c\u043e\u0434\u0443\u043b\u0438.<\/p>\n<\/li>\n<li>\n<p>\u041f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u0442\u044c \u043f\u043e \u0444\u0430\u0439\u043b\u0430\u043c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0433\u043e\u0440\u044f\u0447\u0438\u0445 \u043a\u043b\u0430\u0432\u0438\u0448.<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u0430\u043a\u0442\u0438\u043a\u0430 \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0430.<\/p>\n<\/li>\n<\/ul>\n<p>\u041c\u044b \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u043e\u0442\u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043b\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 &lt;Browsers \/&gt;. \u041f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u0442\u0435 \u043d\u0430<a href=\"https:\/\/gist.github.com\/aleksejkozin\/daed6f5b9c206a43f93380baa7790fb5\"> \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442<\/a>: \u044d\u0442\u043e \u043e\u0433\u0440\u043e\u043c\u043d\u044b\u0439, \u0441\u043b\u043e\u0436\u043d\u044b\u0439 \u0434\u043b\u044f \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f \u043c\u043e\u043d\u043e\u043b\u0438\u0442. \u0422\u0430\u043a\u043e\u0439 \u043a\u043e\u0434 \u043a\u0430\u0436\u0435\u0442\u0441\u044f \u0442\u044f\u0436\u0451\u043b\u044b\u043c \u0438 \u0437\u0430\u043c\u0435\u0434\u043b\u044f\u0435\u0442 \u043d\u0430\u0441.<\/p>\n<p>\u0412\u0437\u0433\u043b\u044f\u043d\u0438\u0442\u0435 \u043d\u0430 \u044d\u0442\u0443 \u043b\u0451\u0433\u043a\u0443\u044e, \u043a\u0430\u043a \u043f\u0451\u0440\u044b\u0448\u043a\u043e, \u043a\u0440\u0430\u0441\u043e\u0442\u0443:<\/p>\n<p><iframe id=\"604b7d6d30f707d266c0ec9b\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b7d6d30f707d266c0ec9b\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u041c\u044b \u0441\u0434\u0435\u043b\u0430\u043b\u0438 \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u0434\u043b\u044f \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 + \u0438\u0437\u0432\u043b\u0435\u043a\u043b\u0438 2 \u043e\u0447\u0435\u043d\u044c \u0443\u0434\u043e\u0431\u043d\u044b\u0435 \u043c\u043d\u043e\u0433\u043e\u0440\u0430\u0437\u043e\u0432\u044b\u0435 \u0434\u0435\u0442\u0430\u043b\u0438:<\/p>\n<ul>\n<li>\n<p>useFetch();<\/p>\n<\/li>\n<li>\n<p>&lt;UIFriendlyList \/&gt;.<\/p>\n<\/li>\n<\/ul>\n<p>\u041c\u044b \u043c\u043e\u0436\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u044d\u0442\u043e\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u043c\u0435\u0441\u0442\u0430\u0445 \u043d\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438, \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e, \u0434\u0430\u0436\u0435 \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445. \u042d\u0442\u043e \u043d\u0430\u0432\u0435\u0440\u043d\u044f\u043a\u0430 \u0443\u0441\u043a\u043e\u0440\u0438\u0442 \u043f\u0440\u043e\u0446\u0435\u0441\u0441 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438.<\/p>\n<h2>\u041f\u043e\u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u0438\u0440\u0443\u0439\u0442\u0435 \u0441 \u043a\u043e\u0434\u043e\u043c \u0438\u0437 \u0441\u0442\u0430\u0442\u044c\u0438<\/h2>\n<p>\u041f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u0442\u0435 <a href=\"https:\/\/codesandbox.io\/s\/browsers-refactor-00x9b\">\u0438\u0442\u043e\u0433\u043e\u0432\u044b\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442<\/a> \u0432 Codesandbox, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0438 \u0443\u0437\u043d\u0430\u0442\u044c \u0431\u043e\u043b\u044c\u0448\u0435. \u042d\u0442\u043e\u0442 \u043a\u043e\u0434 \u043d\u0430\u043f\u0438\u0441\u0430\u043d \u043d\u0430 React, \u043e\u043d \u043d\u0435\u043c\u043d\u043e\u0433\u043e \u043e\u0442\u043b\u0438\u0447\u0430\u0435\u0442\u0441\u044f \u043e\u0442 \u043a\u043e\u0434\u0430 React Native \u0432 \u0441\u0442\u0430\u0442\u044c\u0435.<\/p>\n<h2>\u0427\u0442\u043e \u0434\u0430\u043b\u044c\u0448\u0435?<\/h2>\n<ul>\n<li>\n<p>\u041c\u043d\u043e\u0433\u043e \u0447\u0438\u0442\u0430\u0442\u044c.<\/p>\n<\/li>\n<li>\n<p>\u041c\u043d\u043e\u0433\u043e \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u043e\u0432\u0430\u0442\u044c\u0441\u044f.<\/p>\n<\/li>\n<li>\n<p>\u0417\u0430\u0434\u0430\u0432\u0430\u0442\u044c \u0432\u043e\u043f\u0440\u043e\u0441\u044b. \u041e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u043f\u043e\u0434 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0451\u0439 \u0432 \u0440\u0430\u0437\u0434\u0435\u043b\u0435 \u043a\u043e\u043c\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u0435\u0432.<\/p>\n<\/li>\n<\/ul>\n<p>\u0418 \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0435\u0435, \u043d\u043e \u0441\u0430\u043c\u043e\u0435 \u0432\u0430\u0436\u043d\u043e\u0435:<\/p>\n<ul>\n<li>\n<p>\u0410\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0442\u0435\u0441\u0442\u0438\u0440\u0443\u0439\u0442\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b React.<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u0430\u043a\u0442\u0438\u043a\u0430 TDD.<\/p>\n<\/li>\n<\/ul>\n<p>\u041d\u0430\u0447\u0430\u0442\u044c \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u0430\u0448 \u043a\u043e\u0434 \u0441\u043b\u043e\u0436\u043d\u043e, \u043d\u043e \u044d\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u0435\u0442 \u0432\u0430\u0448\u0443 \u0436\u0438\u0437\u043d\u044c \u0441\u043b\u0430\u0434\u043a\u043e\u0439, \u043a\u0430\u043a \u043b\u0435\u0434\u0435\u043d\u0435\u0446. \u041f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u0442\u0435 <a href=\"https:\/\/medium.com\/free-code-camp\/how-to-build-sturdy-react-apps-with-tdd-and-the-react-testing-library-47ad3c5c8e47\">\u0441\u0442\u0430\u0442\u044c\u044e<\/a> Ian Wilson &#171;\u041a\u0430\u043a \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043d\u0430\u0434\u0451\u0436\u043d\u044b\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f React \u0441 TDD \u0438 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u043e\u0439 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f React&#187;, \u044d\u0442\u043e \u0445\u043e\u0440\u043e\u0448\u0430\u044f \u0442\u043e\u0447\u043a\u0430 \u0434\u043b\u044f \u043d\u0430\u0447\u0430\u043b\u0430 \u0438\u0437\u0443\u0447\u0435\u043d\u0438\u044f \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f. \u0415\u0436\u0435\u0434\u043d\u0435\u0432\u043d\u043e \u0442\u0440\u0435\u043d\u0438\u0440\u0443\u0439\u0442\u0435 \u0441\u0432\u043e\u0435 \u0440\u0435\u043c\u0435\u0441\u043b\u043e \u0438 \u0441\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0435\u043c \u0432\u044b \u0441\u0442\u0430\u043d\u0435\u0442\u0435 \u043c\u0430\u0441\u0442\u0435\u0440\u043e\u043c. \u0410 \u0442\u0430\u043a\u0436\u0435 \u043d\u0435 \u0437\u0430\u0431\u044b\u0432\u0430\u0439\u0442\u0435 \u043e\u0441\u0432\u0430\u0438\u0432\u0430\u0442\u044c \u043d\u043e\u0432\u043e\u0435 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u0441 \u043d\u0430\u0448\u0435\u0439 \u043f\u043e\u043c\u043e\u0449\u044c\u044e) \u2014 \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u0442\u044c \u0441\u0432\u043e\u044e \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0432 \u0441\u0442\u0440\u0435\u043c\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u044f\u044e\u0449\u0435\u043c\u0441\u044f \u043c\u0438\u0440\u0435 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0439. \u0410 \u043d\u0430\u0448\u0438 \u043c\u0435\u043d\u0442\u043e\u0440\u044b \u0438 \u0447\u0443\u0442\u043a\u0430\u044f \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0430 \u0432 \u044d\u0442\u043e\u043c \u043f\u043e\u043c\u043e\u0433\u0443\u0442.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/5dc\/d67\/e0b\/5dcd67e0bd804aed5ea7f488a557f4aa.jpg\" width=\"894\" height=\"120\"><figcaption><\/figcaption><\/figure>\n<p><a href=\"https:\/\/skillfactory.ru\/courses\/?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_ALLCOURSES&amp;utm_term=regular&amp;utm_content=120321\">\u0423\u0437\u043d\u0430\u0439\u0442\u0435<\/a>, \u043a\u0430\u043a \u043f\u0440\u043e\u043a\u0430\u0447\u0430\u0442\u044c\u0441\u044f \u0432 \u0434\u0440\u0443\u0433\u0438\u0445 \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044f\u0445 \u0438\u043b\u0438 \u043e\u0441\u0432\u043e\u0438\u0442\u044c \u0438\u0445 \u0441 \u043d\u0443\u043b\u044f:<\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/dstpro?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_DSPR&amp;utm_term=regular&amp;utm_content=120321\">\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u044f Data Scientist<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/dataanalystpro?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_DAPR&amp;utm_term=regular&amp;utm_content=120321\">\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u044f Data Analyst<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/dataengineer?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_DEA&amp;utm_term=regular&amp;utm_content=120321\">\u041a\u0443\u0440\u0441 \u043f\u043e Data Engineering<\/a><\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u0414\u0440\u0443\u0433\u0438\u0435 \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u0438 \u0438 \u043a\u0443\u0440\u0441\u044b<\/summary>\n<div class=\"spoiler__content\">\n<p><strong>\u041f\u0420\u041e\u0424\u0415\u0421\u0421\u0418\u0418<\/strong><\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/java?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_JAVA&amp;utm_term=regular&amp;utm_content=120321\">\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u044f Java-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/java-qa-engineer?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_QAJA&amp;utm_term=regular&amp;utm_content=120321\">\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u044f QA-\u0438\u043d\u0436\u0435\u043d\u0435\u0440 \u043d\u0430 JAVA<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/frontend?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_FR&amp;utm_term=regular&amp;utm_content=120321\">\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u044f Frontend-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/cybersecurity?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_HACKER&amp;utm_term=regular&amp;utm_content=120321\">\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u044f \u042d\u0442\u0438\u0447\u043d\u044b\u0439 \u0445\u0430\u043a\u0435\u0440<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/cplus?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_CPLUS&amp;utm_term=regular&amp;utm_content=120321\">\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u044f C++ \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/game-dev?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_GAMEDEV&amp;utm_term=regular&amp;utm_content=120321\">\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u044f \u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0438\u0433\u0440 \u043d\u0430 Unity<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/webdev?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_WEBDEV&amp;utm_term=regular&amp;utm_content=120321\">\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u044f \u0412\u0435\u0431-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/iosdev?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_IOSDEV&amp;utm_term=regular&amp;utm_content=120321\">\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u044f iOS-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0441 \u043d\u0443\u043b\u044f<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/android?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_ANDR&amp;utm_term=regular&amp;utm_content=120321\">\u041f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u044f Android-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0441 \u043d\u0443\u043b\u044f<\/a><\/p>\n<\/li>\n<\/ul>\n<p><strong>\u041a\u0423\u0420\u0421\u042b<\/strong><\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/ml-programma-machine-learning-online?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_ML&amp;utm_term=regular&amp;utm_content=120321\">\u041a\u0443\u0440\u0441 \u043f\u043e Machine Learning<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/ml-and-dl?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_MLDL&amp;utm_term=regular&amp;utm_content=120321\">\u041a\u0443\u0440\u0441 &#171;Machine Learning \u0438 Deep Learning&#187;<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/math-stat-for-ds#syllabus?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_MAT&amp;utm_term=regular&amp;utm_content=100321\">\u041a\u0443\u0440\u0441 &#171;\u041c\u0430\u0442\u0435\u043c\u0430\u0442\u0438\u043a\u0430 \u0434\u043b\u044f Data Science&#187;<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/math_and_ml?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_MATML&amp;utm_term=regular&amp;utm_content=100321\">\u041a\u0443\u0440\u0441 &#171;\u041c\u0430\u0442\u0435\u043c\u0430\u0442\u0438\u043a\u0430 \u0438 Machine Learning \u0434\u043b\u044f Data Science&#187;<\/a>&nbsp;<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/python-for-web-developers?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_PWS&amp;utm_term=regular&amp;utm_content=120321\">\u041a\u0443\u0440\u0441 &#171;Python \u0434\u043b\u044f \u0432\u0435\u0431-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438&#187;<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/algo?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_algo&amp;utm_term=regular&amp;utm_content=120321\">\u041a\u0443\u0440\u0441 &#171;\u0410\u043b\u0433\u043e\u0440\u0438\u0442\u043c\u044b \u0438 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u044b \u0434\u0430\u043d\u043d\u044b\u0445&#187;<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/analytics?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_SDA&amp;utm_term=regular&amp;utm_content=120321\">\u041a\u0443\u0440\u0441 \u043f\u043e \u0430\u043d\u0430\u043b\u0438\u0442\u0438\u043a\u0435 \u0434\u0430\u043d\u043d\u044b\u0445<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/skillfactory.ru\/devops?utm_source=infopartners&amp;utm_medium=habr&amp;utm_campaign=habr_DEVOPS&amp;utm_term=regular&amp;utm_content=120321\">\u041a\u0443\u0440\u0441 \u043f\u043e DevOps<\/a><\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/details>\n<\/div>\n<p> \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 <a href=\"https:\/\/habr.com\/ru\/company\/skillfactory\/blog\/546100\/\"> https:\/\/habr.com\/ru\/company\/skillfactory\/blog\/546100\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"\n<div class=\"post__text post__text_v2\" id=\"post-content-body\">\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442\u0435 \u0441 React \u0438\u043b\u0438 React Native \u0438 \u0447\u0443\u0432\u0441\u0442\u0432\u0443\u0435\u0442\u0435, \u0447\u0442\u043e \u0443 \u0432\u0430\u0441 \u043c\u0435\u0434\u043b\u0435\u043d\u043d\u0430\u044f \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043e\u0434\u0430, \u0432\u044b \u0442\u0440\u0430\u0442\u0438\u0442\u0435 \u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u043f\u043e\u0438\u0441\u043a \u043e\u0448\u0438\u0431\u043e\u043a, \u0430 \u043d\u0435 \u043d\u0430 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043d\u043e\u0432\u043e\u0433\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u0430, \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442\u0435 \u0441 \u0431\u043e\u043b\u044c\u0448\u0438\u043c\u0438 \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u043c\u0438 \u0444\u0430\u0439\u043b\u0430\u043c\u0438 \u0438 \u0432\u0430\u043c \u0441\u043b\u043e\u0436\u043d\u043e \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c \u043d\u0443\u0436\u043d\u044b\u0435 \u0447\u0430\u0441\u0442\u0438 \u043a\u043e\u0434\u0430, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043c\u043d\u043e\u0433\u043e\u043a\u0440\u0430\u0442\u043d\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u0442\u0435 \u043e\u0434\u043d\u0443 \u0438 \u0442\u0443 \u0436\u0435 \u043b\u043e\u0433\u0438\u043a\u0443, \u0442\u043e \u044d\u0442\u0430 \u0441\u0442\u0430\u0442\u044c\u044f \u0434\u043b\u044f \u0432\u0430\u0441. \u0412\u044b \u0443\u0434\u0432\u043e\u0438\u0442\u0435 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043e\u0434\u0430, \u0435\u0441\u043b\u0438 \u043e\u0442\u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u0442\u0435 \u043a\u043e\u0434 \u0432 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438. <\/p>\n<p>\u041c\u044b \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c React \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u043e\u0436\u043d\u043e \u0445\u043e\u0440\u043e\u0448\u043e \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c. \u0418 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0448\u0430\u0433 \u0437\u0430 \u0448\u0430\u0433\u043e\u043c \u0440\u0435\u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u044b\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u0434\u043e \u0445\u043e\u0440\u043e\u0448\u0435\u0433\u043e \u0443\u0440\u043e\u0432\u043d\u044f. \u0412\u044b \u0443\u0432\u0438\u0434\u0438\u0442\u0435 \u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0438\u0434\u0435\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u0432\u044b\u0441\u044f\u0442 \u0432\u0430\u0448\u0443 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043e\u0434\u0430.<\/p>\n<blockquote>\n<p>\u0421 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u043c\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u043c\u0438 \u0438 \u0445\u0443\u043a\u0430\u043c\u0438 \u043b\u0435\u0433\u043a\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0447\u0442\u043e-\u0442\u043e \u043f\u043e\u0442\u0440\u044f\u0441\u0430\u044e\u0449\u0435\u0435. \u042d\u0442\u043e \u043f\u043e\u0445\u043e\u0436\u0435 \u043d\u0430 \u0441\u0431\u043e\u0440\u043a\u0443 \u0447\u0430\u0441\u0442\u0435\u0439 Lego.<\/p>\n<p>\u2013 <a href=\"https:\/\/medium.com\/u\/e986f7cdb458?source=post_page-----ca2e47d1bf97--------------------------------\">Cory House<\/a>. <a href=\"https:\/\/medium.com\/@housecor\/designing-reusable-react-components-1cbeb897b048\">\u041f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 React<\/a><\/p>\n<\/blockquote>\n<blockquote>\n<p>\u0420\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433, \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433 \u0438 \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433 \u2013 \u044d\u0442\u043e \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e; \u0432\u0430\u043c \u043f\u0440\u0438\u0434\u0451\u0442\u0441\u044f \u043c\u0435\u043d\u044f\u0442\u044c \u0441\u0432\u043e\u0439 \u043a\u043e\u0434 \u043c\u043d\u043e\u0433\u043e-\u043c\u043d\u043e\u0433\u043e \u0440\u0430\u0437; \u044d\u0442\u043e \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 \u043f\u0440\u043e\u0446\u0435\u0441\u0441 \u043e\u0431\u0443\u0447\u0435\u043d\u0438\u044f.<\/p>\n<p>\u2014<a href=\"https:\/\/medium.com\/u\/ac4e83345a52?source=post_page-----ca2e47d1bf97--------------------------------\">Tomas Eglinskas<\/a>. <a href=\"https:\/\/medium.com\/free-code-camp\/mindset-lessons-from-a-year-with-react-1de862421981#3bb9\">\u0421\u0430\u043c\u044b\u0435 \u0432\u0430\u0436\u043d\u044b\u0435 \u0443\u0440\u043e\u043a\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u044f \u0438\u0437\u0432\u043b\u0451\u043a \u0437\u0430 \u0433\u043e\u0434 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 React<\/a><\/p>\n<\/blockquote>\n<ul>\n<li>\n<p>\u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u0431\u0443\u0434\u0435\u0442 \u043c\u043d\u043e\u0433\u043e \u043a\u043e\u0434\u0430 \u043d\u0430 React. \u041d\u0435 \u0431\u043e\u0439\u0442\u0435\u0441\u044c \u043a\u043e\u0434\u0430. \u041d\u0435 \u0442\u043e\u0440\u043e\u043f\u0438\u0442\u0435\u0441\u044c, \u043f\u0440\u043e\u0447\u0442\u0438\u0442\u0435 \u0438 \u043f\u043e\u0439\u043c\u0438\u0442\u0435 \u0435\u0433\u043e.&nbsp;<\/p>\n<\/li>\n<li>\n<p>\u042d\u0442\u043e \u0431\u043e\u043b\u044c\u0448\u0430\u044f \u0441\u0442\u0430\u0442\u044c\u044f. \u0421\u043e\u0434\u0435\u0440\u0436\u0430\u043d\u0438\u0435 \u0432\u0441\u0435\u043e\u0431\u044a\u0435\u043c\u043b\u044e\u0449\u0435\u0435. \u041d\u0435 \u0441\u0442\u0435\u0441\u043d\u044f\u0439\u0442\u0435\u0441\u044c \u0441\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c \u044d\u0442\u0443 \u0441\u0442\u0430\u0442\u044c\u044e \u0432 \u0441\u0432\u043e\u0438\u0445 \u0432\u043a\u043b\u0430\u0434\u043a\u0430\u0445 \u0438 \u043f\u0440\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u0435\u0451 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0440\u0430\u0437.<\/p>\n<\/li>\n<li>\n<p>\u0414\u0430\u0436\u0435 \u043d\u0435\u0441\u043c\u043e\u0442\u0440\u044f \u043d\u0430 \u0442\u043e, \u0447\u0442\u043e \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u0442 \u043d\u0430 React Native, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043b\u0435\u0433\u043a\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u044d\u0442\u0443 \u0441\u0442\u0430\u0442\u044c\u044e, \u0447\u0442\u043e\u0431\u044b \u0443\u043b\u0443\u0447\u0448\u0438\u0442\u044c \u0441\u0432\u043e\u0438 \u043d\u0430\u0432\u044b\u043a\u0438 React.<\/p>\n<\/li>\n<\/ul>\n<h2>\u0418\u0441\u0445\u043e\u0434\u043d\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u0442\u044c<\/h2>\n<p>\u041f\u0440\u043e\u0441\u0442\u043e\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442, \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u043d\u044b\u0439 \u0442\u0430\u043a\u0438\u043c \u0436\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u043c, \u043a\u0430\u043a \u0432\u044b. \u0427\u0442\u043e \u043e\u043d \u0434\u0435\u043b\u0430\u0435\u0442:<\/p>\n<ul>\n<li>\n<p>\u041f\u043e\u043b\u0443\u0447\u0430\u0435\u0442 \u0441\u043f\u0438\u0441\u043e\u043a \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432 \u0441 \u0441\u0435\u0440\u0432\u0435\u0440\u0430.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u00ab\u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438\u00bb \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d\u043d\u044b\u0439 \u0441\u043f\u0438\u0441\u043e\u043a \u0432 \u0432\u0438\u0434\u0435 \u0441\u043f\u0438\u0441\u043a\u0430 \u043a\u0430\u0440\u0442\u043e\u0447\u0435\u043a.<\/p>\n<\/li>\n<li>\n<p>\u041a\u043e\u0433\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043d\u0430\u0436\u0438\u043c\u0430\u0435\u0442 \u043d\u0430 \u043a\u0430\u0440\u0442\u043e\u0447\u043a\u0443, \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0435 \u043e\u043a\u043d\u043e \u0441 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u044b\u043c \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435\u043c \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430.<\/p>\n<\/li>\n<\/ul>\n<h3>\u042d\u0442\u043e\u0442 \u043a\u043e\u0434 \u043f\u043e\u0445\u043e\u0436 \u043d\u0430 \u0432\u0430\u0448?<\/h3>\n<p><iframe id=\"604b78c895bc5d2dedbee1b2\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b78c895bc5d2dedbee1b2\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<h2>\u0427\u0435\u043c \u0445\u043e\u0440\u043e\u0448 \u044d\u0442\u043e\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442:<\/h2>\n<ul>\n<li>\n<p>\u041e\u043d \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442: \u0441\u043f\u0438\u0441\u043e\u043a \u0431\u0443\u0434\u0435\u0442 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d \u0438 \u043f\u043e\u043a\u0430\u0437\u0430\u043d \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e \u0441\u043e \u0432\u0441\u0435\u043c\u0438 \u043e\u043f\u0438\u0441\u0430\u043d\u043d\u044b\u043c \u0432\u044b\u0448\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u043e\u043c.<\/p>\n<\/li>\n<li>\n<p>\u041e\u043d \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 React Hooks.<\/p>\n<\/li>\n<\/ul>\n<h2>\u0427\u0442\u043e \u043f\u043b\u043e\u0445\u043e\u0433\u043e \u0432 \u044d\u0442\u043e\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0435<\/h2>\n<p>\u042d\u0442\u043e\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f <strong>\u043c\u043e\u043d\u043e\u043b\u0438\u0442\u043e\u043c<\/strong>, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043e\u043d \u0431\u044b\u043b \u0441\u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d \u0438 \u043d\u0430\u043f\u0438\u0441\u0430\u043d \u0434\u043b\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0432 \u043e\u0434\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435 \u0432 \u043e\u0434\u043d\u043e\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u0438\u043d \u0440\u0430\u0437.<\/p>\n<p><strong>\u0417\u0430\u043f\u043e\u043c\u043d\u0438\u0442\u0435 \u044d\u0442\u0443 \u043c\u0430\u043d\u0442\u0440\u0443:<\/strong><\/p>\n<p>\u0418\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u0431\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 \u2013 \u044d\u0442\u043e \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u043f\u0438\u0441\u0430\u0442\u044c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438.<\/p>\n<p>\u0427\u0435\u043c \u0431\u043e\u043b\u044c\u0448\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0435\u0439 \u0434\u043b\u044f \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0432\u0430\u0448\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0439, \u0442\u0435\u043c \u0432\u044b \u0431\u044b\u0441\u0442\u0440\u0435\u0435. \u042d\u0442\u043e \u0434\u0430\u0451\u0442 \u0432\u0430\u043c \u043e\u0433\u0440\u043e\u043c\u043d\u043e\u0435 \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u043e:<\/p>\n<ul>\n<li>\n<p><strong>\u0412\u044b \u0442\u0440\u0430\u0442\u0438\u0442\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/strong> \u041f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b\/\u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u043c\u043e\u0433\u0443\u0442 \u0441\u043a\u0440\u044b\u0432\u0430\u0442\u044c \u0442\u043e\u043d\u043d\u044b \u043a\u043e\u0434\u0430 \u0432\u043d\u0443\u0442\u0440\u0438 \u0441\u0435\u0431\u044f \u0438 \u043c\u043e\u0433\u0443\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0441\u043e\u0442\u043d\u0438 \u0440\u0430\u0437. \u0410 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0438\u0445 \u043d\u0443\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u0438\u043d \u0440\u0430\u0437. \u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u044c\u0442\u0435, \u0447\u0442\u043e \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437, \u043a\u043e\u0433\u0434\u0430 \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u043e\u0431\u0440\u0430\u0442\u0438\u0442\u044c\u0441\u044f \u043a API, \u0432\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 \u00abfetch(URL)\u00bb, \u0430 \u044d\u0442\u043e \u0437\u0430\u043c\u0435\u0434\u043b\u044f\u0435\u0442 \u0432\u0430\u0448\u0443 \u0440\u0430\u0431\u043e\u0442\u0443.<\/p>\n<\/li>\n<li>\n<p><strong>\u0412\u044b \u0442\u0440\u0430\u0442\u0438\u0442\u0435 \u0435\u0449\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/strong> \u0413\u043e\u0440\u0430\u0437\u0434\u043e \u0431\u044b\u0441\u0442\u0440\u0435\u0435 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u043d\u043e\u0432\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0432 \u043e\u0434\u043d\u043e \u043c\u0435\u0441\u0442\u043e, \u0447\u0435\u043c \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u0438\u0445 \u0432 10 \u0440\u0430\u0437\u043d\u044b\u0445 \u043c\u0435\u0441\u0442. \u0415\u0441\u043b\u0438 \u0432\u044b \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 \u0441\u0432\u043e\u0438 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438, \u0443 \u0432\u0430\u0441 \u0431\u0443\u0434\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u043d\u043e \u043c\u0435\u0441\u0442\u043e \u0434\u043b\u044f \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0432\u0430\u0448\u0438\u0445 \u0444\u0443\u043d\u043a\u0446\u0438\u0439. \u0420\u0435\u0430\u043b\u0438\u0437\u0443\u0439\u0442\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0432 \u043e\u0434\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435, \u0430 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0439\u0442\u0435 \u0432\u0435\u0437\u0434\u0435.<\/p>\n<\/li>\n<li>\n<p><strong>\u0412\u044b \u0442\u0440\u0430\u0442\u0438\u0442\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u043f\u043e\u0438\u0441\u043a \u043e\u0448\u0438\u0431\u043e\u043a.<\/strong> \u0412\u044b \u0431\u0443\u0434\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0443\u0436\u0435 \u043f\u0440\u043e\u0432\u0435\u0440\u0435\u043d\u043d\u044b\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438. \u041d\u043e\u0432\u044b\u0439 \u043a\u043e\u0434 \u043d\u0443\u0436\u043d\u043e \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c, \u043d\u043e \u0441\u0442\u0430\u0440\u043e\u043c\u0443 \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0432\u0435\u0440\u044f\u0442\u044c.<\/p>\n<\/li>\n<li>\n<p><strong>\u0412\u044b \u0442\u0440\u0430\u0442\u0438\u0442\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u0447\u0442\u0435\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/strong> \u0415\u0441\u043b\u0438 \u0432\u044b \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u0431\u043b\u043e\u043a, \u044d\u0442\u043e \u0441\u044d\u043a\u043e\u043d\u043e\u043c\u0438\u0442 \u0432\u0430\u0448\u0435 \u0432\u0440\u0435\u043c\u044f \u043d\u0430 \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430. \u041b\u0435\u0433\u0447\u0435 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u044b \u0438\u0437 \u0437\u043d\u0430\u043a\u043e\u043c\u044b\u0445 \u0447\u0430\u0441\u0442\u0435\u0439.<\/p>\n<\/li>\n<li>\n<p><strong>\u0412\u044b \u0442\u0440\u0430\u0442\u0438\u0442\u0435 \u0435\u0449\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u0447\u0442\u0435\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/strong> \u041e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438 \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u0444\u0430\u0439\u043b\u0430\u0445, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u044b \u0431\u0443\u0434\u0435\u0442\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0441 \u043c\u0435\u043d\u044c\u0448\u0438\u043c\u0438 \u043c\u043e\u0434\u0443\u043b\u044f\u043c\u0438 \u0438 \u043d\u0430 \u0432\u0430\u0448\u0435\u043c \u044d\u043a\u0440\u0430\u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u043c\u0435\u043d\u044c\u0448\u0435 \u043a\u043e\u0434\u0430. \u0422\u0430\u043a\u0436\u0435 \u044d\u0442\u043e \u0443\u043b\u0443\u0447\u0448\u0438\u0442 \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u0432\u0430\u0448\u0435\u0433\u043e \u043a\u043e\u0434\u0430.<\/p>\n<\/li>\n<\/ul>\n<p>\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u043e\u0431\u044b\u0447\u043d\u043e \u0442\u0440\u0430\u0442\u0438\u0442 \u0431\u043e\u043b\u044c\u0448\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u0432\u044b\u044f\u0441\u043d\u0435\u043d\u0438\u0435 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u0434\u0435\u043b\u0430\u0435\u0442 \u043a\u043e\u0434, \u0430 \u043d\u0435 \u043d\u0430 \u0435\u0433\u043e \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435. \u2013 <a href=\"https:\/\/medium.com\/u\/f9f631989d8e?source=post_page-----ca2e47d1bf97--------------------------------\">Alexis Mangin<\/a>. <a href=\"https:\/\/medium.com\/@alexmngn\/why-react-developers-should-modularize-their-applications-d26d381854c1\">\u041f\u043e\u0447\u0435\u043c\u0443 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 React \u0434\u043e\u043b\u0436\u043d\u044b \u0440\u0430\u0437\u0431\u0438\u0432\u0430\u0442\u044c \u0441\u0432\u043e\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0430 \u043c\u043e\u0434\u0443\u043b\u0438?<\/a><\/p>\n<ul>\n<li>\n<p><strong>\u0412\u044b \u043f\u0438\u0448\u0435\u0442\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u0442\u0435\u0441\u0442\u043e\u0432 \u0434\u043b\u044f \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0431\u043b\u043e\u043a\u043e\u0432.<\/strong> \u0422\u0435\u0441\u0442\u044b \u0434\u0435\u043b\u0430\u044e\u0442 \u0432\u0430\u0448\u0443 \u0436\u0438\u0437\u043d\u044c \u0441\u043b\u0430\u0434\u043a\u043e\u0439, \u043a\u0430\u043a \u043c\u0451\u0434, \u043d\u043e \u0441 \u043c\u043e\u043d\u043e\u043b\u0438\u0442\u043e\u043c \u0432\u044b \u043e\u0431\u043d\u0430\u0440\u0443\u0436\u0438\u0442\u0435, \u0447\u0442\u043e \u0441\u043d\u043e\u0432\u0430 \u0438 \u0441\u043d\u043e\u0432\u0430 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442\u0435 \u043e\u0434\u043d\u0443 \u0438 \u0442\u0443 \u0436\u0435 \u043b\u043e\u0433\u0438\u043a\u0443. \u0411\u043e\u043b\u044c\u0448\u0435 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0431\u043b\u043e\u043a\u043e\u0432 = \u043c\u0435\u043d\u044c\u0448\u0435 \u0442\u0435\u0441\u0442\u043e\u0432.<\/p>\n<\/li>\n<\/ul>\n<p>\u041c\u043e\u043d\u043e\u043b\u0438\u0442 = \u043c\u0435\u0434\u043b\u0435\u043d\u043d\u043e\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/p>\n<p>\u041c\u043d\u043e\u0433\u043e\u0440\u0430\u0437\u043e\u0432\u044b\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438 = \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/p>\n<h2>\u041a\u0430\u043a \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u044d\u0442\u0438 100 \u0441\u0442\u0440\u043e\u043a \u043a\u043e\u0434\u0430 \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0438\u0433\u043e\u0434\u043d\u044b\u043c\u0438 \u0434\u043b\u044f \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f<\/h2>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0441\u043d\u0430\u0447\u0430\u043b\u0430 \u043f\u043e\u043f\u0440\u043e\u0431\u0443\u0435\u043c \u0447\u0442\u043e-\u043d\u0438\u0431\u0443\u0434\u044c \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0431\u0430\u0437\u043e\u0432\u043e\u0435 \u0438 \u043f\u0440\u043e\u0441\u0442\u043e\u0435, \u0430 \u0437\u0430\u0442\u0435\u043c \u043f\u0435\u0440\u0435\u0439\u0434\u0451\u043c \u043a \u0431\u043e\u043b\u0435\u0435 \u0441\u043b\u043e\u0436\u043d\u044b\u043c \u0432\u0435\u0449\u0430\u043c. \u041a\u0430\u043a \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0440\u0430\u0441\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c \u044d\u0442\u0438 100 \u0441\u0442\u0440\u043e\u043a \u0432 \u0440\u0430\u0437\u043d\u044b\u0435 \u043c\u0435\u0441\u0442\u0430?<\/p>\n<h2>\u041f\u0435\u0440\u0435\u043d\u0435\u0441\u0442\u0438 \u043a\u043e\u043d\u0441\u0442\u0430\u043d\u0442\u044b \u0432 \u043f\u0440\u043e\u043f\u0441\u044b \u0432\u0430\u0448\u0435\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430<\/h2>\n<p><iframe id=\"604b78afaa2e6ed27439fa27\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b78afaa2e6ed27439fa27\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u041c\u044b \u043f\u0435\u0440\u0435\u043c\u0435\u0441\u0442\u0438\u043b\u0438 \u043a\u043e\u043d\u0441\u0442\u0430\u043d\u0442\u0443 URL-\u0430\u0434\u0440\u0435\u0441\u0430 \u0432 \u043f\u0440\u043e\u043f\u0441\u044b \u0438 \u0443\u0436\u0435 \u043c\u043e\u0436\u0435\u043c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 Browser \u0441 \u0434\u0440\u0443\u0433\u0438\u043c URL-\u0430\u0434\u0440\u0435\u0441\u043e\u043c. \u041d\u0435\u0441\u043e\u043c\u043d\u0435\u043d\u043d\u043e, \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u0432\u043b\u0438\u044f\u043d\u0438\u0435 \u043d\u0430 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435, \u043d\u043e \u044d\u0442\u043e \u043e\u0447\u0435\u043d\u044c \u043b\u0435\u0433\u043a\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c.<\/p>\n<p>\u0420\u0430\u0437\u043e\u0433\u0440\u0435\u043b\u0438\u0441\u044c? \u0422\u043e\u0433\u0434\u0430 \u0434\u0430\u0432\u0430\u0439 \u043f\u043e\u043f\u0440\u043e\u0431\u0443\u0435\u043c \u0447\u0442\u043e-\u043d\u0438\u0431\u0443\u0434\u044c \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043a\u0440\u0443\u0442\u043e\u0435.<\/p>\n<h2>\u0420\u0430\u0437\u0434\u0435\u043b\u0438\u0442\u0435 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0443 \u0438 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441<\/h2>\n<blockquote>\n<p>\u0416\u0438\u0437\u043d\u044c \u043f\u0440\u043e\u0449\u0435, \u043a\u043e\u0433\u0434\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 \u043d\u0435 \u0437\u043d\u0430\u044e\u0442 \u043e \u0441\u0435\u0442\u0438, \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0435 \u0438\u043b\u0438 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u044f \u043e\u0434\u043d\u0438 \u0438 \u0442\u0435 \u0436\u0435 \u043f\u0440\u043e\u043f\u0441\u044b, \u0432\u0441\u0435\u0433\u0434\u0430 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0439\u0442\u0435 \u043e\u0434\u043d\u0438 \u0438 \u0442\u0435 \u0436\u0435 \u0434\u0430\u043d\u043d\u044b\u0435. \u2013 <a href=\"https:\/\/medium.com\/u\/c359511de780?source=post_page-----ca2e47d1bf97--------------------------------\">Eric Elliott<\/a>, <a href=\"https:\/\/medium.com\/javascript-scene\/the-missing-introduction-to-react-62837cb2fd76\">\u041d\u0435\u0434\u043e\u0441\u0442\u0430\u044e\u0449\u0435\u0435 \u0432\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0432 React<\/a><\/p>\n<\/blockquote>\n<p><strong>\u042d\u0442\u043e \u0441\u0430\u043c\u0430\u044f \u0432\u0430\u0436\u043d\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0441\u0442\u0430\u0442\u044c\u0438.<\/strong> \u0415\u0441\u043b\u0438 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0432\u044b\u0443\u0447\u0438\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u043d\u0443 \u0432\u0435\u0449\u044c, \u043f\u0443\u0441\u0442\u044c \u0435\u044e \u0431\u0443\u0434\u0435\u0442 \u043e\u043d\u0430:<\/p>\n<p>\u0418\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u0431\u044b\u0442\u044c \u0431\u044b\u0441\u0442\u0440\u044b\u043c React-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u043c \u2013 \u044d\u0442\u043e \u0438\u0441\u043a\u0443\u0441\u0441\u0442\u0432\u043e \u043e\u0442\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0438 \u043e\u0442 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<p>\u0423\u0445 \u0442\u044b, \u043a\u0430\u043a\u043e\u0439 \u0432\u0441\u043f\u043b\u0435\u0441\u043a \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438! \u041d\u0435 \u0431\u043e\u0439\u0442\u0435\u0441\u044c, \u044f \u043d\u0430\u0443\u0447\u0443 \u0432\u0430\u0441.<\/p>\n<p><strong>\u0411\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0430:<\/strong> \u043b\u043e\u0433\u0438\u043a\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0440\u0435\u0448\u0435\u043d\u0438\u044f \u0438 \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u0435\u0442 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: \u0432\u0441\u0451, \u0447\u0442\u043e \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432 &lt;Browsers \/&gt; \u0432\u044b\u0448\u0435 \u043a\u043b\u044e\u0447\u0435\u0432\u043e\u0433\u043e \u0441\u043b\u043e\u0432\u0430 <strong>return<\/strong>.<\/p>\n<p><strong>\u0418\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441:<\/strong> \u0432\u0441\u0451, \u0447\u0442\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 \u0438 \u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0435\u0442 \u0432\u0432\u043e\u0434 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f: \u0432\u0441\u0451, \u0447\u0442\u043e \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 <strong>return(\u2026)<\/strong><\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0441\u0434\u0435\u043b\u0430\u0435\u043c \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u0448\u0430\u0433 \u0432\u043f\u0435\u0440\u0451\u0434 \u0438 \u0440\u0430\u0437\u0434\u0435\u043b\u0438\u043c \u043d\u0430\u0448 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043d\u0430 2 \u0447\u0430\u0441\u0442\u0438, \u0430 \u0437\u0430\u0442\u0435\u043c \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c, \u043a\u0430\u043a \u044d\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u0435\u0442 \u043d\u0430\u0448 \u043a\u043e\u0434 \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0438\u0433\u043e\u0434\u043d\u044b\u043c \u0434\u043b\u044f \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f.<\/p>\n<p><strong>\u0427\u0442\u043e \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0434\u0435\u043b\u0430\u0442\u044c:<\/strong><\/p>\n<ul>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0439 \u0445\u0443\u043a useBrowsers() \u0434\u043b\u044f \u043d\u0430\u0448\u0435\u0439 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0438.<\/p>\n<\/li>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 &lt;BrowsersList \/&gt; \u0441 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e\u043c \u043f\u0440\u043e\u043f\u0441\u043e\u0432 \u0434\u043b\u044f \u043d\u0430\u0448\u0435\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<\/li>\n<\/ul>\n<p><iframe id=\"604b789a30f707d266c0ec9a\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b789a30f707d266c0ec9a\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u0425\u043e\u0440\u043e\u0448\u043e, \u043d\u0430\u0448 \u043a\u043e\u0434 \u0434\u0430\u043b\u0451\u043a \u043e\u0442 \u0441\u043e\u0432\u0435\u0440\u0448\u0435\u043d\u0441\u0442\u0432\u0430, \u043d\u043e \u0441\u0442\u0430\u043b \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0438\u0433\u043e\u0434\u043d\u044b\u043c \u0434\u043b\u044f \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f:<\/p>\n<ul>\n<li>\n<p>\u041c\u044b \u043c\u043e\u0436\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c &lt;BrowsersList \/&gt; \u0441 \u0434\u0440\u0443\u0433\u0438\u043c \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u043e\u043c \u0434\u0430\u043d\u043d\u044b\u0445. \u0420\u0430\u043d\u044c\u0448\u0435 \u043c\u044b \u0431\u044b\u043b\u0438 \u043e\u0431\u044f\u0437\u0430\u043d\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0441 \u043e\u0434\u043d\u043e\u0433\u043e \u043c\u0435\u0441\u0442\u0430, \u043d\u043e \u0442\u0435\u043f\u0435\u0440\u044c \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0438\u0445 \u0438\u0437 \u043f\u0430\u043c\u044f\u0442\u0438, \u0441 \u0434\u0438\u0441\u043a\u0430 \u0438\u043b\u0438 \u043b\u044e\u0431\u043e\u0433\u043e \u0434\u0440\u0443\u0433\u043e\u0433\u043e \u043c\u0435\u0441\u0442\u0430.<\/p>\n<\/li>\n<li>\n<p>\u041c\u044b \u043c\u043e\u0436\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c useBrowsers() \u0441 \u0434\u0440\u0443\u0433\u0438\u043c \u044d\u043a\u0440\u0430\u043d\u043e\u043c \u0438\u043b\u0438 \u0434\u0430\u0436\u0435 \u0431\u0435\u0437 \u044d\u043a\u0440\u0430\u043d\u0430. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c useBrowsers() \u0432 \u0434\u0440\u0443\u0433\u043e\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0441 \u0434\u0440\u0443\u0433\u0438\u043c \u0434\u0438\u0437\u0430\u0439\u043d\u043e\u043c.<\/p>\n<\/li>\n<\/ul>\n<p>\u041d\u043e \u043d\u0430\u0448 \u0440\u0430\u0437\u0434\u0435\u043b\u0451\u043d\u043d\u044b\u0439 \u043a\u043e\u0434 \u0434\u0430\u043b\u0451\u043a \u043e\u0442 \u0441\u043e\u0432\u0435\u0440\u0448\u0435\u043d\u0441\u0442\u0432\u0430! \u041c\u044b \u0432\u0441\u0451 \u0435\u0449\u0451 \u043c\u043e\u0436\u0435\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u044d\u0442\u043e\u0442 \u043a\u043e\u0434 \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0438\u0433\u043e\u0434\u043d\u044b\u043c \u0434\u043b\u044f \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f.<\/p>\n<p>\u041f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438 = \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430.<\/p>\n<h2>\u0420\u0430\u0437\u0434\u0435\u043b\u0438\u0442\u0435 \u0441\u0432\u043e\u0439 \u043a\u043e\u0434 \u043d\u0430 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u0445 \u0444\u0430\u0439\u043b\u043e\u0432<\/h2>\n<p>\u041f\u0435\u0440\u0432\u043e-\u043d\u0430\u043f\u0435\u0440\u0432\u043e. \u0420\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u043c\u043e\u043d\u043e\u043b\u0438\u0442\u0430 \u043d\u0430 2 \u0447\u0430\u0441\u0442\u0438 \u043e\u0442\u043a\u0440\u044b\u043b\u043e \u043d\u043e\u0432\u044b\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u0434\u043b\u044f \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0430. \u041c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043d\u0430\u0448\u0443 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0443 \u0431\u043e\u043b\u0435\u0435 \u0447\u0438\u0442\u0430\u0435\u043c\u043e\u0439 (\u0430 \u0432\u0430\u0441 \u2013 \u0431\u044b\u0441\u0442\u0440\u0435\u0435), \u0435\u0441\u043b\u0438 \u0440\u0430\u0437\u0434\u0435\u043b\u0438\u043c \u043d\u0430\u0448 \u043a\u043e\u0434 \u043d\u0430 \u0440\u0430\u0437\u043d\u044b\u0435 \u0444\u0430\u0439\u043b\u044b\/\u043c\u043e\u0434\u0443\u043b\u0438. \u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u0438\u0442 \u043d\u0430\u043c \u0434\u0443\u043c\u0430\u0442\u044c \u043e \u043a\u0430\u0436\u0434\u043e\u043c \u043c\u043e\u0434\u0443\u043b\u0435 \u0438\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e,\u0430 \u0442\u0430\u043a\u0436\u0435 \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043a\u0430\u0436\u0434\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c \u0431\u043e\u043b\u0435\u0435 \u0447\u0438\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u044b\u043c \u0438 \u043c\u043d\u043e\u0433\u043e\u0440\u0430\u0437\u043e\u0432\u044b\u043c.<\/p>\n<figure class=\"\"><figcaption>\u0422\u0438\u043f\u0438\u0447\u043d\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u043d\u0430 React<\/figcaption><\/figure>\n<ul>\n<li>\n<p>index.js \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u0442 &lt;Browsers \/&gt; \u0441 Browsers.jsx.<\/p>\n<\/li>\n<li>\n<p>\u0412 \u043f\u0430\u043f\u043a\u0430\u0445 \u00abcomponents\u00bb \u0438 \u00abhooks\u00bb \u0445\u0440\u0430\u043d\u044f\u0442\u0441\u044f \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438, \u043e\u0442\u043d\u043e\u0441\u044f\u0449\u0438\u0435\u0441\u044f \u043a \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0443 &lt;Browsers \/&gt;.<\/p>\n<\/li>\n<li>\n<p>BrowsersList.jsx \u0442\u0430\u043a\u0436\u0435 \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0435\u0432\u0440\u0430\u0442\u0438\u0442\u044c\u0441\u044f \u0432 \u043f\u0430\u043f\u043a\u0443 \u0441\u043e \u0441\u0432\u044f\u0437\u0430\u043d\u043d\u044b\u043c\u0438 \u00ab\u0445\u0443\u043a\u0430\u043c\u0438\u00bb, \u00ab\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u043c\u0438\u00bb \u0438 \u0438\u043d\u0434\u0435\u043a\u0441\u043e\u043c.<\/p>\n<\/li>\n<\/ul>\n<p>\u0424\u0430\u0439\u043b\u043e\u0432\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430 React \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0431\u043e\u0439 \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u043e\u0435 \u0434\u0435\u0440\u0435\u0432\u043e.<\/p>\n<figure class=\"\"><figcaption>\u0412\u043e\u0437\u043c\u043e\u0436\u043d\u0430\u044f \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/figcaption><\/figure>\n<p>\u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043e \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0435 React-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439 \u0447\u0438\u0442\u0430\u0439\u0442\u0435 \u0432 \u0441\u0442\u0430\u0442\u044c\u0435 \u0430\u0432\u0442\u043e\u0440\u0430 <a href=\"https:\/\/medium.com\/u\/f735d3b0f2f3?source=post_page-----ca2e47d1bf97--------------------------------\">David Gilbertson<\/a> <a href=\"https:\/\/medium.com\/hackernoon\/the-100-correct-way-to-structure-a-react-app-or-why-theres-no-such-thing-3ede534ef1ed\">\u041d\u0430 100 % \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0439 \u0441\u043f\u043e\u0441\u043e\u0431 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c React-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 (\u0438\u043b\u0438 \u043f\u043e\u0447\u0435\u043c\u0443 \u0442\u0430\u043a\u043e\u0433\u043e \u0441\u043f\u043e\u0441\u043e\u0431\u0430 \u043d\u0435\u0442).<\/a><\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0430 \u043d\u0430\u0448 BrowsersList.jsx.<\/p>\n<p><iframe id=\"604b787ec373282e340f481f\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b787ec373282e340f481f\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u0421\u0442\u0430\u043b\u043e \u0433\u043e\u0440\u0430\u0437\u0434\u043e \u043c\u0435\u043d\u044c\u0448\u0435 \u043a\u043e\u0434\u0430. \u041e\u043d \u0441\u0442\u0430\u043b \u0433\u043e\u0440\u0430\u0437\u0434\u043e \u043c\u0435\u043d\u0435\u0435 \u0437\u0430\u0433\u0440\u043e\u043c\u043e\u0436\u0434\u0451\u043d\u043d\u044b\u043c. \u0422\u0435\u043f\u0435\u0440\u044c \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u043e\u0441\u0440\u0435\u0434\u043e\u0442\u043e\u0447\u0438\u0442\u044c\u0441\u044f \u043d\u0430 \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0435 \u044d\u0442\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u043a\u043e\u0434\u0430.<\/p>\n<p>\u041c\u0435\u043d\u044c\u0448\u0435 \u0431\u0435\u0441\u043f\u043e\u0440\u044f\u0434\u043a\u0430 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 = \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u043a\u043e\u0434\u0430<\/p>\n<p>\u041d\u043e, \u043f\u0440\u0435\u0436\u0434\u0435 \u0447\u0435\u043c \u043c\u044b \u0441\u0434\u0435\u043b\u0430\u0435\u043c \u044d\u0442\u043e\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0438\u0433\u043e\u0434\u043d\u044b\u043c \u0434\u043b\u044f \u043c\u043d\u043e\u0433\u043e\u0440\u0430\u0437\u043e\u0432\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f, \u043f\u043e\u0437\u0432\u043e\u043b\u044c\u0442\u0435 \u043c\u043d\u0435 \u0437\u0430\u0442\u0440\u043e\u043d\u0443\u0442\u044c \u0431\u043e\u043b\u044c\u0448\u0443\u044e \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0443 \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u0434\u0438\u0437\u0430\u0439\u043d\u0430.<\/p>\n<h2>\u0411\u043e\u043b\u044c\u0448\u0430\u044f \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u0441 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e\u043c \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u0445 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445 \u0444\u0430\u0439\u043b\u043e\u0432&nbsp;<\/h2>\n<p>\u041f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u0442\u0435 \u043d\u0430 \u043d\u0430\u0448 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 &lt;BrowsersList \/&gt;:<\/p>\n<ul>\n<li>\n<p>\u0435\u0441\u043b\u0438 \u043c\u044b \u043f\u0435\u0440\u0435\u0438\u043c\u0435\u043d\u0443\u0435\u043c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u043e\u043f\u0441\u044b, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 changeDescription \u0432 setSelectedBrowser \u0438\u043b\u0438 description \u0432 browser,<\/p>\n<\/li>\n<li>\n<p>\u0438\u043b\u0438 \u043c\u044b \u0443\u0434\u0430\u043b\u0438\u043c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u043e\u043f\u0441\u044b,<\/p>\n<\/li>\n<li>\n<p>\u0438\u043b\u0438 \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u043e\u043f\u0441\u044b,<\/p>\n<\/li>\n<\/ul>\n<p>\u0412 \u043a\u0430\u0436\u0434\u043e\u043c \u043c\u0435\u0441\u0442\u0435, \u0433\u0434\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f &lt;BrowsersList \/&gt;, \u0431\u0443\u0434\u0435\u0442 \u043e\u0448\u0438\u0431\u043a\u0430!<\/p>\n<p>\u041a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437, \u043a\u043e\u0433\u0434\u0430 \u0432\u044b \u043c\u0435\u043d\u044f\u0435\u0442\u0435 \u0432\u0445\u043e\u0434\u044f\u0449\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430, \u0432\u044b \u043b\u043e\u043c\u0430\u0435\u0442\u0435 \u043a\u0430\u0436\u0434\u043e\u0435 \u043c\u0435\u0441\u0442\u043e \u0441\u0432\u043e\u0435\u0433\u043e \u043a\u043e\u0434\u0430, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u044d\u0442\u043e\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442. \u0418 \u0432\u044b \u0431\u0443\u0434\u0435\u0442\u0435 \u0447\u0430\u0441\u0442\u043e \u043c\u0435\u043d\u044f\u0442\u044c \u0432\u0445\u043e\u0434\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435, \u0442\u0430\u043a \u043a\u0430\u043a \u0441\u043b\u043e\u0436\u043d\u043e \u0432\u0441\u0451 \u043f\u0440\u043e\u0434\u0443\u043c\u0430\u0442\u044c \u0432 \u043f\u0435\u0440\u0432\u044b\u0439 \u0436\u0435 \u0434\u0435\u043d\u044c, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: \u0434\u0438\u0437\u0430\u0439\u043d \u0447\u0430\u0441\u0442\u043e \u0432\u043e\u0437\u043d\u0438\u043a\u0430\u0435\u0442 \u0438\u0437 \u0442\u043e\u0433\u043e, \u043a\u0430\u043a \u0432\u044b \u043f\u0438\u0448\u0435\u0442\u0435 \u043a\u043e\u0434. \u0410 \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u043c\u044b \u0441\u043e\u0441\u0440\u0435\u0434\u043e\u0442\u043e\u0447\u0435\u043d\u044b \u043d\u0430 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e, \u0432\u043e \u043c\u043d\u043e\u0433\u0438\u0445 \u043c\u0435\u0441\u0442\u0430\u0445 \u0431\u0443\u0434\u0443\u0442 \u0432\u043e\u0437\u043d\u0438\u043a\u0430\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0438.<\/p>\n<p>\u0412\u0430\u0448\u0430 IDE \u043d\u0435 \u043c\u043e\u0436\u0435\u0442 \u043f\u0435\u0440\u0435\u0438\u043c\u0435\u043d\u043e\u0432\u044b\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u043f\u0441\u044b \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0430. \u0412\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u044d\u0442\u043e \u0432\u0440\u0443\u0447\u043d\u0443\u044e. \u0412\u0440\u0443\u0447\u043d\u0443\u044e \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u043a\u0430\u0436\u0434\u043e\u0435 \u043c\u0435\u0441\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f. \u042d\u0442\u043e \u0437\u0430\u043c\u0435\u0434\u043b\u0438\u0442 \u0432\u0430\u0448\u0443 \u0440\u0430\u0431\u043e\u0442\u0443.<\/p>\n<p>\u0418 \u0445\u0443\u0436\u0435 \u0432\u0441\u0435\u0433\u043e \u0442\u043e, \u0447\u0442\u043e \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u043c \u043e\u0448\u0438\u0431\u043a\u0443 \u0438 \u043d\u0435 \u0443\u0437\u043d\u0430\u0435\u043c \u043e\u0431 \u044d\u0442\u043e\u043c. \u0415\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 \u0441\u043f\u043e\u0441\u043e\u0431 \u043f\u043e\u0439\u043c\u0430\u0442\u044c \u0435\u0451 \u2013 \u044d\u0442\u043e:<\/p>\n<ul>\n<li>\n<p>\u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435;<\/p>\n<\/li>\n<li>\n<p>\u0432\u0440\u0443\u0447\u043d\u0443\u044e \u043f\u0435\u0440\u0435\u0439\u0442\u0438 \u043a \u0441\u043b\u043e\u043c\u0430\u043d\u043d\u043e\u043c\u0443 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0443 \u0438<\/p>\n<\/li>\n<li>\n<p>\u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0443;<\/p>\n<\/li>\n<li>\n<p>\u043f\u0440\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u0442\u0435\u043a\u0441\u0442 \u043e\u0448\u0438\u0431\u043a\u0438;<\/p>\n<\/li>\n<li>\n<p>\u0438\u0441\u043f\u0440\u0430\u0432\u0438\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0443 \u0438 \u043f\u043e\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u0442\u044c \u0435\u0449\u0451 \u0440\u0430\u0437.<\/p>\n<\/li>\n<\/ul>\n<p>\u042d\u0442\u043e \u043c\u0435\u0434\u043b\u0435\u043d\u043d\u0430\u044f \u0438 \u0443\u0442\u043e\u043c\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u0437\u0430\u0434\u0430\u0447\u0430. \u0412\u043e\u0442 \u0442\u0430\u043a \u043d\u0435\u043f\u0440\u0438\u044f\u0442\u043d\u044b\u0435 \u0431\u0430\u0433\u0438 \u043f\u043e\u043f\u0430\u0434\u0430\u044e\u0442 \u0432 \u043f\u0440\u043e\u0434\u0430\u043a\u0448\u043d. \u0410 \u0442\u0430\u043a\u043e\u0435 \u0431\u044b\u0432\u0430\u0435\u0442 \u043e\u0447\u0435\u043d\u044c \u0447\u0430\u0441\u0442\u043e.<\/p>\n<p>\u041f\u0440\u043e\u0432\u0435\u0440\u044c\u0442\u0435, \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043b\u0438 \u043d\u0430\u0448 Browsers.jsx?<\/p>\n<p><iframe id=\"604b786a189a112e083e61ee\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b786a189a112e083e61ee\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u041a\u0442\u043e \u0437\u043d\u0430\u0435\u0442! \u0414\u043b\u044f \u0443\u0432\u0435\u0440\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u043e\u0442\u043a\u0440\u044b\u0442\u044c BrowsersList.jsx \u0438 useBrowsers.js \u0438 \u0432\u0440\u0443\u0447\u043d\u0443\u044e \u0441\u0440\u0430\u0432\u043d\u0438\u0442\u044c \u0432\u0445\u043e\u0434\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435.<\/p>\n<p>\u042d\u0442\u043e\u0442 \u043a\u043e\u0434 \u043d\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442?<\/p>\n<p><iframe id=\"604b785a189a112e083e61ed\" src=\"https:\/\/embedd.srv.habr.com\/iframe\/604b785a189a112e083e61ed\" class=\"embed_video embed__content\" allowfullscreen=\"true\"><\/iframe><\/p>\n<p>\u0414\u0430. \u0423 \u00abdescripton\u00bb \u0432 useBrowsers.js \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u00abi\u00bb, \u044d\u0442\u043e \u043e\u043f\u0435\u0447\u0430\u0442\u043a\u0430.<\/p>\n<p>\u041c\u043d\u043e\u0433\u0438\u0435 \u0434\u0436\u0443\u043d\u0438\u043e\u0440-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u0447\u0430\u0441\u0430\u043c\u0438 \u043e\u0442\u043b\u0430\u0436\u0438\u0432\u0430\u044e\u0442 \u0441\u0432\u043e\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u043f\u044b\u0442\u0430\u044e\u0442\u0441\u044f \u043d\u0430\u0439\u0442\u0438, \u043a\u0430\u043a\u043e\u0439 \u043f\u0440\u043e\u043f\u0441 \u0431\u044b\u043b \u0441\u043b\u043e\u043c\u0430\u043d \u0438\u043b\u0438 \u043a\u0430\u043a\u043e\u0439 \u043f\u0440\u043e\u043f\u0441 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u043d\u0435\u0432\u0435\u0440\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 (\u0441\u0442\u0440\u043e\u043a\u0430 \u0432\u043c\u0435\u0441\u0442\u043e \u0447\u0438\u0441\u043b\u0430). \u0415\u0441\u0442\u044c \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u044d\u0442\u043e\u0439 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b.<\/p>\n<h2>\u041f\u0435\u0440\u0435\u0441\u0442\u0430\u043d\u044c\u0442\u0435 \u043c\u0435\u0434\u043b\u0435\u043d\u043d\u043e \u043f\u0438\u0441\u0430\u0442\u044c \u043a\u043e\u0434 \u043d\u0430 JavaScript, \u0443\u0441\u043a\u043e\u0440\u044c\u0442\u0435 \u0441\u0435\u0431\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e TypeScript!<\/h2>\n<p>\u041d\u0430\u0441\u0442\u0443\u043f\u0438\u043b 2021 \u0433\u043e\u0434, \u0438 \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a React\/React Native \u0434\u043e\u043b\u0436\u0435\u043d \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c TypeScript. \u0424\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043d\u0435\u0442 \u043f\u0440\u0438\u0447\u0438\u043d \u043d\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0435\u0433\u043e.<\/p>\n<p>\u041e\u043d \u043c\u043e\u0436\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0441\u0442\u0440\u0430\u0448\u043d\u043e.<\/p>\n<p>\u041f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430 TypeScript \u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043f\u0435\u0440\u0435\u0432\u0435\u0448\u0438\u0432\u0430\u044e\u0442 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0442 \u0432 JavaScript. \u041d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u0437\u043d\u0430\u0447\u0438\u043c\u044b\u043c\u0438 \u0434\u043b\u044f \u043d\u0430\u0441 \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0440\u0430\u0441\u0445\u043e\u0434\u044b \u043d\u0430 \u043e\u0431\u0443\u0447\u0435\u043d\u0438\u0435.<\/p>\n<p>\u041d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u043e\u0447\u0435\u0432\u0438\u0434\u043d\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u044d\u0442\u043e\u0439 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u2013 \u043f\u0440\u043e\u0441\u0442\u043e<\/p>\n<\/div>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-319487","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/319487","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=319487"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/319487\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=319487"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=319487"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=319487"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}