{"id":11039,"date":"2023-03-09T06:57:52","date_gmt":"2023-03-09T03:27:52","guid":{"rendered":"https:\/\/nabfollower.com\/blog\/how-to-create-an-email-subscription-form-in-nextjs-netlify-and-mailerlite-41mc\/"},"modified":"2023-03-09T06:57:52","modified_gmt":"2023-03-09T03:27:52","slug":"how-to-create-an-email-subscription-form-in-nextjs-netlify-and-mailerlite-41mc","status":"publish","type":"post","link":"https:\/\/nabfollower.com\/blog\/how-to-create-an-email-subscription-form-in-nextjs-netlify-and-mailerlite-41mc\/","title":{"rendered":"\u0646\u062d\u0648\u0647 \u0627\u06cc\u062c\u0627\u062f \u0641\u0631\u0645 \u0627\u0634\u062a\u0631\u0627\u06a9 \u0627\u06cc\u0645\u06cc\u0644 \u0631\u0627\u06cc\u06af\u0627\u0646 \u062f\u0631 NextJS\u060c Netlify \u0648 MailerLite"},"content":{"rendered":"<div data-article-id=\"1393587\" id=\"article-body\">\n<p>\u062f\u0631 \u0645\u0627\u0647\u200c\u0647\u0627\u06cc \u06af\u0630\u0634\u062a\u0647 \u0686\u0646\u062f\u06cc\u0646 \u0628\u0627\u0631 \u062f\u0631 \u0645\u0648\u0631\u062f \u0631\u0627\u0647\u200c\u0627\u0646\u062f\u0627\u0632\u06cc \u0648\u0628\u0644\u0627\u06af \u062e\u0648\u062f \u0648 \u0627\u06cc\u062c\u0627\u062f \u0645\u062d\u062a\u0648\u0627 \u0628\u0631\u0627\u06cc \u0631\u0633\u0627\u0646\u0647\u200c\u0647\u0627\u06cc \u0627\u062c\u062a\u0645\u0627\u0639\u06cc \u0641\u06a9\u0631 \u06a9\u0631\u062f\u0647\u200c\u0627\u0645.  \u0686\u06cc\u0632\u06cc \u06a9\u0647 \u0647\u0645\u06cc\u0634\u0647 \u0645\u0631\u0627 \u0622\u0632\u0627\u0631 \u0645\u06cc\u200c\u062f\u0627\u062f \u0627\u06cc\u0646 \u0628\u0648\u062f \u06a9\u0647 \u0646\u0645\u06cc\u200c\u062f\u0627\u0646\u0633\u062a\u0645 \u0686\u06af\u0648\u0646\u0647 \u06cc\u06a9 \u0644\u06cc\u0633\u062a \u0627\u06cc\u0645\u06cc\u0644 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u0645\u060c \u062d\u062a\u06cc \u0627\u06af\u0631 \u0645\u06cc\u200c\u062f\u0627\u0646\u0633\u062a\u0645 \u062f\u0627\u0634\u062a\u0646 \u0622\u0646 \u0628\u0633\u06cc\u0627\u0631 \u0627\u0631\u0632\u0634\u0645\u0646\u062f \u0627\u0633\u062a!  \u0645\u0646 \u0646\u062a\u06cc\u062c\u0647 \u0646\u0647\u0627\u06cc\u06cc \u0622\u0646\u0686\u0647 \u0631\u0627 \u06a9\u0647 \u062f\u0631 \u062d\u0627\u0644 \u062d\u0627\u0636\u0631 \u062f\u0631 \u0648\u0628\u0644\u0627\u06af\u0645 duncanteege.com \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc \u06a9\u0646\u0645 \u0628\u0627 \u0634\u0645\u0627 \u0628\u0647 \u0627\u0634\u062a\u0631\u0627\u06a9 \u062e\u0648\u0627\u0647\u0645 \u06af\u0630\u0627\u0634\u062a<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_85 counter-hierarchy ez-toc-counter-rtl ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">\u0641\u0647\u0631\u0633\u062a \u0645\u0637\u0627\u0644\u0628<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/nabfollower.com\/blog\/how-to-create-an-email-subscription-form-in-nextjs-netlify-and-mailerlite-41mc\/#%D9%86%DA%A9%D8%AA%D9%87_%D9%85%D9%87%D9%85_%D8%B5%D8%B1%D9%81%D9%87_%D8%AC%D9%88%DB%8C%DB%8C_%D8%AF%D8%B1_%D9%BE%D9%88%D9%84\" >\u0646\u06a9\u062a\u0647 \u0645\u0647\u0645 \u0635\u0631\u0641\u0647 \u062c\u0648\u06cc\u06cc \u062f\u0631 \u067e\u0648\u0644<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/nabfollower.com\/blog\/how-to-create-an-email-subscription-form-in-nextjs-netlify-and-mailerlite-41mc\/#Netlify_Forms\" >Netlify Forms<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/nabfollower.com\/blog\/how-to-create-an-email-subscription-form-in-nextjs-netlify-and-mailerlite-41mc\/#%D9%81%D8%B1%D9%85_%D8%AF%D8%B1_NextJS_%DA%86%DA%AF%D9%88%D9%86%D9%87_%D8%A7%D8%B3%D8%AA\" >\u0641\u0631\u0645 \u062f\u0631 NextJS \u0686\u06af\u0648\u0646\u0647 \u0627\u0633\u062a<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/nabfollower.com\/blog\/how-to-create-an-email-subscription-form-in-nextjs-netlify-and-mailerlite-41mc\/#%D8%A7%D8%B2_%D8%A8%D8%A7%D8%B1%DA%AF%DB%8C%D8%B1%DB%8C_%D9%85%D8%AC%D8%AF%D8%AF_%DB%8C%D8%A7_%D8%B1%D9%81%D8%AA%D9%86_%D8%A8%D9%87_%D8%B5%D9%81%D8%AD%D9%87_%D8%AC%D8%AF%DB%8C%D8%AF_%D8%AE%D9%88%D8%AF%D8%AF%D8%A7%D8%B1%DB%8C_%DA%A9%D9%86%DB%8C%D8%AF\" >\u0627\u0632 \u0628\u0627\u0631\u06af\u06cc\u0631\u06cc \u0645\u062c\u062f\u062f \u06cc\u0627 \u0631\u0641\u062a\u0646 \u0628\u0647 \u0635\u0641\u062d\u0647 \u062c\u062f\u06cc\u062f \u062e\u0648\u062f\u062f\u0627\u0631\u06cc \u06a9\u0646\u06cc\u062f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/nabfollower.com\/blog\/how-to-create-an-email-subscription-form-in-nextjs-netlify-and-mailerlite-41mc\/#%D8%AF%D8%B1_MailerLite_%DA%86%D9%87_%D8%A8%D8%A7%DB%8C%D8%AF_%DA%A9%D8%B1%D8%AF\" >\u062f\u0631 MailerLite \u0686\u0647 \u0628\u0627\u06cc\u062f \u06a9\u0631\u062f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/nabfollower.com\/blog\/how-to-create-an-email-subscription-form-in-nextjs-netlify-and-mailerlite-41mc\/#%D8%A7%D8%B3%D8%AA%D9%81%D8%A7%D8%AF%D9%87_%D8%A7%D8%B2_%D8%AA%D9%88%D8%A7%D8%A8%D8%B9_Netlify\" >\u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u062a\u0648\u0627\u0628\u0639 Netlify<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/nabfollower.com\/blog\/how-to-create-an-email-subscription-form-in-nextjs-netlify-and-mailerlite-41mc\/#%D8%AE%D9%84%D8%A7%D8%B5%D9%87\" >\u062e\u0644\u0627\u0635\u0647<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"%D9%86%DA%A9%D8%AA%D9%87_%D9%85%D9%87%D9%85_%D8%B5%D8%B1%D9%81%D9%87_%D8%AC%D9%88%DB%8C%DB%8C_%D8%AF%D8%B1_%D9%BE%D9%88%D9%84\"><\/span>\n<p>  \u0646\u06a9\u062a\u0647 \u0645\u0647\u0645 \u0635\u0631\u0641\u0647 \u062c\u0648\u06cc\u06cc \u062f\u0631 \u067e\u0648\u0644<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0631\u0627\u0647 \u0647\u0627\u06cc \u0632\u06cc\u0627\u062f\u06cc \u0628\u0631\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u0644\u06cc\u0633\u062a \u0627\u0634\u062a\u0631\u0627\u06a9 \u0627\u06cc\u0645\u06cc\u0644 \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0641\u0631\u0645 \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f.  \u06cc\u06a9\u06cc \u0627\u0632 \u0627\u06cc\u0646 \u0631\u0627\u0647\u200c\u0647\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0642\u0627\u0628\u0644\u06cc\u062a \u0646\u0648\u0634\u062a\u0646 \u0646\u0642\u0627\u0637 \u067e\u0627\u06cc\u0627\u0646\u06cc \u062e\u0648\u062f \u062f\u0631 NextJS \u0648 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0622\u0646 \u0628\u0631\u0627\u06cc \u0628\u0631\u0642\u0631\u0627\u0631\u06cc \u0627\u0631\u062a\u0628\u0627\u0637 \u0628\u0627 \u06cc\u06a9 \u0633\u0631\u0648\u06cc\u0633 \u0627\u06cc\u0645\u06cc\u0644 \u0645\u0627\u0646\u0646\u062f MailerLite \u0627\u0633\u062a.  \u0646\u06a9\u062a\u0647 \u0645\u0646\u0641\u06cc \u0627\u06cc\u0646 \u0627\u0633\u062a \u06a9\u0647 \u0628\u0647 \u062f\u0644\u06cc\u0644 \u062a\u0639\u0631\u06cc\u0641 \u0645\u0633\u06cc\u0631 API \u0627\u0632 Node \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc \u0634\u0648\u062f.  \u0627\u06cc\u0646 \u0628\u0647 \u062e\u0648\u062f\u06cc \u062e\u0648\u062f \u0642\u0637\u0639\u0627\u064b \u06cc\u06a9 \u0646\u0642\u0637\u0647 \u0636\u0639\u0641 \u0646\u06cc\u0633\u062a\u060c \u0627\u0645\u0627 \u062f\u0627\u0634\u062a\u0646 \u0645\u06cc\u0632\u0628\u0627\u0646\u06cc \u0645\u0645\u06a9\u0646 \u0627\u0633\u062a \u06cc\u06a9 \u0646\u0642\u0637\u0647 \u0636\u0639\u0641 \u0628\u0627\u0644\u0642\u0648\u0647 \u0628\u0627\u0634\u062f \u0632\u06cc\u0631\u0627 \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u0647\u0632\u06cc\u0646\u0647 \u0647\u0627\u06cc \u0627\u0636\u0627\u0641\u06cc \u0631\u0627 \u0628\u0647 \u0647\u0645\u0631\u0627\u0647 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u062f.  \u0645\u0646 \u0627\u0628\u062a\u062f\u0627 \u0627\u06cc\u0646 \u0645\u0633\u06cc\u0631 \u0631\u0627 \u0627\u0646\u062a\u062e\u0627\u0628 \u06a9\u0631\u062f\u0645 \u0648 \u0648\u0628 \u0633\u0627\u06cc\u062a \u062e\u0648\u062f \u0631\u0627 \u062f\u0631 DigitalOcean \u0628\u0631 \u0631\u0648\u06cc \u06cc\u06a9 \u067e\u0644\u062a \u0641\u0631\u0645 \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u06cc\u0632\u0628\u0627\u0646\u06cc \u06a9\u0631\u062f\u0645.  \u0622\u0646\u0647\u0627 \u0647\u0632\u06cc\u0646\u0647 \u0647\u0627\u06cc \u062a\u062e\u0645\u06cc\u0646\u06cc 5 \u062f\u0644\u0627\u0631 \u062f\u0631 \u0645\u0627\u0647 \u0631\u0627 \u0641\u0642\u0637 \u0628\u0631\u0627\u06cc \u0645\u06cc\u0632\u0628\u0627\u0646\u06cc \u06cc\u06a9 \u0648\u0628 \u0633\u0627\u06cc\u062a \u062b\u0627\u0628\u062a \u0628\u0627 \u0646\u0642\u0637\u0647 \u067e\u0627\u06cc\u0627\u0646\u06cc \u0628\u0647 \u0645\u0646 \u062f\u0627\u062f\u0646\u062f!  \u0641\u06a9\u0631 \u06a9\u0631\u062f\u0645 &#8220;\u0646\u0647\u060c \u0628\u0627\u06cc\u062f \u062c\u0648\u0631 \u062f\u06cc\u06af\u0631\u06cc \u0628\u0627\u0634\u062f\u060c \u062f\u0631\u0633\u062a \u0627\u0633\u062a\u061f&#8221;&#8230; \u0648 \u0647\u0633\u062a!<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Netlify_Forms\"><\/span>\n<p>  Netlify Forms<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0631\u0627\u06cc\u06af\u0627\u0646 \u0627\u0633\u062a!  Netlify \u0628\u0627 \u0627\u0641\u062a\u062e\u0627\u0631 \u0639\u0645\u0644\u06a9\u0631\u062f Netlify Forms \u0631\u0627 \u0627\u0631\u0627\u0626\u0647 \u0645\u06cc \u06a9\u0646\u062f.  \u0622\u0646\u0647\u0627 \u0628\u0647 \u0634\u0645\u0627 \u0627\u062c\u0627\u0632\u0647 \u0645\u06cc \u062f\u0647\u0646\u062f \u062a\u0627 100 \u0641\u0631\u0645 \u0627\u0631\u0633\u0627\u0644\u06cc \u062f\u0631 \u0647\u0631 \u0633\u0627\u06cc\u062a \u062f\u0631 \u0647\u0631 \u0645\u0627\u0647 \u062f\u0631 \u0631\u062f\u06cc\u0641 &#8220;\u0634\u0631\u0648\u0639&#8221; \u0631\u0627\u06cc\u06af\u0627\u0646 \u0622\u0646\u0647\u0627.  \u0627\u06cc\u0646 \u0628\u0633\u06cc\u0627\u0631 \u0633\u062e\u0627\u0648\u062a\u0645\u0646\u062f\u0627\u0646\u0647 \u0627\u0633\u062a \u0648 \u0627\u06cc\u0646 \u06cc\u06a9\u06cc \u0627\u0632 \u0686\u06cc\u0632\u0647\u0627\u06cc\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0645\u0646 \u0639\u0627\u0634\u0642 Netlify \u0647\u0633\u062a\u0645.  (\u0645\u0646 \u062d\u0645\u0627\u06cc\u062a \u0645\u0627\u0644\u06cc \u0646\u0645\u06cc \u0634\u0648\u0645\u060c \u0641\u0642\u0637 \u0627\u0632 \u0622\u0646\u0686\u0647 \u06a9\u0647 \u0622\u0646\u0647\u0627 \u0627\u0631\u0627\u0626\u0647 \u0645\u06cc \u062f\u0647\u0646\u062f \u0634\u06af\u0641\u062a \u0632\u062f\u0647 \u0634\u062f\u0647 \u0627\u0645 \ud83d\ude42) \u0627\u06af\u0631 \u0641\u0631\u0645 \u0631\u0627\u06cc\u06af\u0627\u0646 \u0628\u0627\u0634\u062f\u060c \u0628\u0627\u06cc\u062f \u0633\u062e\u062a \u0628\u0627\u0634\u062f &#8230; \u062f\u0631\u0633\u062a \u0627\u0633\u062a\u061f<\/p>\n<p>\u062c\u0648\u0627\u0628 \u0645\u0646\u0641\u06cc.  \u0628\u0647 \u0637\u0631\u0632 \u0645\u0633\u062e\u0631\u0647 \u0627\u06cc \u0622\u0633\u0627\u0646 \u0627\u0633\u062a.  \u062a\u0646\u0647\u0627 \u06a9\u0627\u0631\u06cc \u06a9\u0647 \u0628\u0627\u06cc\u062f \u0627\u0646\u062c\u0627\u0645 \u062f\u0647\u06cc\u062f \u0627\u06cc\u0646 \u0627\u0633\u062a \u06a9\u0647 \u06cc\u06a9 \u0648\u06cc\u0698\u06af\u06cc \u0633\u0627\u062f\u0647 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u062f <code>netlify<\/code> \u0628\u0647 \u0641\u0631\u0645 \u0634\u0645\u0627  \u0628\u0644\u0647 \u0622\u0646 \u0628\u0647 \u0622\u0646 \u0633\u0627\u062f\u06af\u06cc \u0627\u0633\u062a!  \u0627\u062a\u0641\u0627\u0642\u06cc \u06a9\u0647 \u0645\u06cc \u0627\u0641\u062a\u062f \u0627\u06cc\u0646 \u0627\u0633\u062a \u06a9\u0647 \u0631\u0628\u0627\u062a \u0647\u0627\u06cc Netlify \u0648\u06cc\u0698\u06af\u06cc \u0631\u0627 \u0628\u0627 \u0628\u0631\u0631\u0633\u06cc HTML \u0633\u0627\u06cc\u062a \u0634\u0645\u0627 \u0642\u0628\u0644 \u0627\u0632 \u0627\u0646\u062a\u0634\u0627\u0631 \u067e\u06cc\u062f\u0627 \u0645\u06cc \u06a9\u0646\u0646\u062f.  \u0627\u06cc\u0646 \u0628\u062f\u0627\u0646 \u0645\u0639\u0646\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0647\u06cc\u0686 \u062a\u0645\u0627\u0633 API \u062f\u06cc\u06af\u0631\u06cc \u0645\u0648\u0631\u062f \u0646\u06cc\u0627\u0632 \u0646\u06cc\u0633\u062a!  \u0646\u06a9\u062a\u0647 \u0642\u0627\u0628\u0644 \u062a\u0648\u062c\u0647 \u0627\u06cc\u0646 \u0627\u0633\u062a \u06a9\u0647 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 Netlify Forms \u0628\u0647 \u0627\u06cc\u0646 \u0645\u0639\u0646\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0628\u0627\u06cc\u062f \u0648\u0628 \u0633\u0627\u06cc\u062a \u062e\u0648\u062f \u0631\u0627 \u062f\u0631 Netlify \u0645\u06cc\u0632\u0628\u0627\u0646\u06cc \u06a9\u0646\u06cc\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D9%81%D8%B1%D9%85_%D8%AF%D8%B1_NextJS_%DA%86%DA%AF%D9%88%D9%86%D9%87_%D8%A7%D8%B3%D8%AA\"><\/span>\n<p>  \u0641\u0631\u0645 \u062f\u0631 NextJS \u0686\u06af\u0648\u0646\u0647 \u0627\u0633\u062a<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0628\u06cc\u0627\u06cc\u06cc\u062f \u0628\u0627 \u06cc\u06a9 \u06a9\u062f \u06a9\u062b\u06cc\u0641 \u0634\u0648\u06cc\u0645.<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight tsx\"><code><span class=\"p\">&lt;<\/span><span class=\"nt\">form<\/span>\n  <span class=\"na\">name<\/span><span class=\"p\">=<\/span><span class=\"s\">\"subscribe\"<\/span>\n  <span class=\"na\">method<\/span><span class=\"p\">=<\/span><span class=\"s\">\"POST\"<\/span>\n  <span class=\"na\">data-netlify<\/span><span class=\"p\">=<\/span><span class=\"s\">\"true\"<\/span>\n  <span class=\"na\">onSubmit<\/span><span class=\"p\">=<\/span><span class=\"si\">{<\/span><span class=\"nx\">handleSubmit<\/span><span class=\"si\">}<\/span>\n<span class=\"p\">&gt;<\/span>\n  <span class=\"p\">&lt;<\/span><span class=\"nt\">div<\/span> <span class=\"na\">className<\/span><span class=\"p\">=<\/span><span class=\"si\">{<\/span><span class=\"s2\">`<\/span><span class=\"p\">${<\/span><span class=\"nx\">styles<\/span><span class=\"p\">.<\/span><span class=\"nx\">formContainer<\/span><span class=\"p\">}<\/span><span class=\"s2\">`<\/span><span class=\"si\">}<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\">div<\/span> <span class=\"na\">className<\/span><span class=\"p\">=<\/span><span class=\"si\">{<\/span><span class=\"s2\">`<\/span><span class=\"p\">${<\/span><span class=\"nx\">styles<\/span><span class=\"p\">.<\/span><span class=\"nx\">inputGroup<\/span><span class=\"p\">}<\/span><span class=\"s2\">`<\/span><span class=\"si\">}<\/span><span class=\"p\">&gt;<\/span>\n      <span class=\"p\">&lt;<\/span><span class=\"nt\">label<\/span> <span class=\"na\">htmlFor<\/span><span class=\"p\">=<\/span><span class=\"s\">\"name\"<\/span><span class=\"p\">&gt;&lt;\/<\/span><span class=\"nt\">label<\/span><span class=\"p\">&gt;<\/span>\n      <span class=\"p\">&lt;<\/span><span class=\"nt\">input<\/span>\n        <span class=\"na\">type<\/span><span class=\"p\">=<\/span><span class=\"s\">\"text\"<\/span>\n        <span class=\"na\">id<\/span><span class=\"p\">=<\/span><span class=\"s\">\"name\"<\/span>\n        <span class=\"na\">name<\/span><span class=\"p\">=<\/span><span class=\"s\">\"name\"<\/span>\n        <span class=\"na\">value<\/span><span class=\"p\">=<\/span><span class=\"si\">{<\/span><span class=\"nx\">subscriberName<\/span><span class=\"si\">}<\/span>\n        <span class=\"na\">required<\/span>\n        <span class=\"na\">placeholder<\/span><span class=\"p\">=<\/span><span class=\"s\">\"What is your first name?\"<\/span>\n        <span class=\"na\">className<\/span><span class=\"p\">=<\/span><span class=\"si\">{<\/span><span class=\"s2\">`<\/span><span class=\"p\">${<\/span><span class=\"nx\">styles<\/span><span class=\"p\">.<\/span><span class=\"nx\">input<\/span><span class=\"p\">}<\/span><span class=\"s2\">`<\/span><span class=\"si\">}<\/span>\n        <span class=\"na\">onChange<\/span><span class=\"p\">=<\/span><span class=\"si\">{<\/span><span class=\"p\">(<\/span><span class=\"nx\">e<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">setSubscriberName<\/span><span class=\"p\">(<\/span><span class=\"nx\">e<\/span><span class=\"p\">.<\/span><span class=\"nx\">target<\/span><span class=\"p\">.<\/span><span class=\"nx\">value<\/span><span class=\"p\">)<\/span><span class=\"si\">}<\/span>\n      <span class=\"p\">\/&gt;<\/span>\n    <span class=\"p\">&lt;\/<\/span><span class=\"nt\">div<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\">div<\/span> <span class=\"na\">className<\/span><span class=\"p\">=<\/span><span class=\"si\">{<\/span><span class=\"s2\">`<\/span><span class=\"p\">${<\/span><span class=\"nx\">styles<\/span><span class=\"p\">.<\/span><span class=\"nx\">inputContainer<\/span><span class=\"p\">}<\/span><span class=\"s2\">`<\/span><span class=\"si\">}<\/span><span class=\"p\">&gt;<\/span>\n      <span class=\"p\">&lt;<\/span><span class=\"nt\">label<\/span> <span class=\"na\">htmlFor<\/span><span class=\"p\">=<\/span><span class=\"s\">\"email\"<\/span><span class=\"p\">&gt;&lt;\/<\/span><span class=\"nt\">label<\/span><span class=\"p\">&gt;<\/span>\n      <span class=\"p\">&lt;<\/span><span class=\"nt\">input<\/span>\n        <span class=\"na\">type<\/span><span class=\"p\">=<\/span><span class=\"s\">\"email\"<\/span>\n        <span class=\"na\">id<\/span><span class=\"p\">=<\/span><span class=\"s\">\"email\"<\/span>\n        <span class=\"na\">name<\/span><span class=\"p\">=<\/span><span class=\"s\">\"email\"<\/span>\n        <span class=\"na\">required<\/span>\n        <span class=\"na\">value<\/span><span class=\"p\">=<\/span><span class=\"si\">{<\/span><span class=\"nx\">subscriberEmail<\/span><span class=\"si\">}<\/span>\n        <span class=\"na\">placeholder<\/span><span class=\"p\">=<\/span><span class=\"s\">\"On what email can I reach you?\"<\/span>\n        <span class=\"na\">className<\/span><span class=\"p\">=<\/span><span class=\"si\">{<\/span><span class=\"s2\">`<\/span><span class=\"p\">${<\/span><span class=\"nx\">styles<\/span><span class=\"p\">.<\/span><span class=\"nx\">input<\/span><span class=\"p\">}<\/span><span class=\"s2\">`<\/span><span class=\"si\">}<\/span>\n        <span class=\"na\">onChange<\/span><span class=\"p\">=<\/span><span class=\"si\">{<\/span><span class=\"p\">(<\/span><span class=\"nx\">e<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">setSubscriberEmail<\/span><span class=\"p\">(<\/span><span class=\"nx\">e<\/span><span class=\"p\">.<\/span><span class=\"nx\">target<\/span><span class=\"p\">.<\/span><span class=\"nx\">value<\/span><span class=\"p\">)<\/span><span class=\"si\">}<\/span>\n      <span class=\"p\">\/&gt;<\/span>\n    <span class=\"p\">&lt;\/<\/span><span class=\"nt\">div<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nc\">SubmitButton<\/span> <span class=\"na\">text<\/span><span class=\"p\">=<\/span><span class=\"s\">\"Subscribe\"<\/span> <span class=\"p\">\/&gt;<\/span>\n  <span class=\"p\">&lt;\/<\/span><span class=\"nt\">div<\/span><span class=\"p\">&gt;<\/span>\n<span class=\"p\">&lt;\/<\/span><span class=\"nt\">form<\/span><span class=\"p\">&gt;<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u0627\u06cc\u0646 \u0641\u0631\u0645\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0645\u0646 \u062f\u0631 \u0648\u0628\u0644\u0627\u06af \u062e\u0648\u062f duncanteege.com \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc \u06a9\u0646\u0645.  \u062a\u0648\u062c\u0647 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u062f \u06a9\u0647 \u0686\u06af\u0648\u0646\u0647 \u0641\u0642\u0637 \u06cc\u06a9 \u0648\u06cc\u0698\u06af\u06cc \u062f\u0627\u062f\u0647 \u0633\u0627\u062f\u0647 \u0628\u0631\u0627\u06cc \u0627\u0637\u0644\u0627\u0639 \u062f\u0627\u062f\u0646 \u0628\u0647 \u0631\u0628\u0627\u062a \u0647\u0627\u06cc Netlify \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f \u06a9\u0647 \u0645\u06cc \u062e\u0648\u0627\u0647\u0645 \u0627\u0632 Netlify Forms \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u0645\u061f  \u0639\u0644\u0627\u0648\u0647 \u0628\u0631 \u0627\u06cc\u0646\u060c \u0641\u0631\u0645 \u0641\u0642\u0637 \u0634\u0628\u06cc\u0647 \u06cc\u06a9 \u0641\u0631\u0645 \u0645\u0639\u0645\u0648\u0644\u06cc HTML \u062f\u0631 React \u0627\u0633\u062a.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D8%A7%D8%B2_%D8%A8%D8%A7%D8%B1%DA%AF%DB%8C%D8%B1%DB%8C_%D9%85%D8%AC%D8%AF%D8%AF_%DB%8C%D8%A7_%D8%B1%D9%81%D8%AA%D9%86_%D8%A8%D9%87_%D8%B5%D9%81%D8%AD%D9%87_%D8%AC%D8%AF%DB%8C%D8%AF_%D8%AE%D9%88%D8%AF%D8%AF%D8%A7%D8%B1%DB%8C_%DA%A9%D9%86%DB%8C%D8%AF\"><\/span>\n<p>  \u0627\u0632 \u0628\u0627\u0631\u06af\u06cc\u0631\u06cc \u0645\u062c\u062f\u062f \u06cc\u0627 \u0631\u0641\u062a\u0646 \u0628\u0647 \u0635\u0641\u062d\u0647 \u062c\u062f\u06cc\u062f \u062e\u0648\u062f\u062f\u0627\u0631\u06cc \u06a9\u0646\u06cc\u062f<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0631\u0641\u062a\u0627\u0631 \u0627\u0633\u062a\u0627\u0646\u062f\u0627\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 Netlify Forms \u0627\u06cc\u0646 \u0627\u0633\u062a \u06a9\u0647 \u0647\u0646\u06af\u0627\u0645 \u0627\u0631\u0633\u0627\u0644\u060c \u0634\u0645\u0627 \u0631\u0627 \u0628\u0647 \u0635\u0641\u062d\u0647 \u062f\u06cc\u06af\u0631\u06cc \u0647\u062f\u0627\u06cc\u062a \u0645\u06cc \u06a9\u0646\u062f.  \u0645\u0646 \u0646\u0645\u06cc \u062e\u0648\u0627\u0633\u062a\u0645 \u0627\u06cc\u0646 \u062f\u0631 \u0648\u0628 \u0633\u0627\u06cc\u062a \u0645\u0646 \u0628\u0627\u0634\u062f.  \u0645\u0646 \u0645\u06cc \u062e\u0648\u0627\u0633\u062a\u0645 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u0627\u0631\u0633\u0627\u0644 \u06a9\u0646\u0646\u062f \u0648 \u0633\u067e\u0633 \u062a\u063a\u06cc\u06cc\u0631 \u0628\u0644\u0648\u06a9 \u0627\u0634\u062a\u0631\u0627\u06a9 \u0631\u0627 \u0628\u0628\u06cc\u0646\u0646\u062f\u060c \u0627\u0645\u0627 \u0646\u0647 \u06cc\u06a9 \u0631\u0641\u0631\u0634 \u06a9\u0627\u0645\u0644 \u0635\u0641\u062d\u0647.  \u062e\u0648\u0634\u0628\u062e\u062a\u0627\u0646\u0647 \u0622\u0646\u0647\u0627 \u06cc\u06a9 \u0645\u062b\u0627\u0644 \u0628\u0633\u06cc\u0627\u0631 \u062e\u0648\u0628 \u062f\u0631 \u0645\u0633\u062a\u0646\u062f\u0627\u062a \u062e\u0648\u062f \u062f\u0627\u0634\u062a\u0646\u062f \u06a9\u0647 \u062f\u0631 \u0622\u0646 \u0646\u062d\u0648\u0647 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0631\u0627 \u062a\u0648\u0636\u06cc\u062d \u0645\u06cc \u062f\u0627\u062f\u0646\u062f <code>fetch<\/code> \u0628\u0631\u0627\u06cc \u0627\u0631\u0633\u0627\u0644 \u0628\u0647 \u0648\u0628 \u0633\u0627\u06cc\u062a \u062a\u0627 \u0628\u062a\u0648\u0627\u0646\u06cc\u062f \u0628\u0631 \u0627\u0633\u0627\u0633 \u067e\u0627\u0633\u062e \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u062a\u063a\u06cc\u06cc\u0631 \u062f\u0647\u06cc\u062f.  \u0627\u06cc\u0646 \u06a9\u062f \u0628\u0647 \u0634\u06a9\u0644 \u0632\u06cc\u0631 \u0627\u0633\u062a:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight tsx\"><code><span class=\"kd\">const<\/span> <span class=\"nx\">handleSubmit<\/span> <span class=\"o\">=<\/span> <span class=\"k\">async<\/span> <span class=\"p\">(<\/span><span class=\"nx\">e<\/span><span class=\"p\">:<\/span> <span class=\"kr\">any<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">e<\/span><span class=\"p\">.<\/span><span class=\"nx\">preventDefault<\/span><span class=\"p\">();<\/span>\n\n    <span class=\"kd\">const<\/span> <span class=\"nx\">form<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">e<\/span><span class=\"p\">.<\/span><span class=\"nx\">target<\/span><span class=\"p\">;<\/span>\n    <span class=\"kd\">const<\/span> <span class=\"nx\">formData<\/span> <span class=\"o\">=<\/span> <span class=\"k\">new<\/span> <span class=\"nx\">FormData<\/span><span class=\"p\">(<\/span><span class=\"nx\">form<\/span><span class=\"p\">);<\/span>\n    <span class=\"k\">try<\/span> <span class=\"p\">{<\/span>\n      <span class=\"k\">await<\/span> <span class=\"nx\">fetch<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">\/<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span> <span class=\"p\">{<\/span>\n        <span class=\"na\">method<\/span><span class=\"p\">:<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">POST<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n        <span class=\"na\">headers<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">Content-Type<\/span><span class=\"dl\">\"<\/span><span class=\"p\">:<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">application\/x-www-form-urlencoded<\/span><span class=\"dl\">\"<\/span> <span class=\"p\">},<\/span>\n        <span class=\"na\">body<\/span><span class=\"p\">:<\/span> <span class=\"k\">new<\/span> <span class=\"nx\">URLSearchParams<\/span><span class=\"p\">(<\/span><span class=\"nx\">formData<\/span> <span class=\"k\">as<\/span> <span class=\"kr\">any<\/span><span class=\"p\">).<\/span><span class=\"nx\">toString<\/span><span class=\"p\">(),<\/span>\n      <span class=\"p\">});<\/span>\n      <span class=\"nx\">setFormState<\/span><span class=\"p\">(<\/span><span class=\"nx\">FormState<\/span><span class=\"p\">.<\/span><span class=\"nx\">SUCCESS<\/span><span class=\"p\">);<\/span>\n    <span class=\"p\">}<\/span> <span class=\"k\">catch<\/span> <span class=\"p\">(<\/span><span class=\"nx\">error<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n      <span class=\"nx\">setFormState<\/span><span class=\"p\">(<\/span><span class=\"nx\">FormState<\/span><span class=\"p\">.<\/span><span class=\"nx\">ERROR<\/span><span class=\"p\">);<\/span>\n      <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nx\">error<\/span><span class=\"p\">(<\/span><span class=\"nx\">error<\/span><span class=\"p\">);<\/span>\n    <span class=\"p\">}<\/span>\n  <span class=\"p\">};<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u0627\u06cc\u0646 \u0641\u0648\u0642 \u0627\u0644\u0639\u0627\u062f\u0647 \u0647\u06cc\u062c\u0627\u0646 \u0627\u0646\u06af\u06cc\u0632 \u0646\u06cc\u0633\u062a\u060c \u0627\u0645\u0627 \u0627\u06cc\u0646 \u0628\u0647 \u0631\u0648\u0632 \u0631\u0633\u0627\u0646\u06cc \u0635\u0641\u062d\u0647 \u0631\u0627 \u0644\u063a\u0648 \u0645\u06cc \u06a9\u0646\u062f \u0648 \u0645\u0646 \u0631\u0627 \u0642\u0627\u062f\u0631 \u0645\u06cc \u0633\u0627\u0632\u062f \u062a\u0627 \u0628\u0631 \u0627\u0633\u0627\u0633 \u067e\u0627\u0633\u062e \u062f\u0631\u062e\u0648\u0627\u0633\u062a\u060c \u062a\u063a\u06cc\u06cc\u0631\u0627\u062a \u062d\u0627\u0644\u062a \u0631\u0627 \u0627\u0646\u062c\u0627\u0645 \u062f\u0647\u0645!  \u0627\u06cc\u0646 \u06a9\u062f \u0628\u0631 \u0631\u0648\u06cc <code>onSubmit<\/code> \u0627\u0632 \u0641\u0631\u0645 \u0645\u0646  \u0645\u0646 \u0648\u0636\u0639\u06cc\u062a \u0641\u0631\u0645 \u0631\u0627 \u062f\u0631 \u062d\u0627\u0644\u062a \u062e\u0648\u062f\u0645 \u0645\u062f\u06cc\u0631\u06cc\u062a \u0645\u06cc \u06a9\u0646\u0645 \u062a\u0627 \u0628\u062a\u0648\u0627\u0646\u0645 \u0628\u0631 \u0627\u0633\u0627\u0633 \u062a\u063a\u06cc\u06cc\u0631\u0627\u062a \u0627\u06cc\u0646 \u062d\u0627\u0644\u062a \u0639\u0645\u0644 \u06a9\u0646\u0645.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D8%AF%D8%B1_MailerLite_%DA%86%D9%87_%D8%A8%D8%A7%DB%8C%D8%AF_%DA%A9%D8%B1%D8%AF\"><\/span>\n<p>  \u062f\u0631 MailerLite \u0686\u0647 \u0628\u0627\u06cc\u062f \u06a9\u0631\u062f<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0628\u0633\u06cc\u0627\u0631\u06cc \u0627\u0632 \u062e\u062f\u0645\u0627\u062a \u0627\u06cc\u0645\u06cc\u0644 \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f.  \u0645\u0646 \u06a9\u0645\u06cc \u062a\u062d\u0642\u06cc\u0642 \u06a9\u0631\u062f\u0645 \u0648 \u0628\u0647 \u0646\u0638\u0631 \u0645\u06cc \u0631\u0633\u062f MailerLite \u0628\u0647\u062a\u0631\u06cc\u0646 \u06af\u0632\u06cc\u0646\u0647 \u0628\u0631\u0627\u06cc \u0645\u0646 \u0627\u0633\u062a.  \u062f\u0631\u0633\u062a \u0645\u0627\u0646\u0646\u062f Netlify\u060c \u06cc\u06a9 \u0633\u0637\u062d \u0631\u0627\u06cc\u06af\u0627\u0646 \u0628\u0633\u06cc\u0627\u0631 \u0633\u062e\u0627\u0648\u062a\u0645\u0646\u062f\u0627\u0646\u0647 \u0631\u0627 \u0627\u0631\u0627\u0626\u0647 \u062f\u0627\u062f.  \u0628\u0631\u0627\u06cc \u062d\u062f\u0627\u06a9\u062b\u0631 1000 \u0645\u0634\u062a\u0631\u06a9 \u0631\u0627\u06cc\u06af\u0627\u0646 \u0627\u0633\u062a.  \u062f\u0631 \u06a9\u0646\u0627\u0631 \u0627\u06cc\u0646\u060c \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u062a\u0627 12000 \u0627\u06cc\u0645\u06cc\u0644 \u062f\u0631 \u0645\u0627\u0647 \u062f\u0631 \u0631\u062f\u06cc\u0641 \u0631\u0627\u06cc\u06af\u0627\u0646 \u0627\u0631\u0633\u0627\u0644 \u06a9\u0646\u06cc\u062f!  \u0627\u06cc\u0646 &#8230; \u0645\u0627\u0646\u0646\u062f 12000 \u0627\u06cc\u0645\u06cc\u0644 \u062f\u0631 \u0645\u0627\u0647!  \u062f\u0648\u062f\u0647\u0627\u06cc \u0645\u0642\u062f\u0633<\/p>\n<p>\u0642\u0628\u0644 \u0627\u0632 \u0627\u06cc\u0646\u06a9\u0647 \u0628\u0647 \u0646\u062d\u0648\u0647 \u0648\u0635\u0644 \u06a9\u0631\u062f\u0646 \u0647\u0645\u0647 \u0627\u06cc\u0646 \u0645\u0648\u0627\u0631\u062f \u0646\u06af\u0627\u0647 \u06a9\u0646\u06cc\u0645\u060c \u0627\u062c\u0627\u0632\u0647 \u062f\u0647\u06cc\u062f \u06a9\u0644\u06cc\u062f\u0647\u0627\u06cc \u0644\u0627\u0632\u0645 \u0631\u0627 \u0628\u0631\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u06cc\u06a9 \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0645\u0648\u0641\u0642 \u0628\u0647 \u0633\u0631\u0648\u06cc\u0633 \u0627\u06cc\u0645\u06cc\u0644 \u062e\u0648\u062f \u0622\u0645\u0627\u062f\u0647 \u06a9\u0646\u06cc\u0645.  \u0645\u0646 \u0628\u0647 \u0634\u0645\u0627 \u0646\u0634\u0627\u0646 \u062e\u0648\u0627\u0647\u0645 \u062f\u0627\u062f \u06a9\u0647 \u0686\u0647 \u06a9\u0627\u0631\u06cc \u0628\u0627\u06cc\u062f \u062f\u0631 MailerLite \u0627\u0646\u062c\u0627\u0645 \u062f\u0647\u06cc\u062f\u060c \u0627\u0645\u0627 \u0627\u06af\u0631 \u0627\u0632 MailerLite \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0646\u0645\u06cc \u06a9\u0646\u06cc\u062f\u060c \u0627\u0632 \u067e\u0627\u0631\u0627\u06af\u0631\u0627\u0641 \u0628\u0639\u062f\u06cc \u0631\u062f \u0634\u0648\u06cc\u062f.<\/p>\n<p>\u062f\u0631 MailerLite \u06cc\u06a9 \u0622\u06cc\u062a\u0645 \u0645\u0646\u0648 \u0628\u0647 \u0646\u0627\u0645 &#8220;Integrations&#8221; \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f.  \u0648\u0642\u062a\u06cc \u0631\u0648\u06cc \u0627\u06cc\u0646 \u0645\u0648\u0631\u062f \u06a9\u0644\u06cc\u06a9 \u0645\u06cc\u200c\u06a9\u0646\u06cc\u062f\u060c \u0635\u0641\u062d\u0647\u200c\u0627\u06cc \u0628\u0627 \u0627\u062f\u063a\u0627\u0645\u200c\u0647\u0627\u06cc \u0627\u062d\u062a\u0645\u0627\u0644\u06cc \u0645\u06cc\u200c\u0628\u06cc\u0646\u06cc\u062f \u06a9\u0647 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u0628\u0627 MailerLite \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u062f.  \u06cc\u06a9 \u0644\u06cc\u0633\u062a \u06a9\u0627\u0645\u0644\u0627\u064b \u0686\u0634\u0645\u06af\u06cc\u0631 \u0627\u0633\u062a\u060c \u0627\u0645\u0627 \u0645\u0627 \u0628\u0647 \u0639\u0645\u0644\u06a9\u0631\u062f &#8220;API&#8221; \u0639\u0644\u0627\u0642\u0647 \u0645\u0646\u062f \u0647\u0633\u062a\u06cc\u0645 \u0632\u06cc\u0631\u0627 \u0645\u06cc \u062e\u0648\u0627\u0647\u06cc\u0645 API \u0631\u0627 \u0627\u0632 \u062a\u0648\u0627\u0628\u0639 Netlify \u062e\u0648\u062f \u0641\u0631\u0627\u062e\u0648\u0627\u0646\u06cc \u06a9\u0646\u06cc\u0645.  \u0627\u0637\u0644\u0627\u0639\u0627\u062a \u0628\u06cc\u0634\u062a\u0631 \u062f\u0631 \u0645\u0648\u0631\u062f \u062a\u0648\u0627\u0628\u0639 Netlify \u0628\u0639\u062f\u0627.  \u0631\u0648\u06cc \u201cuse\u201d \u06a9\u0644\u06cc\u06a9 \u06a9\u0646\u06cc\u062f \u0648 \u06cc\u06a9 \u062a\u0648\u06a9\u0646 API \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f.  \u0645\u0637\u0645\u0626\u0646 \u0634\u0648\u06cc\u062f \u06a9\u0647 \u0627\u06cc\u0646 \u062a\u0648\u06a9\u0646 \u0631\u0627 \u0630\u062e\u06cc\u0631\u0647 \u06a9\u0631\u062f\u0647 \u0627\u06cc\u062f (\u0627\u0645\u0627 \u0622\u0646 \u0631\u0627 \u0628\u0647 \u0645\u062e\u0632\u0646 \u062e\u0648\u062f \u0645\u062a\u0639\u0647\u062f \u0646\u06a9\u0646\u06cc\u062f\u060c \u0622\u0646 \u0631\u0627 \u062f\u0631 \u0641\u0627\u06cc\u0644 env. \u062e\u0648\u062f \u0630\u062e\u06cc\u0631\u0647 \u06a9\u0646\u06cc\u062f).  \u0686\u06cc\u0632\u06cc \u06a9\u0647 \u0628\u0627\u06cc\u062f \u0628\u0647 \u0622\u0646 \u062a\u0648\u062c\u0647 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u062f \u0647\u062f\u0631\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0627\u0632 \u0634\u0645\u0627 \u0645\u06cc \u062e\u0648\u0627\u0647\u0646\u062f \u0627\u0631\u0633\u0627\u0644 \u06a9\u0646\u06cc\u062f:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>Content-Type: application\/json\nAccept: application\/json\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u0648 \u0622\u062f\u0631\u0633 \u067e\u0627\u06cc\u0647 \u0627\u0633\u062a <code>https:\/\/connect.mailerlite.com\/<\/code><\/p>\n<p>\u062c\u0627\u0644\u0628 \u0627\u0633\u062a\u060c \u0627\u0645\u0627 \u0686\u06af\u0648\u0646\u0647 \u0627\u0632 \u0627\u06cc\u0646 api \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u0645\u061f  \u0627\u06cc\u0646\u062c\u0627\u0633\u062a \u06a9\u0647 Netlify Functions \u062f\u0631 \u06a9\u0644\u0627\u0686 \u0642\u0631\u0627\u0631 \u0645\u06cc \u06af\u06cc\u0631\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D8%A7%D8%B3%D8%AA%D9%81%D8%A7%D8%AF%D9%87_%D8%A7%D8%B2_%D8%AA%D9%88%D8%A7%D8%A8%D8%B9_Netlify\"><\/span>\n<p>  \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u062a\u0648\u0627\u0628\u0639 Netlify<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0628\u0646\u0627\u0628\u0631\u0627\u06cc\u0646 \u0645\u0627 \u0627\u0632 Netlify Forms \u0628\u0631\u0627\u06cc \u0627\u0631\u0633\u0627\u0644 \u0641\u0631\u0645 \u0647\u0627\u06cc \u062e\u0648\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc \u06a9\u0646\u06cc\u0645.  \u0627\u0631\u0633\u0627\u0644\u200c\u0647\u0627\u06cc \u0645\u0627 \u0628\u0647 \u0641\u0631\u0645 \u0627\u0631\u0633\u0627\u0644\u06cc Netlify \u062e\u062a\u0645 \u0645\u06cc\u200c\u0634\u0648\u0646\u062f.  \u0645\u0627 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u0627\u06cc\u0646 \u0645\u0648\u0627\u0631\u062f \u0627\u0631\u0633\u0627\u0644\u06cc \u0631\u0627 \u0628\u0647 \u0635\u0648\u0631\u062a \u062f\u0633\u062a\u06cc \u062f\u0631 MailerLite \u062a\u0627\u06cc\u067e \u06a9\u0646\u06cc\u0645\u060c \u0627\u0645\u0627 \u0645\u0627 \u062a\u0648\u0633\u0639\u0647\u200c\u062f\u0647\u0646\u062f\u0647 \u0647\u0633\u062a\u06cc\u0645 \u062f\u0631\u0633\u062a \u0627\u0633\u062a\u061f  \u06a9\u0627\u0631 \u062f\u0633\u062a\u06cc \u0628\u0631\u0627\u06cc \u0645\u0627 \u0646\u06cc\u0633\u062a.  \u062e\u0648\u0634\u0628\u062e\u062a\u0627\u0646\u0647 Netlify \u0647\u0645\u0686\u0646\u06cc\u0646 \u062a\u0648\u0627\u0628\u0639 Netlify \u0631\u0627 \u0627\u0631\u0627\u0626\u0647 \u0645\u06cc \u062f\u0647\u062f!  \u0628\u0627\u0632 \u0647\u0645 Netlify \u0628\u0627 \u0627\u0631\u0627\u0626\u0647 125000 \u0641\u0631\u0627\u062e\u0648\u0627\u0646 \u062f\u0631 \u0645\u0627\u0647 \u062f\u0631 \u0631\u062f\u06cc\u0641 &#8220;\u0634\u0631\u0648\u0639&#8221; \u0633\u062e\u0627\u0648\u062a\u0645\u0646\u062f \u0627\u0633\u062a.  \u06cc\u0639\u0646\u06cc\u2026 \u0686\u06cc\u061f  \u0627\u06cc\u0646 \u06cc\u06a9 \u0645\u0642\u062f\u0627\u0631 \u062f\u06cc\u0648\u0627\u0646\u0647 \u06a9\u0646\u0646\u062f\u0647 \u0627\u0633\u062a.  \u0627\u0645\u0627 \u0686\u06af\u0648\u0646\u0647 \u0627\u0632 \u0622\u0646 \u0628\u0627 \u0641\u0631\u0645 \u0627\u0631\u0633\u0627\u0644\u06cc \u062e\u0648\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u0645\u061f<\/p>\n<p>\u0627\u06cc\u0646 \u0628\u0647 \u0646\u0638\u0631 \u0645\u06cc \u0631\u0633\u062f \u06a9\u0647 \u0645\u0627 \u0628\u0627\u06cc\u062f \u0628\u0647 \u0646\u0648\u0639\u06cc \u0631\u0648\u06cc\u062f\u0627\u062f \u06cc\u0627 \u0645\u062d\u0631\u06a9 \u06af\u0648\u0634 \u062f\u0647\u06cc\u0645.  \u0627\u06af\u0631 \u0628\u0647 \u0645\u0633\u062a\u0646\u062f\u0627\u062a \u0646\u06af\u0627\u0647 \u06a9\u0646\u06cc\u0645\u060c \u0628\u06cc\u0627\u0646 \u0645\u06cc\u200c\u06a9\u0646\u062f \u06a9\u0647 \u0686\u0646\u062f \u0631\u0648\u06cc\u062f\u0627\u062f \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f \u06a9\u0647 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u0628\u0647 \u0622\u0646\u0647\u0627 \u06af\u0648\u0634 \u062f\u0647\u06cc\u0645&#8230; \u0627\u0632 \u062c\u0645\u0644\u0647 <code>submission-created<\/code>.  \u0635\u0628\u0631 \u06a9\u0646  \u0627\u06cc\u0646 \u0686\u06cc\u0632\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0645\u0627 \u0646\u06cc\u0627\u0632 \u062f\u0627\u0631\u06cc\u0645!  \u067e\u0633 \u0686\u06af\u0648\u0646\u0647 \u0627\u0632 \u0627\u06cc\u0646 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u0645\u061f<\/p>\n<p>Netlify \u0627\u0632 \u0634\u0645\u0627 \u0645\u06cc \u062e\u0648\u0627\u0647\u062f \u06a9\u0647 \u06cc\u06a9 \u067e\u0648\u0634\u0647 \u062e\u0627\u0635 \u0628\u0631\u0627\u06cc \u0639\u0645\u0644\u06a9\u0631\u062f\u0647\u0627\u06cc \u0628\u062f\u0648\u0646 \u0633\u0631\u0648\u0631 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f.  \u0627\u06cc\u0646 \u067e\u0648\u0634\u0647 \u062f\u0631 \u0633\u0637\u062d \u0631\u06cc\u0634\u0647 \u067e\u0631\u0648\u0698\u0647 \u0634\u0645\u0627\u060c \u062f\u0631 \u0647\u0645\u0627\u0646 \u0633\u0637\u062d \u0632\u0646\u062f\u06af\u06cc \u0645\u06cc \u06a9\u0646\u062f <code>src<\/code> \u0627\u06af\u0631 \u0634\u0645\u0627 \u0646\u06cc\u0632 \u0627\u06cc\u0646 \u06a9\u0627\u0631 \u0631\u0627 \u062f\u0631 NextJS \u0627\u0646\u062c\u0627\u0645 \u0645\u06cc \u062f\u0647\u06cc\u062f.  \u0627\u06cc\u0646 \u067e\u0648\u0634\u0647 \u0646\u0627\u0645\u06cc\u062f\u0647 \u0645\u06cc \u0634\u0648\u062f <code>netlify<\/code>.  \u062f\u0631 \u0627\u06cc\u0646 \u067e\u0648\u0634\u0647 \u06cc\u06a9 \u067e\u0648\u0634\u0647 \u062f\u06cc\u06af\u0631 \u0628\u0647 \u0646\u0627\u0645 \u0627\u06cc\u062c\u0627\u062f \u0645\u06cc \u06a9\u0646\u06cc\u062f <code>functions<\/code>.  \u0627\u06cc\u0646 \u062c\u0627\u06cc\u06cc \u0627\u0633\u062a \u06a9\u0647 \u062a\u0648\u0627\u0628\u0639 \u0628\u062f\u0648\u0646 \u0633\u0631\u0648\u0631 \u0634\u0645\u0627 \u0632\u0646\u062f\u06af\u06cc \u0645\u06cc \u06a9\u0646\u0646\u062f.  \u0628\u0647 \u0645\u0646\u0638\u0648\u0631 \u06af\u0648\u0634 \u062f\u0627\u062f\u0646 \u0628\u0647 <code>submission-created<\/code> \u0631\u0648\u06cc\u062f\u0627\u062f\u060c \u0645\u0627 \u06cc\u06a9 \u0641\u0627\u06cc\u0644 \u0628\u0647 \u0646\u0627\u0645 \u0627\u06cc\u062c\u0627\u062f \u0645\u06cc \u06a9\u0646\u06cc\u0645 <code>submission-created.ts<\/code> (\u0628\u0631\u0627\u06cc \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 TypeScript) \u062f\u0631 <code>functions<\/code> \u067e\u0648\u0634\u0647  \u062f\u0631 \u0627\u06cc\u0646 \u067e\u0648\u0634\u0647 \u0622\u0646\u0647\u0627 \u0627\u0646\u062a\u0638\u0627\u0631 \u062f\u0627\u0631\u0646\u062f \u06a9\u0647 \u06cc\u06a9 \u062a\u0627\u0628\u0639 async \u0641\u0631\u0627\u062e\u0648\u0627\u0646\u06cc \u0634\u0648\u062f <code>handler<\/code>.  \u062f\u0631 \u0627\u06cc\u0646 \u062a\u0627\u0628\u0639 \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u0628\u062f\u0646\u0647 \u062f\u0631\u062e\u0648\u0627\u0633\u062a POST \u0631\u0627 \u0627\u0632 \u0641\u0631\u0645 \u062f\u0631\u06cc\u0627\u0641\u062a \u06a9\u0646\u06cc\u062f \u0648 \u0622\u0646 \u0631\u0627 \u0647\u0645\u0627\u0646\u0637\u0648\u0631 \u06a9\u0647 \u0646\u06cc\u0627\u0632 \u062f\u0627\u0631\u06cc\u062f \u0645\u062f\u06cc\u0631\u06cc\u062a \u06a9\u0646\u06cc\u062f.  \u0627\u06cc\u0646 \u0647\u0645\u0627\u0646 \u0686\u06cc\u0632\u06cc \u0627\u0633\u062a \u06a9\u0647 \u06a9\u0646\u062a\u0631\u0644 \u06a9\u0646\u0646\u062f\u0647 \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u0634\u0628\u06cc\u0647 \u0628\u0627\u0634\u062f.<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"kd\">const<\/span> <span class=\"nx\">axios<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">require<\/span><span class=\"p\">(<\/span><span class=\"dl\">\"<\/span><span class=\"s2\">axios<\/span><span class=\"dl\">\"<\/span><span class=\"p\">);<\/span>\n\n<span class=\"kd\">const<\/span> <span class=\"nx\">API_KEY<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">process<\/span><span class=\"p\">.<\/span><span class=\"nx\">env<\/span><span class=\"p\">.<\/span><span class=\"nx\">MAILERLITE_PRODUCTION_API_KEY<\/span><span class=\"p\">;<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">BASE_URL<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">process<\/span><span class=\"p\">.<\/span><span class=\"nx\">env<\/span><span class=\"p\">.<\/span><span class=\"nx\">MAILERLITE_PRODUCTION_BASE_API_URL<\/span><span class=\"p\">;<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">GROUP_ID<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">process<\/span><span class=\"p\">.<\/span><span class=\"nx\">env<\/span><span class=\"p\">.<\/span><span class=\"nx\">MAILERLITE_PRODUCTION_NEWSLETTER_GROUP_ID<\/span><span class=\"p\">;<\/span>\n\n\n<span class=\"k\">async<\/span> <span class=\"kd\">function<\/span> <span class=\"nx\">handler<\/span><span class=\"p\">(<\/span><span class=\"nx\">event<\/span><span class=\"p\">:<\/span> <span class=\"nx\">any<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n  <span class=\"k\">if<\/span> <span class=\"p\">(<\/span><span class=\"o\">!<\/span><span class=\"nx\">event<\/span><span class=\"p\">.<\/span><span class=\"nx\">body<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n    <span class=\"k\">return<\/span><span class=\"p\">;<\/span>\n  <span class=\"p\">}<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">email<\/span><span class=\"p\">,<\/span> <span class=\"nx\">name<\/span> <span class=\"p\">}<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">JSON<\/span><span class=\"p\">.<\/span><span class=\"nx\">parse<\/span><span class=\"p\">(<\/span><span class=\"nx\">event<\/span><span class=\"p\">.<\/span><span class=\"nx\">body<\/span><span class=\"p\">).<\/span><span class=\"nx\">payload<\/span><span class=\"p\">;<\/span>\n  <span class=\"kd\">const<\/span> <span class=\"nx\">url<\/span> <span class=\"o\">=<\/span> <span class=\"s2\">`<\/span><span class=\"p\">${<\/span><span class=\"nx\">BASE_URL<\/span><span class=\"p\">}<\/span><span class=\"s2\">\/subscribers`<\/span><span class=\"p\">;<\/span>\n\n\n  <span class=\"kd\">const<\/span> <span class=\"nx\">data<\/span> <span class=\"o\">=<\/span> <span class=\"p\">{<\/span>\n    <span class=\"na\">email<\/span><span class=\"p\">:<\/span> <span class=\"nx\">email<\/span><span class=\"p\">,<\/span>\n    <span class=\"na\">fields<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span>\n      <span class=\"na\">name<\/span><span class=\"p\">:<\/span> <span class=\"nx\">name<\/span><span class=\"p\">,<\/span>\n    <span class=\"p\">},<\/span>\n    <span class=\"na\">groups<\/span><span class=\"p\">:<\/span> <span class=\"p\">[<\/span><span class=\"s2\">`<\/span><span class=\"p\">${<\/span><span class=\"nx\">GROUP_ID<\/span><span class=\"p\">}<\/span><span class=\"s2\">`<\/span><span class=\"p\">],<\/span>\n  <span class=\"p\">};<\/span>\n\n\n  <span class=\"kd\">const<\/span> <span class=\"nx\">options<\/span> <span class=\"o\">=<\/span> <span class=\"p\">{<\/span>\n    <span class=\"na\">headers<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span>\n      <span class=\"dl\">\"<\/span><span class=\"s2\">Content-Type<\/span><span class=\"dl\">\"<\/span><span class=\"p\">:<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">application\/json<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n      <span class=\"na\">Authorization<\/span><span class=\"p\">:<\/span> <span class=\"s2\">`Bearer <\/span><span class=\"p\">${<\/span><span class=\"nx\">API_KEY<\/span><span class=\"p\">}<\/span><span class=\"s2\">`<\/span><span class=\"p\">,<\/span>\n    <span class=\"p\">},<\/span>\n  <span class=\"p\">};<\/span>\n\n\n  <span class=\"k\">try<\/span> <span class=\"p\">{<\/span>\n    <span class=\"k\">await<\/span> <span class=\"nx\">axios<\/span><span class=\"p\">.<\/span><span class=\"nx\">post<\/span><span class=\"p\">(<\/span><span class=\"nx\">url<\/span><span class=\"p\">,<\/span> <span class=\"nx\">data<\/span><span class=\"p\">,<\/span> <span class=\"nx\">options<\/span><span class=\"p\">);<\/span>\n    <span class=\"k\">return<\/span> <span class=\"p\">{<\/span>\n      <span class=\"na\">statusCode<\/span><span class=\"p\">:<\/span> <span class=\"mi\">201<\/span><span class=\"p\">,<\/span>\n      <span class=\"na\">body<\/span><span class=\"p\">:<\/span> <span class=\"nx\">JSON<\/span><span class=\"p\">.<\/span><span class=\"nx\">stringify<\/span><span class=\"p\">({<\/span>\n        <span class=\"na\">message<\/span><span class=\"p\">:<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">Subscriber successfully created and added to group<\/span><span class=\"dl\">\"<\/span><span class=\"p\">,<\/span>\n      <span class=\"p\">}),<\/span>\n    <span class=\"p\">};<\/span>\n  <span class=\"p\">}<\/span> <span class=\"k\">catch<\/span> <span class=\"p\">(<\/span><span class=\"nx\">error<\/span><span class=\"p\">:<\/span> <span class=\"nx\">any<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nx\">log<\/span><span class=\"p\">(<\/span><span class=\"nx\">error<\/span><span class=\"p\">);<\/span>\n    <span class=\"k\">return<\/span> <span class=\"p\">{<\/span>\n      <span class=\"na\">statusCode<\/span><span class=\"p\">:<\/span> <span class=\"mi\">500<\/span><span class=\"p\">,<\/span>\n      <span class=\"na\">body<\/span><span class=\"p\">:<\/span> <span class=\"nx\">JSON<\/span><span class=\"p\">.<\/span><span class=\"nx\">stringify<\/span><span class=\"p\">(<\/span><span class=\"nx\">error<\/span><span class=\"p\">),<\/span>\n    <span class=\"p\">};<\/span>\n  <span class=\"p\">}<\/span>\n<span class=\"p\">}<\/span>\n\n<span class=\"k\">export<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">handler<\/span> <span class=\"p\">};<\/span>\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062a\u0648\u062c\u0647: \u0647\u0645\u0627\u0646\u0637\u0648\u0631 \u06a9\u0647 \u0645\u06cc \u0628\u06cc\u0646\u06cc\u062f \u0645\u0646 \u0627\u0632 \u0645\u062a\u063a\u06cc\u0631\u0647\u0627\u06cc \u0645\u062d\u06cc\u0637\u06cc \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc \u06a9\u0646\u0645.  \u0627\u06cc\u0646 \u0645\u062a\u063a\u06cc\u0631\u0647\u0627\u06cc \u0645\u062d\u06cc\u0637\u06cc \u0628\u0627\u06cc\u062f \u0628\u0647 \u0648\u0628 \u0633\u0627\u06cc\u062a \u0634\u0645\u0627 \u062f\u0631 Netlify \u0627\u0636\u0627\u0641\u0647 \u0634\u0648\u0646\u062f \u062a\u0627 \u0645\u0637\u0645\u0626\u0646 \u0634\u0648\u06cc\u062f \u06a9\u0647 \u0647\u0646\u062f\u0644\u0631 \u06a9\u0627\u0631 \u0645\u06cc \u06a9\u0646\u062f.  \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u0627\u0632 \u0645\u062a\u063a\u06cc\u0631\u0647\u0627\u06cc \u0645\u062d\u06cc\u0637\u06cc \u062f\u0631 \u06cc\u06a9 \u0641\u0627\u06cc\u0644 .env \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u062f.  \u0622\u0646\u0647\u0627 \u0628\u0647 \u0627\u06cc\u0646 \u0635\u0648\u0631\u062a \u062a\u0639\u0631\u06cc\u0641 \u0645\u06cc \u0634\u0648\u0646\u062f:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>MAILERLITE_PRODUCTION_API_KEY = \u201cyour-api-key-here\u201d\nMAILERLITE_PRODUCTION_BASE_API_URL = https:\/\/connect.mailerlite.com\/api\nMAILERLITE_PRODUCTION_NEWSLETTER_GROUP_ID = \u201cyour-group-id-here\u201d\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062f\u0631 \u0642\u0637\u0639\u0647 \u06a9\u062f \u0628\u0627\u0644\u0627\u06cc \u06a9\u0646\u062a\u0631\u0644 \u06a9\u0646\u0646\u062f\u0647\u060c \u0647\u0645\u0686\u0646\u06cc\u0646 \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u0628\u0628\u06cc\u0646\u06cc\u062f \u06a9\u0647 \u0645\u0646 \u06cc\u06a9 \u0634\u06cc \u062f\u0627\u062f\u0647 \u0628\u0627 \u062a\u0645\u0627\u0645 \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc\u06cc \u06a9\u0647 \u0645\u06cc \u062e\u0648\u0627\u0647\u0645 \u0628\u0647 MailerLite \u0627\u0631\u0633\u0627\u0644 \u06a9\u0646\u0645 \u0627\u06cc\u062c\u0627\u062f \u0645\u06cc \u06a9\u0646\u0645.  \u0627\u0632 \u0622\u0646\u062c\u0627\u06cc\u06cc \u06a9\u0647 \u0645\u0646 \u0646\u06cc\u0632 \u0645\u0633\u062a\u0642\u06cc\u0645\u0627\u064b \u0645\u06cc \u062e\u0648\u0627\u0647\u0645 \u0645\u0634\u062a\u0631\u06a9\u06cc\u0646 \u062c\u062f\u06cc\u062f \u0631\u0627 \u0628\u0647 \u06cc\u06a9 \u06af\u0631\u0648\u0647 \u062e\u0628\u0631\u0646\u0627\u0645\u0647 \u062e\u0627\u0635 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u0645\u060c \u0622\u0646 \u0631\u0627 \u0628\u0647 \u0634\u06cc \u062f\u0627\u062f\u0647 \u062e\u0648\u062f \u0646\u06cc\u0632 \u0627\u0636\u0627\u0641\u0647 \u0645\u06cc \u06a9\u0646\u0645.  \u06cc\u0627\u062f\u0622\u0648\u0631\u06cc \u0627\u06cc\u0646 \u0646\u06a9\u062a\u0647 \u0645\u0647\u0645 \u0627\u0633\u062a \u06a9\u0647 \u0628\u0631\u0627\u06cc \u0627\u06cc\u0646\u06a9\u0647 \u0639\u0645\u0644\u06a9\u0631\u062f \u0628\u062f\u0648\u0646 \u0633\u0631\u0648\u0631 \u06a9\u0627\u0631 \u06a9\u0646\u062f\u060c \u067e\u0631\u0648\u0698\u0647 \u062f\u0631 \u0648\u0627\u0642\u0639 \u0628\u0627\u06cc\u062f \u0645\u0633\u062a\u0642\u0631 \u0634\u0648\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D8%AE%D9%84%D8%A7%D8%B5%D9%87\"><\/span>\n<p>  \u062e\u0644\u0627\u0635\u0647<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0645\u0639\u0644\u0648\u0645 \u0634\u062f \u06a9\u0647 \u0627\u06cc\u0646 \u06cc\u06a9 \u067e\u0633\u062a \u0648\u0628\u0644\u0627\u06af \u0628\u0633\u06cc\u0627\u0631 \u0637\u0648\u0644\u0627\u0646\u06cc \u0627\u0633\u062a\u060c \u0627\u0645\u0627 \u062f\u0631 \u0645\u062c\u0645\u0648\u0639 \u062a\u0646\u0638\u06cc\u0645 \u0622\u0646 \u0646\u0633\u0628\u062a\u0627\u064b \u0622\u0633\u0627\u0646 \u0627\u0633\u062a.  \u0627\u06af\u0631 \u062a\u0627\u0632\u0647 \u0634\u0631\u0648\u0639 \u0628\u0647 \u06a9\u0627\u0631 \u06a9\u0631\u062f\u0647 \u0627\u06cc\u062f\u060c \u0628\u0631\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u0645\u0648\u0641\u0642\u06cc\u062a \u0622\u0645\u06cc\u0632 \u0641\u0631\u0645 \u062e\u0648\u062f \u0628\u062f\u0648\u0646 \u067e\u0631\u062f\u0627\u062e\u062a \u0647\u0632\u06cc\u0646\u0647 \u0628\u0631\u0627\u06cc \u0633\u0631\u0648\u0631 Node \u0628\u0627 \u0645\u0633\u06cc\u0631 API\u060c \u0628\u0627\u06cc\u062f \u0686\u0646\u062f \u0645\u0631\u062d\u0644\u0647 \u0631\u0627 \u0627\u0646\u062c\u0627\u0645 \u062f\u0647\u06cc\u062f.  Netlify \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627\u06cc \u0632\u06cc\u0627\u062f\u06cc \u0631\u0627 \u0627\u0631\u0627\u0626\u0647 \u0645\u06cc\u200c\u062f\u0647\u062f \u0648 \u0645\u0627 \u0627\u0632 \u0644\u0627\u06cc\u0647 \u0627\u0648\u0644\u06cc\u0647 \u0628\u0633\u06cc\u0627\u0631 \u0633\u062e\u0627\u0648\u062a\u0645\u0646\u062f\u0627\u0646\u0647 \u0628\u0631\u0646\u0627\u0645\u0647\u200c\u0647\u0627\u06cc \u0622\u0646\u0647\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0631\u062f\u06cc\u0645!  \u0627\u0648\u0647 \u0648&#8230; \u0645\u0646 \u062a\u0648\u0633\u0637 Netlify \u06cc\u0627 MailerLite \u062d\u0645\u0627\u06cc\u062a \u0646\u0645\u06cc\u200c\u0634\u0648\u0645.  \u0641\u0642\u0637 \u06cc\u06a9 \u0637\u0631\u0641\u062f\u0627\u0631 \u0628\u0632\u0631\u06af \u062e\u062f\u0645\u0627\u062a \u0622\u0646\u0647\u0627.<\/p>\n<p>\u0627\u06af\u0631 \u0627\u06cc\u0646 \u067e\u0633\u062a \u0628\u0647 \u0634\u0645\u0627 \u06a9\u0645\u06a9 \u06a9\u0631\u062f \u0648 \u0645\u06cc \u062e\u0648\u0627\u0647\u06cc\u062f \u062a\u0639\u062f\u0627\u062f \u0628\u06cc\u0634\u062a\u0631\u06cc \u0627\u0632 \u0627\u06cc\u0646 \u067e\u0633\u062a \u0647\u0627 \u0631\u0627 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u062f\u060c \u062f\u0631 \u062e\u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u0646 \u0645\u0634\u062a\u0631\u06a9 \u0634\u0648\u06cc\u062f!  \u0645\u0646 \u0645\u0627\u0647\u0627\u0646\u0647 \u06cc\u06a9 \u0628\u0627\u0631 \u0645\u062d\u062a\u0648\u0627\u06cc \u0628\u0627 \u06a9\u06cc\u0641\u06cc\u062a \u0631\u0627 \u0628\u0647 \u0627\u0634\u062a\u0631\u0627\u06a9 \u0645\u06cc \u06af\u0630\u0627\u0631\u0645\u060c \u0628\u062f\u0648\u0646 \u0647\u0631\u0632\u0646\u0627\u0645\u0647.<\/p>\n<\/p><\/div>\n","protected":false},"excerpt":{"rendered":"<p>\u062f\u0631 \u0645\u0627\u0647\u200c\u0647\u0627\u06cc \u06af\u0630\u0634\u062a\u0647 \u0686\u0646\u062f\u06cc\u0646 \u0628\u0627\u0631 \u062f\u0631 \u0645\u0648\u0631\u062f \u0631\u0627\u0647\u200c\u0627\u0646\u062f\u0627\u0632\u06cc \u0648\u0628\u0644\u0627\u06af \u062e\u0648\u062f \u0648 \u0627\u06cc\u062c\u0627\u062f \u0645\u062d\u062a\u0648\u0627 \u0628\u0631\u0627\u06cc \u0631\u0633\u0627\u0646\u0647\u200c\u0647\u0627\u06cc \u0627\u062c\u062a\u0645\u0627\u0639\u06cc \u0641\u06a9\u0631 \u06a9\u0631\u062f\u0647\u200c\u0627\u0645. \u0686\u06cc\u0632\u06cc \u06a9\u0647 \u0647\u0645\u06cc\u0634\u0647 \u0645\u0631\u0627 \u0622\u0632\u0627\u0631 \u0645\u06cc\u200c\u062f\u0627\u062f \u0627\u06cc\u0646 \u0628\u0648\u062f \u06a9\u0647 \u0646\u0645\u06cc\u200c\u062f\u0627\u0646\u0633\u062a\u0645 \u0686\u06af\u0648\u0646\u0647 \u06cc\u06a9 \u0644\u06cc\u0633\u062a \u0627\u06cc\u0645\u06cc\u0644 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u0645\u060c \u062d\u062a\u06cc \u0627\u06af\u0631 \u0645\u06cc\u200c\u062f\u0627\u0646\u0633\u062a\u0645 \u062f\u0627\u0634\u062a\u0646 \u0622\u0646 \u0628\u0633\u06cc\u0627\u0631 \u0627\u0631\u0632\u0634\u0645\u0646\u062f \u0627\u0633\u062a! \u0645\u0646 \u0646\u062a\u06cc\u062c\u0647 \u0646\u0647\u0627\u06cc\u06cc \u0622\u0646\u0686\u0647 \u0631\u0627 \u06a9\u0647 \u062f\u0631 \u062d\u0627\u0644 \u062d\u0627\u0636\u0631 \u062f\u0631 \u0648\u0628\u0644\u0627\u06af\u0645 duncanteege.com \u0627\u0633\u062a\u0641\u0627\u062f\u0647 &hellip;<\/p>\n","protected":false},"author":2,"featured_media":11040,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"fifu_image_url":"","fifu_image_alt":"","footnotes":""},"categories":[339],"tags":[],"class_list":["post-11039","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-dev"],"_links":{"self":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/11039","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/comments?post=11039"}],"version-history":[{"count":0,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/11039\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media\/11040"}],"wp:attachment":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media?parent=11039"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/categories?post=11039"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/tags?post=11039"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}