{"id":22798,"date":"2026-04-21T03:51:45","date_gmt":"2026-04-21T03:51:45","guid":{"rendered":"https:\/\/umang.pk\/2026\/04\/21\/react-%d8%a7%db%8c-%d9%85%db%8c%d9%84-%da%a9%d8%a7-%d8%a7%d8%b3%d8%aa%d8%b9%d9%85%d8%a7%d9%84-%da%a9%d8%b1%d8%aa%db%92-%db%81%d9%88%d8%a6%db%92-go-%d9%85%db%8c%da%ba-%d9%85%d8%aa%d8%ad%d8%b1%da%a9\/"},"modified":"2026-04-21T03:51:46","modified_gmt":"2026-04-21T03:51:46","slug":"react-%d8%a7%db%8c-%d9%85%db%8c%d9%84-%da%a9%d8%a7-%d8%a7%d8%b3%d8%aa%d8%b9%d9%85%d8%a7%d9%84-%da%a9%d8%b1%d8%aa%db%92-%db%81%d9%88%d8%a6%db%92-go-%d9%85%db%8c%da%ba-%d9%85%d8%aa%d8%ad%d8%b1%da%a9","status":"publish","type":"post","link":"https:\/\/umang.pk\/en_us\/2026\/04\/21\/react-%d8%a7%db%8c-%d9%85%db%8c%d9%84-%da%a9%d8%a7-%d8%a7%d8%b3%d8%aa%d8%b9%d9%85%d8%a7%d9%84-%da%a9%d8%b1%d8%aa%db%92-%db%81%d9%88%d8%a6%db%92-go-%d9%85%db%8c%da%ba-%d9%85%d8%aa%d8%ad%d8%b1%da%a9\/","title":{"rendered":"React \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 Go \u0645\u06cc\u06ba \u0645\u062a\u062d\u0631\u06a9 \u0627\u06cc \u0645\u06cc\u0644\u0632 \u06a9\u06cc\u0633\u06d2 \u0628\u0646\u0627\u0626\u06cc\u06ba"},"content":{"rendered":"\n<div id=\"\">\n<p>\u0627\u06cc\u067e\u0644\u06cc\u06a9\u06cc\u0634\u0646 \u0627\u0646\u0679\u0631\u0641\u06cc\u0633 \u0633\u06d2 \u0628\u0627\u06c1\u0631 \u0627\u0637\u0644\u0627\u0639\u0627\u062a \u06a9\u06cc \u0641\u0631\u0627\u06c1\u0645\u06cc \u0627\u0648\u0631 \u0645\u0648\u0627\u0635\u0644\u0627\u062a \u06a9\u0648 \u0628\u0631\u0642\u0631\u0627\u0631 \u0631\u06a9\u06be\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0635\u0627\u0631\u0641\u06cc\u0646 \u06a9\u0648 \u0627\u06cc \u0645\u06cc\u0644\u0632 \u0628\u06be\u06cc\u062c\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0628\u06cc\u06a9 \u0627\u06cc\u0646\u0688 \u0627\u06cc\u067e\u0644\u06cc \u06a9\u06cc\u0634\u0646 \u06a9\u06cc \u0636\u0631\u0648\u0631\u062a \u06c1\u06d2\u06d4 \u06cc\u06c1 \u0627\u06cc \u0645\u06cc\u0644\u0632 \u0645\u062a\u062d\u0631\u06a9 \u06c1\u06cc\u06ba\u060c \u0639\u0627\u0645 \u0637\u0648\u0631 \u067e\u0631 \u06c1\u0631 \u0635\u0627\u0631\u0641 \u06a9\u06d2 \u0628\u0627\u0631\u06d2 \u0645\u06cc\u06ba \u0645\u062e\u0635\u0648\u0635 \u0645\u0639\u0644\u0648\u0645\u0627\u062a \u067e\u0631 \u0645\u0634\u062a\u0645\u0644 \u06c1\u0648\u062a\u06cc \u06c1\u06cc\u06ba\u060c \u062c\u06cc\u0633\u06d2 \u0635\u0627\u0631\u0641 \u06a9\u0627 \u0646\u0627\u0645 \u06cc\u0627 \u067e\u062a\u06c1\u06d4<\/p>\n<p>\u06cc\u06c1 \u0645\u0636\u0645\u0648\u0646 \u0622\u067e \u06a9\u0648 React \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u0627\u06cc\u06a9 \u0645\u062a\u062d\u0631\u06a9 \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0628\u0646\u0627\u0646\u06d2\u060c \u0627\u0633\u06d2 HTML \u0645\u06cc\u06ba \u062a\u0628\u062f\u06cc\u0644 \u06a9\u0631\u0646\u06d2\u060c \u0627\u0648\u0631 \u06af\u0648 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u0688\u06cc\u0679\u0627 \u06a9\u0648 \u0627\u0646\u062c\u06cc\u06a9\u0634\u0646 \u06a9\u0631\u0646\u06d2 \u06a9\u06d2 \u0628\u0627\u0631\u06d2 \u0645\u06cc\u06ba \u0628\u062a\u0627\u062a\u0627 \u06c1\u06d2\u06d4 \u0627\u0633 \u0645\u06cc\u06ba \u0627\u06cc\u06a9 \u0627\u062e\u062a\u06cc\u0627\u0631\u06cc \u0633\u06cc\u06a9\u0634\u0646 \u0628\u06be\u06cc \u0634\u0627\u0645\u0644 \u06c1\u06d2 \u062c\u0648 \u0622\u067e \u06a9\u0648 \u062f\u06a9\u06be\u0627\u062a\u0627 \u06c1\u06d2 \u06a9\u06c1 \u0645\u06cc\u0644 \u06c1\u0627\u06af \u06a9\u06d2 \u0633\u0627\u062a\u06be \u0627\u06cc \u0645\u06cc\u0644 \u0641\u0627\u0631\u0648\u0631\u0688\u0646\u06af \u06a9\u0648 \u06a9\u06cc\u0633\u06d2 \u0628\u06be\u06cc\u062c\u0646\u0627 \u0627\u0648\u0631 \u062c\u0627\u0646\u0686\u0646\u0627 \u06c1\u06d2\u06d4<\/p>\n<p>\u0627\u0633 \u0645\u0636\u0645\u0648\u0646 \u06a9\u06cc \u067e\u06cc\u0631\u0648\u06cc \u06a9\u0631\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2\u060c \u0622\u067e \u06a9\u0648 \u0627\u067e\u0646\u06d2 \u06a9\u0645\u067e\u06cc\u0648\u0679\u0631 \u067e\u0631 Go \u0627\u0648\u0631 Node.js \u0627\u0646\u0633\u0679\u0627\u0644 \u06a9\u0631\u0646\u06d2 \u06a9\u06cc \u0636\u0631\u0648\u0631\u062a \u06c1\u0648\u06af\u06cc\u06d4 \u0622\u067e \u06a9\u0648 React \u06a9\u06cc \u0628\u0646\u06cc\u0627\u062f\u06cc \u0633\u0645\u062c\u06be \u0627\u0648\u0631 Go \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0633\u06d2 \u06a9\u0686\u06be \u0648\u0627\u0642\u0641\u06cc\u062a \u0628\u06be\u06cc \u06c1\u0648\u0646\u06cc \u0686\u0627\u06c1\u06cc\u06d2\u06d4 \u062a\u0627\u06c1\u0645\u060c \u06cc\u06c1 \u0627\u06cc\u06a9 \u0633\u062e\u062a \u0636\u0631\u0648\u0631\u062a \u0646\u06c1\u06cc\u06ba \u06c1\u06d2 \u06a9\u06cc\u0648\u0646\u06a9\u06c1 \u0622\u067e \u0645\u0634\u0642 \u06a9\u06d2 \u0633\u0627\u062a\u06be \u06c1\u06cc\u0646\u06af \u062d\u0627\u0635\u0644 \u06a9\u0631\u0633\u06a9\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4<\/p>\n<h2 id=\"heading-table-of-contents\">\u0627\u0646\u0688\u06cc\u06a9\u0633<\/h2>\n<h2 id=\"heading-what-is-react-email\">React \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u06cc\u0627 \u06c1\u06d2\u061f<\/h2>\n<p>React \u0627\u06cc \u0645\u06cc\u0644 \u0627\u06cc\u06a9 JavaScript \u0644\u0627\u0626\u0628\u0631\u06cc\u0631\u06cc \u06c1\u06d2 \u062c\u0648 \u0622\u067e \u06a9\u0648 React \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u0645\u062a\u062d\u0631\u06a9 \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0628\u0646\u0627\u0646\u06d2 \u0645\u06cc\u06ba \u0645\u062f\u062f \u06a9\u0631\u062a\u06cc \u06c1\u06d2\u06d4 \u0627\u06af\u0631 \u0622\u067e \u067e\u06c1\u0644\u06d2 \u0633\u06d2 \u06c1\u06cc \u0628\u0646\u06cc\u0627\u062f\u06cc React \u06a9\u0648 \u062c\u0627\u0646\u062a\u06d2 \u06c1\u06cc\u06ba \u062a\u0648 React \u0627\u06cc \u0645\u06cc\u0644 \u0645\u062a\u062d\u0631\u06a9 \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0628\u0646\u0627\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0627\u06cc\u06a9 \u0628\u06c1\u062a\u0631 \u0688\u0648\u06cc\u0644\u067e\u0631 \u06a9\u0627 \u062a\u062c\u0631\u0628\u06c1 \u0641\u0631\u0627\u06c1\u0645 \u06a9\u0631\u062a\u0627 \u06c1\u06d2\u06d4 \u06cc\u06c1\u0627\u06ba \u06a9\u06cc\u0648\u06ba \u06c1\u06d2:<\/p>\n<ul>\n<li>\n<p><strong>\u0631\u062f \u0639\u0645\u0644 \u06a9\u0627 \u0645\u0627\u0646\u0648\u0633 \u0646\u062d\u0648:<\/strong> \u0627\u06af\u0631 \u0622\u067e React \u06a9\u0648 \u067e\u06c1\u0644\u06d2 \u0633\u06d2 \u062c\u0627\u0646\u062a\u06d2 \u06c1\u06cc\u06ba \u062a\u0648 React \u0627\u06cc \u0645\u06cc\u0644 \u0622\u067e \u06a9\u0648 \u0627\u06cc\u06a9 \u0627\u0644\u06af \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0644\u06cc\u0646\u06af\u0648\u06cc\u062c \u0633\u06cc\u06a9\u06be\u0646\u06d2\u060c \u0627\u06cc\u06a9 \u063a\u06cc\u0631 \u0645\u0648\u062b\u0631 \u0688\u0631\u06cc\u06af \u0627\u06cc\u0646\u0688 \u0688\u0631\u0627\u067e UI \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2\u060c \u06cc\u0627 HTML \u0679\u06cc\u0628\u0644\u0632 \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u0634\u0631\u0648\u0639 \u0633\u06d2 \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0628\u0646\u0627\u0646\u06d2 \u06a9\u06cc \u067e\u0631\u06cc\u0634\u0627\u0646\u06cc \u0633\u06d2 \u0628\u0686\u0627\u062a\u0627 \u06c1\u06d2\u06d4<\/p>\n<\/li>\n<li>\n<p><strong>\u0628\u0644\u0679 \u0645\u06cc\u06ba \u062f\u0648\u0628\u0627\u0631\u06c1 \u0642\u0627\u0628\u0644 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u0627\u062c\u0632\u0627\u0621<\/strong>: React \u0627\u06cc \u0645\u06cc\u0644 \u0628\u0679\u0646 \u0627\u0648\u0631 \u0641\u0648\u0679\u0631 \u062c\u06cc\u0633\u06d2 \u0622\u0624\u0679 \u0622\u0641 \u062f\u06cc \u0628\u0627\u06a9\u0633 UI \u0627\u062c\u0632\u0627\u0621 \u0641\u0631\u0627\u06c1\u0645 \u06a9\u0631\u062a\u0627 \u06c1\u06d2\u060c \u062c\u0648 \u0622\u067e \u06a9\u06d2 \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u06cc \u062a\u0631\u0642\u06cc \u06a9\u0648 \u06c1\u0645\u0648\u0627\u0631 \u0627\u0648\u0631 \u062a\u06cc\u0632 \u0628\u0646\u0627\u062a\u0627 \u06c1\u06d2 \u06a9\u06cc\u0648\u0646\u06a9\u06c1 \u0622\u067e \u06a9\u0648 \u0634\u0631\u0648\u0639 \u0633\u06d2 \u0634\u0631\u0648\u0639 \u06a9\u0631\u0646\u06d2 \u06a9\u06cc \u0636\u0631\u0648\u0631\u062a \u0646\u06c1\u06cc\u06ba \u06c1\u06d2\u06d4<\/p>\n<\/li>\n<li>\n<p><strong>\u0627\u06cc \u0645\u06cc\u0644 \u06a9\u0644\u0627\u0626\u0646\u0679\u0633 \u0645\u06cc\u06ba \u0645\u0637\u0627\u0628\u0642\u062a<\/strong>: React \u0627\u06cc \u0645\u06cc\u0644 \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0628\u0646\u0627\u062a\u0627 \u06c1\u06d2 \u062c\u0646 \u06a9\u0627 \u062a\u062c\u0631\u0628\u06c1 \u06a9\u06cc\u0627 \u062c\u0627\u062a\u0627 \u06c1\u06d2 \u0627\u0648\u0631 \u0645\u0634\u06c1\u0648\u0631 \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u0644\u0627\u0626\u0646\u0679\u0633 \u0645\u06cc\u06ba \u0627\u0686\u06be\u06cc \u0637\u0631\u062d \u06a9\u0627\u0645 \u06a9\u0631\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4 \u0627\u0633 \u0633\u06d2 \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u0644\u0627\u0626\u0646\u0679\u0633 \u0645\u06cc\u06ba \u0622\u067e \u06a9\u06cc \u0627\u06cc \u0645\u06cc\u0644\u0632 \u06a9\u0648 \u0645\u062a\u0636\u0627\u062f \u0637\u0648\u0631 \u067e\u0631 \u067e\u06cc\u0634 \u06a9\u06cc\u06d2 \u062c\u0627\u0646\u06d2 \u06a9\u06d2 \u062e\u062f\u0634\u0627\u062a \u06a9\u0648 \u062e\u062a\u0645 \u06a9\u0631\u0646\u06d2 \u0645\u06cc\u06ba \u0645\u062f\u062f \u0645\u0644\u062a\u06cc \u06c1\u06d2\u06d4<\/p>\n<\/li>\n<li>\n<p><strong>\u0627\u06cc \u0645\u06cc\u0644 \u06a9\u06cc \u062a\u0631\u0642\u06cc \u06a9\u06d2 \u0627\u0648\u0632\u0627\u0631<\/strong>: React \u0627\u06cc \u0645\u06cc\u0644 \u062a\u062d\u0631\u06cc\u0631\u06cc \u0627\u06cc \u0645\u06cc\u0644\u0632 \u06a9\u0627 \u062c\u0627\u0626\u0632\u06c1 \u0644\u06cc\u0646\u06d2 \u0627\u0648\u0631 \u062c\u0627\u0646\u0686\u0646\u06d2 \u06a9\u06cc \u0635\u0644\u0627\u062d\u06cc\u062a \u0631\u06a9\u06be\u062a\u06cc \u06c1\u06d2\u06d4 \u0627\u0646 \u062e\u0635\u0648\u0635\u06cc\u0627\u062a \u0645\u06cc\u06ba \u0633\u06d2 \u06a9\u0686\u06be \u0634\u0627\u0645\u0644 \u06c1\u06cc\u06ba:<\/p>\n<ul>\n<li>\n<p>\u0627\u06cc\u06a9 \u0645\u0642\u0627\u0645\u06cc \u0688\u0648\u06cc\u0644\u067e\u0645\u0646\u0679 \u0633\u0631\u0648\u0631 \u062c\u0648 \u0648\u06cc\u0628 \u0628\u0631\u0627\u0624\u0632\u0631 \u0645\u06cc\u06ba \u0622\u067e \u06a9\u06cc \u0627\u06cc \u0645\u06cc\u0644\u0632 \u06a9\u06d2 \u0645\u0648\u0628\u0627\u0626\u0644 \u0627\u0648\u0631 \u0688\u06cc\u0633\u06a9 \u0679\u0627\u067e \u0648\u06cc\u0648\u0632 \u06a9\u0627 \u067e\u06cc\u0634 \u0646\u0638\u0627\u0631\u06c1 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u0622\u067e \u06a9\u0648 \u062d\u0642\u06cc\u0642\u06cc \u0648\u0642\u062a \u0645\u06cc\u06ba \u0627\u067e\u0646\u06cc \u0627\u06cc \u0645\u06cc\u0644\u0632 \u062a\u06cc\u0627\u0631 \u06a9\u0631\u0646\u06d2 \u062f\u06cc\u062a\u0627 \u06c1\u06d2\u06d4<\/p>\n<\/li>\n<li>\n<p>\u067e\u06cc\u0634 \u0646\u0638\u0627\u0631\u06c1 \u06a9\u06d2 \u0644\u06cc\u06d2 \u062d\u0642\u06cc\u0642\u06cc \u0627\u06cc \u0645\u06cc\u0644 \u067e\u062a\u06d2 \u067e\u0631 \u0627\u06cc \u0645\u06cc\u0644 \u0628\u06be\u06cc\u062c\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0627\u06cc \u0645\u06cc\u0644 \u0641\u0627\u0631\u0648\u0631\u0688\u0646\u06af \u06a9\u06cc \u062e\u0635\u0648\u0635\u06cc\u062a<\/p>\n<\/li>\n<li>\n<p>\u0645\u0637\u0627\u0628\u0642\u062a \u0686\u06cc\u06a9\u0631 \u062c\u0648 \u0638\u0627\u06c1\u0631 \u06a9\u0631\u062a\u0627 \u06c1\u06d2 \u06a9\u06c1 \u0645\u0634\u06c1\u0648\u0631 \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u0644\u0627\u0626\u0646\u0679\u0633 \u06a9\u06d2 \u0630\u0631\u06cc\u0639\u06c1 \u0622\u067e \u06a9\u06cc \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u0648 \u06a9\u062a\u0646\u06cc \u0627\u0686\u06be\u06cc \u0637\u0631\u062d \u0633\u06d2 \u0633\u067e\u0648\u0631\u0679 \u06a9\u06cc\u0627 \u062c\u0627\u062a\u0627 \u06c1\u06d2\u06d4<\/p>\n<\/li>\n<li>\n<p>\u0633\u067e\u06cc\u0645 \u0633\u06a9\u0648\u0631 \u0645\u06cc\u0679\u0631 \u062c\u0648 \u0622\u067e \u06a9\u06cc \u0627\u06cc \u0645\u06cc\u0644\u0632 \u06a9\u0627 \u062a\u062c\u0632\u06cc\u06c1 \u06a9\u0631\u062a\u0627 \u06c1\u06d2 \u062a\u0627\u06a9\u06c1 \u06cc\u06c1 \u062a\u0639\u06cc\u0646 \u06a9\u06cc\u0627 \u062c\u0627 \u0633\u06a9\u06d2 \u06a9\u06c1 \u0622\u06cc\u0627 \u0627\u0646 \u067e\u0631 \u0633\u067e\u06cc\u0645 \u06a9\u06d2 \u0628\u0637\u0648\u0631 \u0646\u0634\u0627\u0646 \u0632\u062f \u06c1\u0648\u0646\u06d2 \u06a9\u0627 \u0627\u0645\u06a9\u0627\u0646 \u06c1\u06d2\u06d4<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>\u0679\u06cc\u0644 \u0648\u0646\u0688 \u0627\u0646\u0636\u0645\u0627\u0645<\/strong>: Tailwind \u0627\u06cc\u06a9 \u0645\u0642\u0628\u0648\u0644 CSS \u0641\u0631\u06cc\u0645 \u0648\u0631\u06a9 \u06c1\u06d2 \u062c\u0648 HTML \u06a9\u0648 \u0627\u0633\u0679\u0627\u0626\u0644 \u06a9\u0631\u0646\u06d2 \u0627\u0648\u0631 \u0627\u0633\u06d2 \u0631\u06cc\u0633\u067e\u0627\u0646\u0633\u06cc\u0648 \u0628\u0646\u0627\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u06a9\u0644\u0627\u0633\u0632 \u0641\u0631\u0627\u06c1\u0645 \u06a9\u0631\u062a\u0627 \u06c1\u06d2\u06d4 React \u0627\u06cc \u0645\u06cc\u0644 \u062e\u0648\u0628\u0635\u0648\u0631\u062a \u0627\u06cc \u0645\u06cc\u0644\u0632 \u0628\u0646\u0627\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 Tailwind \u06a9\u06d2 \u0633\u0627\u062a\u06be \u0622\u0633\u0627\u0646\u06cc \u0633\u06d2 \u0636\u0645 \u06c1\u0648\u062c\u0627\u062a\u06cc \u06c1\u06d2\u06d4<\/p>\n<\/li>\n<\/ul>\n<p>\u06cc\u06c1 \u062a\u0645\u0627\u0645 \u062e\u0635\u0648\u0635\u06cc\u0627\u062a \u0645\u0641\u062a \u0645\u06cc\u06ba \u062f\u0633\u062a\u06cc\u0627\u0628 \u06c1\u06cc\u06ba\u06d4<\/p>\n<p>\u0627\u0633 \u0622\u0631\u0679\u06cc\u06a9\u0644 \u0645\u06cc\u06ba\u060c \u0622\u067e \u062c\u0627\u0646\u06cc\u06ba \u06af\u06d2 \u06a9\u06c1 \u0631\u06cc \u0627\u06cc\u06a9\u0679 \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0633\u06d2 HTML \u0641\u0627\u0626\u0644 \u06a9\u06cc\u0633\u06d2 \u0628\u0646\u0627\u0646\u0627 \u06c1\u06d2\u060c \u0627\u0633\u06d2 \u06af\u0648 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0645\u06cc\u06ba \u062a\u0628\u062f\u06cc\u0644 \u06a9\u0631\u0646\u0627 \u06c1\u06d2\u060c \u0627\u0648\u0631 \u067e\u06cc\u0634 \u0646\u0638\u0627\u0631\u06c1 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0645\u06cc\u06ba \u0688\u06cc\u0679\u0627 \u062f\u0627\u062e\u0644 \u06a9\u0631\u0646\u0627 \u06c1\u06d2\u06d4<\/p>\n<h2 id=\"heading-go-templates\">\u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0645\u0646\u062a\u0642\u0644 \u06a9\u0631\u06cc\u06ba\u06d4<\/h2>\n<p>Go html\/template \u067e\u06cc\u06a9\u06cc\u062c \u0622\u067e \u06a9\u0648 \u062f\u0648\u0628\u0627\u0631\u06c1 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u06d2 \u0642\u0627\u0628\u0644 HTML \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u06a9\u06cc \u0648\u0636\u0627\u062d\u062a \u06a9\u0631\u0646\u06d2 \u06a9\u06cc \u0627\u062c\u0627\u0632\u062a \u062f\u06cc\u062a\u0627 \u06c1\u06d2 \u062c\u0648 \u0645\u062a\u062d\u0631\u06a9 \u0688\u06cc\u0679\u0627 \u0633\u06d2 \u0628\u06be\u0631\u06d2 \u062c\u0627 \u0633\u06a9\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4 \u0627\u0646 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0645\u06cc\u06ba \u067e\u0644\u06cc\u0633 \u06c1\u0648\u0644\u0688\u0631\u0632 (\u062c\u0633\u06d2 \u0627\u06cc\u06a9\u0634\u0646 \u06a9\u06c1\u062a\u06d2 \u06c1\u06cc\u06ba) \u067e\u0631 \u0645\u0634\u062a\u0645\u0644 \u06c1\u0648\u062a\u0627 \u06c1\u06d2 \u062c\u0646 \u06a9\u06cc \u062c\u0627\u0646\u0686 \u06af\u0648 \u06a9\u06d2 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0627\u0646\u062c\u0646 \u06a9\u06d2 \u0630\u0631\u06cc\u0639\u06d2 \u06a9\u06cc \u062c\u0627\u062a\u06cc \u06c1\u06d2 \u0627\u0648\u0631 \u0639\u0645\u0644 \u062f\u0631\u0622\u0645\u062f \u06a9\u06d2 \u062f\u0648\u0631\u0627\u0646 \u0627\u0635\u0644 \u0642\u062f\u0631\u0648\u06ba \u0633\u06d2 \u0628\u062f\u0644 \u062f\u06cc \u062c\u0627\u062a\u06cc \u06c1\u06d2\u06d4<\/p>\n<p>\u0633\u0628 \u0633\u06d2 \u067e\u06c1\u0644\u06d2\u060c \u06c1\u0645 \u067e\u06cc\u06a9\u062c \u06a9\u0648 Go-specific \u062a\u0634\u0631\u06cc\u062d\u0627\u062a \u06a9\u06d2 \u0633\u0627\u062a\u06be HTML \u0645\u0648\u0627\u062f \u0641\u0631\u0627\u06c1\u0645 \u06a9\u0631\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4 HTML \u0645\u0648\u0627\u062f \u06a9\u0648 Go HTML \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0645\u06cc\u06ba \u062a\u0628\u062f\u06cc\u0644 \u06a9\u0631\u062a\u0627 \u06c1\u06d2 \u0627\u0648\u0631 \u06af\u0648 \u06a9\u06d2 \u0645\u062e\u0635\u0648\u0635 \u062a\u0628\u0635\u0631\u0648\u06ba \u06a9\u0648 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0645\u06cc\u06ba \u06a9\u0627\u0631\u0631\u0648\u0627\u0626\u06cc\u0648\u06ba \u0645\u06cc\u06ba \u062a\u0628\u062f\u06cc\u0644 \u06a9\u0631\u062a\u0627 \u06c1\u06d2\u06d4 \u0627\u0633 \u06a9\u06d2 \u0628\u0639\u062f \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u06a9\u0648 \u0688\u06cc\u0679\u0627 \u06a9\u06d2 \u0633\u0627\u062a\u06be \u0686\u0644\u0627\u06cc\u0627 \u062c\u0627\u062a\u0627 \u06c1\u06d2 \u062a\u0627\u06a9\u06c1 \u0688\u06cc\u0679\u0627 \u067e\u0631 \u0645\u0634\u062a\u0645\u0644 HTML \u0622\u0624\u0679 \u067e\u0679 \u062a\u06cc\u0627\u0631 \u06a9\u06cc\u0627 \u062c\u0627 \u0633\u06a9\u06d2\u06d4<\/p>\n<pre><code class=\"language-go\">package main\n\nimport (\n\t\"html\/template\"\n\t\"os\"\n)\n\nfunc main() {\n\ttmpl := template.New(\"hello\")\n\ttmpl, _ = tmpl.Parse(`<p>Hello {{.}}<\/p>`)\n\ttmpl.Execute(os.Stdout, \"Gopher\")\n}\n\n\/\/ Output: <p>Hello Gopher<\/p>\n\/\/ Playground: https:\/\/goplay.tools\/snippet\/KxbkWPIArz5\n<\/code><\/pre>\n<p>\u0627\u0648\u067e\u0631 \u06a9\u0648\u0688 \u06a9\u06d2 \u0679\u06a9\u0691\u0648\u06ba \u0645\u06cc\u06ba:<\/p>\n<ul>\n<li>\n<p><code>template.New<\/code>    &quot;\u06c1\u06cc\u0644\u0648&#8221; \u06a9\u06d2 \u0646\u0627\u0645 \u0633\u06d2 \u0627\u06cc\u06a9 \u062e\u0627\u0644\u06cc \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0622\u0628\u062c\u06cc\u06a9\u0679 \u0628\u0646\u0627\u0626\u06cc\u06ba\u06d4<\/p>\n<\/li>\n<li>\n<p><code>tmpl.Parse(`<\/p>\n<p>Hello {{.}}<\/p>\n<p>`)<\/code>    HTML \u0633\u0679\u0631\u0646\u06af \u06a9\u0648 \u067e\u0627\u0631\u0633 \u06a9\u0631\u06cc\u06ba\u06d4 <code><\/p>\n<p>Hello {{.}}<\/p>\n<p><\/code> Go HTML \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0628\u0646\u0627\u0626\u06cc\u06ba \u0627\u0648\u0631 \u0645\u062d\u0641\u0648\u0638 \u06a9\u0631\u06cc\u06ba\u06d4 <code>tmpl<\/code> . \u06a9\u06c1 <code>{{.}}<\/code> HTML \u0633\u0679\u0631\u0646\u06af \u06a9\u06d2 \u062d\u0635\u06d2 \u0688\u06cc\u0679\u0627 \u06a9\u06d2 \u0644\u06cc\u06d2 \u067e\u0644\u06cc\u0633 \u06c1\u0648\u0644\u0688\u0631\u0632 \u06a9\u06d2 \u0637\u0648\u0631 \u067e\u0631 \u06a9\u0627\u0645 \u06a9\u0631\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4 <code>{{<\/code> \u0627\u0648\u0631 <code>}}<\/code> \u0627\u0633\u06d2 \u0627\u0644\u06af \u06a9\u0631\u0646\u06d2 \u0648\u0627\u0644\u0627 \u06a9\u06c1\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4 <code>.<\/code> \u0688\u06cc\u0679\u0627 \u062a\u06a9 \u0631\u0633\u0627\u0626\u06cc \u06a9\u0627 \u0634\u0646\u0627\u062e\u062a \u06a9\u0646\u0646\u062f\u06c1\u06d4<\/p>\n<\/li>\n<li>\n<p><code>tmpl.Execute(os.Stdout, \"Gopher\")<\/code>    \u0688\u06cc\u0679\u0627 (&quot;\u06af\u0648\u0641\u0631&#8221;\u060c \u0627\u06cc\u06a9 \u0633\u0679\u0631\u0646\u06af) \u06a9\u06d2 \u0633\u0627\u062a\u06be \u06a9\u0627\u0645 \u06a9\u0648 \u0622\u0628\u0627\u062f \u06a9\u0631\u06cc\u06ba \u0627\u0648\u0631 \u0646\u062a\u06cc\u062c\u06d2 \u0645\u06cc\u06ba \u0622\u0646\u06d2 \u0648\u0627\u0644\u06d2 HTML \u0622\u0624\u0679 \u067e\u0679 \u06a9\u0648 \u06a9\u0646\u0633\u0648\u0644 \u0645\u06cc\u06ba \u0644\u06a9\u06be\u06cc\u06ba\u06d4<\/p>\n<\/li>\n<\/ul>\n<h3 id=\"heading-go-template-delimiters\">\u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0633\u06cc\u067e\u0631\u06cc\u0679\u0631 \u067e\u0631 \u062c\u0627\u0626\u06cc\u06ba\u06d4<\/h3>\n<p>\u067e\u0686\u06be\u0644\u06d2 \u06a9\u0648\u0688 \u06a9\u06d2 \u0679\u06a9\u0691\u06d2 \u0645\u06cc\u06ba\u060c \u0688\u0628\u0644 \u0645\u0646\u062d\u0646\u06cc \u062e\u0637\u0648\u0637 \u0648\u062d\u062f\u0627\u0646\u06cc (<code>{{<\/code> \u0627\u0648\u0631 <code>}}<\/code>) \u06af\u0648 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0645\u06cc\u06ba \u062d\u062f \u0628\u0646\u062f\u06cc \u06a9\u06d2 \u0637\u0648\u0631 \u067e\u0631\u06d4 \u062d\u062f \u0628\u0646\u062f\u06cc \u0627\u06cc\u06a9 \u0639\u0644\u0627\u0645\u062a \u06c1\u06d2 \u062c\u0633\u06d2 Go \u0627\u0633 \u0628\u0627\u062a \u06a9\u0627 \u062a\u0639\u06cc\u0646 \u06a9\u0631\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u0627 \u06c1\u06d2 \u06a9\u06c1 \u0627\u0646 \u067e\u0679 \u0633\u0679\u0631\u0646\u06af \u06a9\u0627 \u06a9\u0648\u0646 \u0633\u0627 \u062d\u0635\u06c1 \u0622\u067e\u0631\u06cc\u0634\u0646 \u06a9\u06cc \u0646\u0645\u0627\u0626\u0646\u062f\u06af\u06cc \u06a9\u0631\u062a\u0627 \u06c1\u06d2\u060c \u06cc\u0639\u0646\u06cc \u062c\u0633 \u0628\u06cc\u0627\u0646 \u06a9\u0627 \u062c\u0627\u0626\u0632\u06c1 \u0644\u06cc\u0627 \u062c\u0627\u0646\u0627 \u06c1\u06d2\u06d4<\/p>\n<p>\u0622\u067e \u0627\u0633 \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u062d\u062f \u0628\u0646\u062f\u06cc \u06a9\u0648 \u062a\u0628\u062f\u06cc\u0644 \u06a9\u0631 \u0633\u06a9\u062a\u06d2 \u06c1\u06cc\u06ba: <code>Delims<\/code> \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u067e\u0631 \u0637\u0631\u06cc\u0642\u06c1\u06d4 \u0627\u06cc\u06a9 \u0645\u062b\u0627\u0644 \u0630\u06cc\u0644 \u06a9\u06d2 \u0679\u06a9\u0691\u0648\u06ba \u0645\u06cc\u06ba \u062f\u06a9\u06be\u0627\u0626\u06cc \u06af\u0626\u06cc \u06c1\u06d2\u06d4<\/p>\n<pre><code class=\"language-go\">package main\n\nimport (\n\t\"html\/template\"\n\t\"os\"\n)\n\nfunc main() {\n\ttmpl := template.New(\"hello\")\n\ttmpl, _ = tmpl.Delims(\"((\", \"))\").Parse(`<p>Hello ((.))<\/p>`)\n\ttmpl.Execute(os.Stdout, \"Gopher\")\n}\n\n\/\/ Output: <p>Hello Gopher<\/p>\n\/\/ Playground: https:\/\/goplay.tools\/snippet\/00RuDzvZYwN\n<\/code><\/pre>\n<p>\u0627\u0648\u067e\u0631 \u06a9\u06d2 \u0679\u06a9\u0691\u0648\u06ba \u0645\u06cc\u06ba <code>((<\/code> \u0627\u0648\u0631 <code>))<\/code> \u062c\u062f\u0627\u06a9\u0627\u0631 \u06a9\u06d2 \u0637\u0648\u0631 \u067e\u0631 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u06cc\u0627 \u062c\u0627\u062a\u0627 \u06c1\u06d2\u06d4 <code>hello<\/code> \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679<\/p>\n<p>\u06cc\u06c1 \u0627\u06c1\u0645 \u06c1\u06d2 \u06a9\u06cc\u0648\u0646\u06a9\u06c1 \u06cc\u06c1 React \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0645\u06cc\u06ba Go \u06a9\u06d2 \u0688\u06cc\u0641\u0627\u0644\u0679 \u0688\u06cc\u0644\u06cc\u0645\u06cc\u0679\u0631 \u0627\u0648\u0631 React \u0645\u0646\u062d\u0646\u06cc \u062e\u0637\u0648\u0637 \u0648\u062d\u062f\u0627\u0646\u06cc \u06a9\u06d2 \u062f\u0631\u0645\u06cc\u0627\u0646 \u062a\u0646\u0627\u0632\u0639\u0627\u062a \u06a9\u0648 \u0631\u0648\u06a9\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0688\u06cc\u0644\u06cc\u0645\u06cc\u0679\u0631 \u0633\u06cc\u0679 \u06a9\u0631\u062a\u0627 \u06c1\u06d2\u06d4<\/p>\n<h2 id=\"heading-create-dynamic-emails-in-go-with-react-email\">React \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 Go \u0645\u06cc\u06ba \u0645\u062a\u062d\u0631\u06a9 \u0627\u06cc \u0645\u06cc\u0644\u0632 \u0628\u0646\u0627\u0646\u0627<\/h2>\n<p>\u0646\u06cc\u0686\u06d2 \u062f\u06cc \u06af\u0626\u06cc \u062a\u0635\u0648\u06cc\u0631 \u062e\u0644\u0627\u0635\u06c1 \u06a9\u0631\u062a\u06cc \u06c1\u06d2 \u06a9\u06c1 \u06c1\u0645 \u0627\u0633 \u0645\u0636\u0645\u0648\u0646 \u0645\u06cc\u06ba \u062c\u0648 \u0646\u0645\u0648\u0646\u06c1 \u0627\u06cc\u067e\u0644\u06cc\u06a9\u06cc\u0634\u0646 \u0628\u0646\u0627\u0626\u06cc\u06ba \u06af\u06d2 \u0648\u06c1 \u06a9\u06cc\u0633\u06d2 \u06a9\u0627\u0645 \u06a9\u0631\u062a\u06cc \u06c1\u06d2\u06d4<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/umang.pk\/wp-content\/uploads\/2026\/04\/1776743504_446_React-\u0627\u06cc-\u0645\u06cc\u0644-\u06a9\u0627-\u0627\u0633\u062a\u0639\u0645\u0627\u0644-\u06a9\u0631\u062a\u06d2-\u06c1\u0648\u0626\u06d2-Go-\u0645\u06cc\u06ba-\u0645\u062a\u062d\u0631\u06a9.png\" alt=\"React \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0645\u06cc\u06ba \u0645\u062a\u062d\u0631\u06a9 \u0688\u06cc\u0679\u0627 \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 HTML \u06a9\u0648 \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u0631\u06cc\u06ba\u06d4\" style=\"display:block;margin:0 auto\" width=\"600\" height=\"400\" loading=\"lazy\" title=\"\"><\/p>\n<p>\u06af\u0648 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u062a\u0634\u0631\u06cc\u062d\u0627\u062a \u06a9\u06d2 \u0633\u0627\u062a\u06be \u0627\u06cc\u06a9 \u0631\u06cc \u0627\u06cc\u06a9\u0679 \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0628\u0646\u0627\u0626\u06cc\u06ba\u06d4 \u0627\u06af\u0644\u0627\u060c \u06c1\u0645 Node.js \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u0627\u06cc\u06a9 HTML \u0641\u0627\u0626\u0644 \u0628\u0646\u0627\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4 \u06af\u0648 HTML \u0641\u0627\u0626\u0644 \u06a9\u0648 \u067e\u0627\u0631\u0633 \u06a9\u0631\u062a\u0627 \u06c1\u06d2\u060c \u06af\u0648 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u062a\u06cc\u0627\u0631 \u06a9\u0631\u062a\u0627 \u06c1\u06d2\u060c \u0627\u0633\u06d2 \u0686\u0644\u0627\u062a\u0627 \u06c1\u06d2 \u0627\u0648\u0631 \u0628\u06be\u06cc\u062c\u062a\u0627 \u06c1\u06d2\u06d4<\/p>\n<p>\u0627\u062e\u062a\u06cc\u0627\u0631\u06cc \u0637\u0648\u0631 \u067e\u0631\u060c \u0622\u067e \u06af\u0648 \u0645\u06cc\u0644 \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u0627\u06cc \u0645\u06cc\u0644\u0632 \u0628\u06be\u06cc\u062c \u0633\u06a9\u062a\u06d2 \u06c1\u06cc\u06ba \u0627\u0648\u0631 \u0645\u06cc\u0644 \u06c1\u0627\u06af\u060c \u0627\u06cc\u06a9 \u0645\u0642\u0627\u0645\u06cc SMTP \u0633\u0631\u0648\u0631 \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u0627\u067e\u0646\u06d2 \u0628\u0631\u0627\u0624\u0632\u0631 \u0645\u06cc\u06ba \u0627\u0646 \u06a9\u0627 \u062c\u0627\u0626\u0632\u06c1 \u0644\u06d2 \u0633\u06a9\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4<\/p>\n<h3 id=\"heading-set-up-the-project\">\u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u06a9\u06cc \u062a\u0631\u062a\u06cc\u0628\u0627\u062a<\/h3>\n<p>\u0633\u0628 \u0633\u06d2 \u067e\u06c1\u0644\u06d2\u060c \u06cc\u0642\u06cc\u0646\u06cc \u0628\u0646\u0627\u0626\u06cc\u06ba \u06a9\u06c1 \u0622\u067e \u06a9\u06d2 \u06a9\u0645\u067e\u06cc\u0648\u0679\u0631 \u067e\u0631 \u067e\u06c1\u0644\u06d2 \u0633\u06d2 \u06c1\u06cc Go \u0627\u0648\u0631 Node.js \u0627\u0646\u0633\u0679\u0627\u0644 \u06c1\u06cc\u06ba\u06d4 \u0627\u0633 freeCodeCamp-go-react-email \u0630\u062e\u06cc\u0631\u06c1 \u06a9\u0648 \u06a9\u0644\u0648\u0646 \u06a9\u0631\u06cc\u06ba \u0627\u0648\u0631 \u0627\u0633\u06d2 \u0686\u06cc\u06a9 \u06a9\u0631\u06cc\u06ba\u06d4 <code>01-setup<\/code> \u0628\u0631\u0627\u0646\u0686 \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 <code>git checkout 01-setup<\/code>.<\/p>\n<p>\u0645\u0646\u0635\u0648\u0628\u06d2 \u0645\u06cc\u06ba <code>main.go<\/code> \u0641\u0627\u0626\u0644 <code>cmd<\/code> \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u0627\u0648\u0631 <code>go.mod<\/code> \u0641\u0627\u0626\u0644 \u06cc\u06c1 \u0628\u06be\u06cc <code>.gitignore<\/code> \u0627\u06cc\u06a9 \u0641\u0627\u0626\u0644 \u062c\u0648 \u06af\u0679 \u06a9\u0648 \u06c1\u0631 \u0686\u06cc\u0632 \u06a9\u0648 \u0646\u0638\u0631 \u0627\u0646\u062f\u0627\u0632 \u06a9\u0631\u0646\u06d2 \u06a9\u0648 \u06a9\u06c1\u062a\u06cc \u06c1\u06d2\u06d4 <code>node_modules<\/code> \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc\u06d4<\/p>\n<p>\u0686\u0644\u0627\u0626\u06cc\u06ba <code>go run cmd\/main.go<\/code> \u0622\u067e \u06a9\u06d2 \u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u0679\u0631\u0645\u06cc\u0646\u0644 \u0645\u06cc\u06ba\u06d4 \u0627\u06af\u0631 \u0622\u067e \u06a9\u0648 \u067e\u06cc\u063a\u0627\u0645 \u0646\u0638\u0631 \u0622\u062a\u0627 \u06c1\u06d2 &quot;\u06cc\u06c1 \u06a9\u0627\u0645 \u06a9\u0631 \u0631\u06c1\u0627 \u06c1\u06d2!&#8221;\u060c \u06a9\u0646\u0633\u0648\u0644 \u0645\u06cc\u06ba \u0644\u0627\u06af \u0627\u0646 \u06a9\u0631\u06cc\u06ba\u060c \u0622\u067e \u0635\u062d\u06cc\u062d \u0637\u0631\u06cc\u0642\u06d2 \u0633\u06d2 \u0633\u06cc\u0679 \u0627\u067e \u06c1\u06cc\u06ba \u0627\u0648\u0631 \u0627\u06af\u0644\u06d2 \u062d\u0635\u06d2 \u0645\u06cc\u06ba \u062c\u0627 \u0633\u06a9\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4<\/p>\n<h3 id=\"heading-set-up-react-email\">\u062c\u0648\u0627\u0628\u06cc \u0627\u06cc \u0645\u06cc\u0644 \u062a\u0631\u062a\u06cc\u0628 \u062f\u06cc\u06ba\u06d4<\/h3>\n<p>\u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u0631\u0648\u0679 \u0688\u0627\u0626\u0631\u06a9\u0679\u0631\u06cc \u0645\u06cc\u06ba <code>mailer<\/code> \u0648\u06c1 \u0688\u0627\u0626\u0631\u06a9\u0679\u0631\u06cc \u062c\u0648 \u0645\u06cc\u0644\u0631 \u067e\u06cc\u06a9\u062c \u06a9\u06d2 \u0637\u0648\u0631 \u067e\u0631 \u06a9\u0627\u0645 \u06a9\u0631\u06d2 \u06af\u06cc\u06d4 \u0627\u0633 \u0645\u06cc\u06ba \u0645\u06cc\u0644 \u0628\u0646\u0627\u0646\u06d2 \u0627\u0648\u0631 \u0628\u06be\u06cc\u062c\u0646\u06d2 \u0633\u06d2 \u0645\u062a\u0639\u0644\u0642 \u062a\u0645\u0627\u0645 \u0627\u0641\u0639\u0627\u0644 \u06c1\u06cc\u06ba\u06d4<\/p>\n<p>\u067e\u0631 <code>mailer<\/code> \u0627\u06cc\u06a9 \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u0628\u0646\u0627\u0626\u06cc \u062c\u0627\u0626\u06d2 \u06af\u06cc\u06d4 <code>emails<\/code> \u0627\u06cc\u06a9 Node.js \u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u062c\u0648 React \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u06cc \u0641\u0639\u0627\u0644\u06cc\u062a \u06a9\u0648 \u0633\u0646\u0628\u06be\u0627\u0644\u06d2 \u06af\u0627\u06d4 \u0627\u06cc\u06a9 \u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u0628\u0646\u0627\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2:<\/p>\n<ul>\n<li>\n<p>\u0646\u0627\u0645\u06cc \u0627\u06cc\u06a9 \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u0628\u0646\u0627\u0626\u06cc\u06ba <code>_emails<\/code> \u067e\u0631 <code>mailer<\/code> \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u0688\u0627\u0626\u0631\u06a9\u0679\u0631\u06cc \u06a9\u06d2 \u0646\u0627\u0645 \u0627\u0646\u0688\u0631 \u0633\u06a9\u0648\u0631 \u0633\u06d2 \u0634\u0631\u0648\u0639 \u06c1\u0648\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4 \u06a9\u06cc\u0648\u0646\u06a9\u06c1 \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u06a9\u06d2 \u0646\u0627\u0645\u0648\u06ba \u06a9\u0648 \u0646\u0638\u0631 \u0627\u0646\u062f\u0627\u0632 \u06a9\u0631 \u062f\u06cc\u0646\u0627 \u0686\u0627\u06c1\u06cc\u06d2\u06d4 <code>go build<\/code> \u062d\u06a9\u0645 \u067e\u0631 \u0639\u0645\u0644 \u06a9\u06cc\u0627 \u062c\u0627\u062a\u0627 \u06c1\u06d2\u06d4 \u0644\u06c1\u0630\u0627\u060c \u06cc\u06c1 \u06af\u0648 \u06a9\u0645\u067e\u0627\u0626\u0644\u0688 \u0627\u06cc\u06af\u0632\u06cc\u06a9\u06cc\u0648\u0679\u06cc\u0628\u0644\u0632 \u0645\u06cc\u06ba \u0634\u0627\u0645\u0644 \u0646\u06c1\u06cc\u06ba \u06c1\u06d2\u06d4<\/p>\n<\/li>\n<li>\n<p>\u0686\u0644\u0627\u0626\u06cc\u06ba <code>npm init -y<\/code> \u062c\u0691 \u0679\u0631\u0645\u06cc\u0646\u0644 \u0645\u06cc\u06ba <code>_emails<\/code> \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u062c\u0633 \u0645\u06cc\u06ba Node.js \u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u06a9\u0648 \u0634\u0631\u0648\u0639 \u06a9\u0631\u0646\u0627 \u06c1\u06d2\u06d4 \u0627\u06af\u0631 \u0622\u067e \u0627\u06cc\u0633\u0627 \u06a9\u0631\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4 <code>package.json<\/code> \u06cc\u06c1 \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u0645\u06cc\u06ba \u0627\u06cc\u06a9 \u0641\u0627\u0626\u0644 \u06c1\u06d2\u06d4<\/p>\n<\/li>\n<li>\n<p>\u0646\u0627\u0645 \u06a9\u06d2 \u062e\u0627\u0646\u06d2 \u0645\u06cc\u06ba \u0642\u062f\u0631 \u06a9\u0648 \u0627\u067e \u0688\u06cc\u0679 \u06a9\u0631\u06cc\u06ba\u06d4 <code>package.json<\/code> \u067e\u06cc\u06a9\u06cc\u062c \u06a9\u0627 \u0646\u0627\u0645 &quot;\u0627\u06cc \u0645\u06cc\u0644&#8221; \u067e\u0631 \u0633\u06cc\u0679 \u06a9\u0631\u06cc\u06ba \u062a\u0627\u06a9\u06c1 \u0627\u0633\u06d2 \u0645\u0632\u06cc\u062f \u0639\u0627\u0645 \u0628\u0646\u0627\u06cc\u0627 \u062c\u0627 \u0633\u06a9\u06d2\u06d4 \u0627\u0633 \u0642\u062f\u0645 \u06a9\u06cc \u0636\u0631\u0648\u0631\u062a \u0646\u06c1\u06cc\u06ba \u06c1\u06d2\u06d4<\/p>\n<\/li>\n<\/ul>\n<p>\u067e\u06be\u0631 \u0627\u067e\u0646\u06d2 \u0631\u0648\u0679 \u0679\u0631\u0645\u06cc\u0646\u0644 \u0645\u06cc\u06ba \u062f\u0631\u062c \u0630\u06cc\u0644 \u06a9\u0645\u0627\u0646\u0688 \u06a9\u0648 \u0686\u0644\u0627 \u06a9\u0631 \u0645\u0637\u0644\u0648\u0628\u06c1 React \u0627\u06cc \u0645\u06cc\u0644 \u0644\u0627\u0626\u0628\u0631\u06cc\u0631\u06cc\u0627\u06ba \u0627\u0646\u0633\u0679\u0627\u0644 \u06a9\u0631\u06cc\u06ba\u06d4 <code>_emails<\/code> \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc:<\/p>\n<pre><code class=\"language-shell\">npm install @react-email\/ui @types\/react -D -E\nnpm install react-email react react-dom -E\n<\/code><\/pre>\n<p>\u0627\u0646\u0633\u0679\u0627\u0644\u06cc\u0634\u0646 \u0645\u06a9\u0645\u0644 \u06c1\u0648\u0646\u06d2 \u06a9\u06d2 \u0628\u0639\u062f \u062a\u0628\u062f\u06cc\u0644 \u06a9\u0631\u06cc\u06ba\u06d4 <code>scripts<\/code> \u0645\u06cc\u062f\u0627\u0646 <code>package.json<\/code> \u0630\u06cc\u0644 \u0645\u06cc\u06ba \u06a9\u0648\u0688 \u06a9\u0627 \u0679\u06a9\u0691\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u0627\u06cc\u06a9 \u0641\u0627\u0626\u0644 \u0628\u0646\u0627\u0626\u06cc\u06ba\u06d4<\/p>\n<pre><code class=\"language-json\">  \"scripts\": {\n    \"dev\": \"email dev --dir .\/src\",\n    \"export\": \"email export --pretty --dir .\/src --outDir ..\/templates\"\n  },\n<\/code><\/pre>\n<p>\u06a9\u06c1 <code>dev<\/code> \u0628\u0631\u0627\u0624\u0632\u0631 \u0645\u06cc\u06ba \u0631\u06cc \u0627\u06cc\u06a9\u0679 \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u06a9\u0627 \u067e\u06cc\u0634 \u0646\u0638\u0627\u0631\u06c1 \u06a9\u0631\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0627\u0633\u06a9\u0631\u067e\u0679 \u0634\u0631\u0648\u0639 \u06c1\u0648\u062a\u0627 \u06c1\u06d2 \u0627\u0648\u0631 \u0633\u0631\u0648\u0631 \u0686\u0644\u0627\u062a\u0627 \u06c1\u06d2\u06d4 React \u06a9\u06d2 \u0633\u0627\u062a\u06be \u0627\u06cc\u06a9 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0628\u0646\u0627\u0626\u06cc\u06ba \u0627\u0648\u0631 \u0627\u0633\u06d2 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u06cc\u06ba\u06d4 <code>src<\/code> \u0646\u06cc\u0686\u06d2 \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc <code>_emails<\/code>. \u06a9\u06c1 <code>export<\/code> \u0627\u0633\u06a9\u0631\u067e\u0679 \u062f\u0631\u062c \u0630\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0641\u0627\u0626\u0644\u0648\u06ba \u06a9\u0648 \u0645\u0646\u062a\u0642\u0644 \u06a9\u0631\u062a\u0627 \u06c1\u06d2\u06d4 <code>src<\/code> \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u06a9\u0648 JSX (\u06cc\u0627 TSX) \u0633\u06d2 HTML \u0645\u06cc\u06ba \u062a\u0628\u062f\u06cc\u0644 \u06a9\u0631\u06cc\u06ba \u0627\u0648\u0631 \u0627\u0633\u06d2 \u062f\u0631\u062c \u0630\u06cc\u0644 \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u0645\u06cc\u06ba \u0645\u062d\u0641\u0648\u0638 \u06a9\u0631\u06cc\u06ba: <code>templates<\/code>\u06a9\u0627 \u0628\u0631\u0627\u06c1 \u0631\u0627\u0633\u062a \u0628\u0686\u06c1 <code>mailer<\/code> \u0688\u0627\u0626\u0631\u06a9\u0679\u0631\u06cc &#8211; \u0627\u06cc\u06a9 \u0628\u0686\u06c1 \u0646\u06c1\u06cc\u06ba <code>_emails<\/code> \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc<\/p>\n<p>\u06a9\u06c1 <code>templates<\/code> \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc\u0632 \u06a9\u0648 \u0630\u06cc\u0644\u06cc \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc\u0632 \u06a9\u06d2 \u0637\u0648\u0631 \u067e\u0631 \u0645\u062d\u0641\u0648\u0638 \u06a9\u06cc\u0627 \u062c\u0627\u062a\u0627 \u06c1\u06d2\u06d4 <code>mailer<\/code> \u06a9\u06cc\u0648\u0646\u06a9\u06c1 \u06af\u0648 \u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u06a9\u0648 \u0635\u0631\u0641 \u0627\u0633 \u0645\u06cc\u06ba \u0630\u062e\u06cc\u0631\u06c1 \u0634\u062f\u06c1 HTML \u0622\u0624\u0679 \u067e\u0679 \u06a9\u06cc \u0636\u0631\u0648\u0631\u062a \u06c1\u06d2: <code>templates<\/code> \u063a\u06cc\u0631 \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u0645\u0648\u0627\u062f <code>_emails<\/code>.<\/p>\n<p>\u0627\u06af\u0631 \u0622\u067e \u0646\u06d2 \u06cc\u06c1 \u062a\u0645\u0627\u0645 \u0645\u0631\u0627\u062d\u0644 \u0645\u06a9\u0645\u0644 \u06a9\u0631 \u0644\u06cc\u06d2 \u06c1\u06cc\u06ba\u060c \u062a\u0648 \u0622\u067e \u0646\u06d2 React \u0627\u06cc \u0645\u06cc\u0644 \u062a\u0631\u062a\u06cc\u0628 \u062f\u06cc \u06c1\u06d2: <code>emails<\/code> Node.js \u067e\u0631\u0648\u062c\u06cc\u06a9\u0679\u06d4 \u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u06a9\u06cc \u0645\u0648\u062c\u0648\u062f\u06c1 \u0635\u0648\u0631\u062a\u062d\u0627\u0644 \u062f\u06cc\u06a9\u06be\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2\u060c freeCodeCamp-go-react-email\/02-setup-react-email \u0645\u0644\u0627\u062d\u0638\u06c1 \u06a9\u0631\u06cc\u06ba\u06d4<\/p>\n<p>\u0627\u06af\u0644\u06d2 \u062d\u0635\u06d2 \u0645\u06cc\u06ba\u060c \u06c1\u0645 \u0627\u06cc\u06a9 React \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0628\u0646\u0627\u0626\u06cc\u06ba \u06af\u06d2 \u0627\u0648\u0631 \u0628\u0631\u0627\u0624\u0632\u0631 \u0645\u06cc\u06ba \u0627\u0633 \u06a9\u0627 \u062c\u0627\u0626\u0632\u06c1 \u0644\u06cc\u06ba \u06af\u06d2\u06d4<\/p>\n<h3 id=\"heading-create-a-react-email-template\">\u0627\u06cc\u06a9 React \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0628\u0646\u0627\u0626\u06cc\u06ba<\/h3>\n<p>\u0627\u0633 \u0633\u06cc\u06a9\u0634\u0646 \u0645\u06cc\u06ba\u060c \u0622\u067e \u0627\u06cc\u06a9 React \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0628\u0646\u0627\u0626\u06cc\u06ba \u06af\u06d2 \u0627\u0648\u0631 \u0628\u0631\u0627\u0624\u0632\u0631 \u0645\u06cc\u06ba \u0627\u0633 \u06a9\u0627 \u062c\u0627\u0626\u0632\u06c1 \u0644\u06cc\u06ba \u06af\u06d2\u06d4 \u0622\u067e \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0628\u06be\u06cc \u0628\u0646\u0627 \u0633\u06a9\u062a\u06d2 \u06c1\u06cc\u06ba \u0627\u0648\u0631 \u0627\u0646\u06c1\u06cc\u06ba HTML \u0641\u0627\u0626\u0644\u0648\u06ba \u06a9\u06d2 \u0628\u0637\u0648\u0631 \u0627\u06cc\u06a9\u0633\u067e\u0648\u0631\u0679 \u0628\u06be\u06cc \u06a9\u0631 \u0633\u06a9\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4<\/p>\n<p>\u0646\u0627\u0645\u06cc \u0627\u06cc\u06a9 \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u0628\u0646\u0627\u0626\u06cc\u06ba <code>src<\/code> \u0645\u06cc\u06ba <code>_emails<\/code> \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u0627\u0646\u062f\u0631\u0648\u0646\u06cc <code>src<\/code> \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u06a9\u06d2 \u0646\u0627\u0645 \u0633\u06d2 \u0627\u06cc\u06a9 \u0641\u0627\u0626\u0644 \u0628\u0646\u0627\u0626\u06cc\u06ba\u06d4 <code>welcome.tsx<\/code>. \u0630\u06cc\u0644 \u06a9\u06d2 \u0679\u06a9\u0691\u0648\u06ba \u06a9\u06d2 \u0645\u0648\u0627\u062f \u06a9\u0648 \u06a9\u0627\u067e\u06cc \u0627\u0648\u0631 \u067e\u06cc\u0633\u0679 \u06a9\u0631\u06cc\u06ba\u06d4 <code>welcome.tsx<\/code>.<\/p>\n<pre><code class=\"language-typescript\">import {\n  Body,\n  Button,\n  Container,\n  Head,\n  Heading,\n  Html,\n  Img,\n  Preview,\n  Section,\n  Tailwind,\n  Text,\n} from \"react-email\";\n\ninterface WelcomeEmailProps {\n  username?: string;\n  company?: string;\n  gophers?: string[];\n}\n\nconst WelcomeEmail = ({\n  username = \"Nicole\",\n  company = \"GoWorld\",\n  gophers = [\"Tinky Winky\", \"Dipsy\", \"Laa-Laa\", \"Po\"],\n}: WelcomeEmailProps) => {\n  const previewText = `Welcome to ({company}, ){username}!`;\n\n  return (\n    \n      <\/code>\n      <preview>{previewText}<\/preview>\n      <tailwind>\n        \n          <container classname=\"mb-10 mx-auto p-5 max-w-[465px]\">\n            <section classname=\"mt-10\">\n              <img loading=\"lazy\" decoding=\"async\" src=\"{`https:\/\/storage.googleapis.com\/gopherizeme.appspot.com\/gophers\/69428e5ec867c34bb4a49d5a063fdbc2a6633aed.png`}\" width=\"80\" height=\"80\" alt=\"\u0644\u0648\u06af\u0648\" classname=\"my-0 mx-auto\" title=\"\">\n            <\/section>\n            <heading classname=\"text-2xl font-normal text-center p-0 my-8 mx-0\">\n              Welcome to <strong>{company}<\/strong>, {username}!\n            <\/heading>\n            <text classname=\"text-start text-base\">Hello {username},<\/text>\n            <text classname=\"text-start text-base leading-relaxed\">\n              We're excited to have you onboard at <strong>{company}<\/strong>.\n              We hope you enjoy your journey with us. If you have any questions\n              or need assistance, feel free to reach out to any of the following\n              gophers:\n            <\/text>\n            <div classname=\"text-start text-base leading-relaxed\">\n              <ul classname=\"pl-3\">\n                {gophers.map((gopher) => (\n                  <li>{gopher}<\/li>\n                ))}\n              <\/ul>\n            <\/div>\n            <section classname=\"text-center mt-[32px] mb-[32px]\">\n              <button classname=\"py-2.5 px-5 bg-white rounded-md text-base font-semibold no-underline text-center bg-black text-white\" href=\"{`https:\/\/go.dev`}\">\n                Get Started\n              <\/button>\n            <\/section>\n            <text classname=\"text-start text-base text-white\">\n              Cheers,\n              <br\/>The {company} Team\n            <\/text>\n          <\/container>\n        \n      <\/tailwind>\n    \n  );\n};\n\nexport default WelcomeEmail;\n<\/pre>\n<p>\u0627\u0648\u067e\u0631 \u06a9\u0648\u0688 \u06a9\u0627 \u0679\u06a9\u0691\u0627 React \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u06c1\u06d2 \u062c\u0633\u06d2 \u06c1\u0645 \u0627\u0633 \u0645\u0636\u0645\u0648\u0646 \u0645\u06cc\u06ba \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u06cc\u06ba \u06af\u06d2\u06d4 \u067e\u06cc\u0634 \u0646\u0638\u0627\u0631\u06c1 \u06a9\u0631\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0679\u0631\u0645\u06cc\u0646\u0644 \u067e\u0631 \u062c\u0627\u0626\u06cc\u06ba\u06d4 <code>_emails<\/code> \u0631\u0648\u0679 \u0688\u0627\u0626\u0631\u06a9\u0679\u0631\u06cc \u0627\u0648\u0631 \u0686\u0644\u0627\u0626\u06cc\u06ba\u06d4 <code>npm run dev<\/code> . \u0627\u067e\u0646\u06d2 \u0679\u0631\u0645\u06cc\u0646\u0644 \u0645\u06cc\u06ba \u062f\u06a9\u06be\u0627\u0626\u06d2 \u06af\u0626\u06d2 \u067e\u06cc\u0634 \u0646\u0638\u0627\u0631\u06c1 URL \u06a9\u0648 \u062f\u06cc\u06a9\u06be\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0627\u067e\u0646\u0627 \u0648\u06cc\u0628 \u0628\u0631\u0627\u0624\u0632\u0631 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u06cc\u06ba\u06d4 \u0628\u0627\u0626\u06cc\u06ba \u0633\u0627\u0626\u0688\u0628\u0627\u0631 \u0645\u06cc\u06ba &quot;\u062e\u0648\u0634 \u0622\u0645\u062f\u06cc\u062f&#8221; \u0644\u0646\u06a9 \u200b\u200b\u067e\u0631 \u06a9\u0644\u06a9 \u06a9\u0631\u06cc\u06ba \u0627\u0648\u0631 \u0622\u067e \u06a9\u0648 \u0646\u06cc\u0686\u06d2 \u0627\u0633\u06a9\u0631\u06cc\u0646 \u0634\u0627\u0679 \u062c\u06cc\u0633\u0627 UI \u0646\u0638\u0631 \u0622\u0626\u06d2 \u06af\u0627\u06d4<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/umang.pk\/wp-content\/uploads\/2026\/04\/1776743504_472_React-\u0627\u06cc-\u0645\u06cc\u0644-\u06a9\u0627-\u0627\u0633\u062a\u0639\u0645\u0627\u0644-\u06a9\u0631\u062a\u06d2-\u06c1\u0648\u0626\u06d2-Go-\u0645\u06cc\u06ba-\u0645\u062a\u062d\u0631\u06a9.png\" alt=\"\u0631\u06cc \u0627\u06cc\u06a9\u0679 \u0627\u06cc \u0645\u06cc\u0644 \u067e\u06cc\u0634 \u0646\u0638\u0627\u0631\u06c1 UI\" style=\"display:block;margin:0 auto\" width=\"600\" height=\"400\" loading=\"lazy\" title=\"\"><\/p>\n<p>\u0645\u0646\u062f\u0631\u062c\u06c1 \u0628\u0627\u0644\u0627 UI \u0645\u06cc\u06ba\u060c React Email \u0641\u0631\u0627\u06c1\u0645 \u06a9\u0631\u062f\u06c1 \u0688\u06cc\u0641\u0627\u0644\u0679 \u0627\u0642\u062f\u0627\u0631 \u06a9\u06d2 \u0633\u0627\u062a\u06be \u0627\u06cc \u0645\u06cc\u0644 \u067e\u06cc\u0634 \u06a9\u0631\u062a\u0627 \u06c1\u06d2\u06d4 <code>welcome<\/code> \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u06d4<\/p>\n<p>\u0633\u0631\u0648\u0631 \u06a9\u0648 \u0686\u0644\u0627\u0646\u06d2 \u0648\u0627\u0644\u06d2 \u0679\u0631\u0645\u06cc\u0646\u0644 \u0645\u06cc\u06ba \u0646\u06cc\u06a9\u0633\u0679 \u067e\u0631 \u06a9\u0644\u06a9 \u06a9\u0631\u06a9\u06d2 \u0633\u0631\u0648\u0631 \u06a9\u0648 \u0631\u0648\u06a9\u06cc\u06ba\u06d4 <code>CTRL + C<\/code>. HTML \u0622\u0624\u0679 \u067e\u0679 \u0628\u0646\u0627\u0626\u06cc\u06ba\u06d4 <code>src<\/code> \u0686\u0644\u0627 \u06a9\u0631 \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u0628\u0631\u0622\u0645\u062f \u06a9\u0631\u06cc\u06ba: <code>npm run export<\/code> \u0679\u0631\u0645\u06cc\u0646\u0644 \u0645\u06cc\u06ba <code>_emails<\/code> \u0631\u0648\u0679 \u0688\u0627\u0626\u0631\u06a9\u0679\u0631\u06cc\u06d4 \u06cc\u06c1 \u06c1\u06d2 <code>templates<\/code> \u0627\u0646\u062f\u0631 \u0627\u0646\u062f\u0631 \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc <code>mailer<\/code> \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u062c\u06c1\u0627\u06ba \u0628\u0631\u0622\u0645\u062f \u0634\u062f\u06c1 HTML \u0641\u0627\u0626\u0644\u0648\u06ba \u06a9\u0648 \u0645\u062d\u0641\u0648\u0638 \u06a9\u06cc\u0627 \u062c\u0627\u062a\u0627 \u06c1\u06d2\u06d4 \u067e\u0631 <code>templates<\/code> \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u06a9\u0648 \u062f\u06cc\u06a9\u06be \u0631\u06c1\u06d2 \u06c1\u06cc\u06ba\u06d4 <code>welcome.html<\/code> \u0641\u0627\u0626\u0644 &#8211; HTML \u0622\u0624\u0679 \u067e\u0679 <code>welcome.tsx<\/code>.<\/p>\n<p>\u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u06a9\u06cc \u0645\u0648\u062c\u0648\u062f\u06c1 \u0635\u0648\u0631\u062a\u062d\u0627\u0644 \u062f\u06cc\u06a9\u06be\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2\u060c freeCodeCamp-go-react-email\/03-create-react-email-template \u0645\u0644\u0627\u062d\u0638\u06c1 \u06a9\u0631\u06cc\u06ba\u06d4<\/p>\n<h3 id=\"heading-set-up-go-templates-from-html-files\">HTML \u0641\u0627\u0626\u0644 \u0645\u06cc\u06ba \u06af\u0648 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u062a\u0631\u062a\u06cc\u0628 \u062f\u06cc\u0646\u0627<\/h3>\n<p>\u0622\u067e \u0646\u06d2 \u0627\u06cc\u06a9 HTML \u0641\u0627\u0626\u0644 \u06a9\u06d2 \u0637\u0648\u0631 \u067e\u0631 \u0627\u06cc\u06a9 React \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0628\u0646\u0627\u06cc\u0627\u060c \u067e\u06cc\u0634 \u0646\u0638\u0627\u0631\u06c1 \u06a9\u06cc\u0627\u060c \u0628\u0646\u0627\u06cc\u0627 \u0627\u0648\u0631 \u0628\u0631\u0622\u0645\u062f \u06a9\u06cc\u0627\u06d4 \u0627\u0633 \u0633\u06cc\u06a9\u0634\u0646 \u0645\u06cc\u06ba\u060c \u0622\u067e React \u06a9\u06d2 \u06af\u06be\u0646\u06af\u06be\u0631\u06cc\u0627\u0644\u06d2 \u0645\u0646\u062d\u0646\u06cc \u062e\u0637\u0648\u0637 \u0648\u062d\u062f\u0627\u0646\u06cc \u06a9\u06d2 \u0628\u062c\u0627\u0626\u06d2 \u0627\u067e\u0646\u06d2 \u0633\u06cc\u0679 \u06a9\u0631\u062f\u06c1 \u0688\u06cc\u0644\u06cc\u0645\u06cc\u0679\u0631 \u06a9\u0648 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0627\u067e\u0646\u06d2 React \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u06a9\u0648 \u0627\u067e \u0688\u06cc\u0679 \u06a9\u0631\u06cc\u06ba \u06af\u06d2\u06d4 \u06cc\u06c1 HTML \u0641\u0627\u0626\u0644\u0648\u06ba \u0633\u06d2 \u06af\u0648 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0628\u06be\u06cc \u0628\u0646\u0627\u062a\u0627 \u06c1\u06d2\u06d4<\/p>\n<p>\u0634\u0631\u0648\u0639 \u06a9\u0631\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 <code>welcome.tsx<\/code> \u0630\u06cc\u0644 \u0645\u06cc\u06ba \u06a9\u0648\u0688 \u06a9\u0627 \u0679\u06a9\u0691\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 <code>((<\/code> \u0627\u0648\u0631 <code>))<\/code> \u0627\u0633\u06d2 \u062d\u062f \u0628\u0646\u062f\u06cc \u06a9\u06d2 \u0637\u0648\u0631 \u067e\u0631 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u06cc\u06ba \u0627\u0648\u0631 TypeScript \u06a9\u06cc \u0627\u0642\u0633\u0627\u0645 \u06a9\u0648 \u06c1\u0679\u0627 \u062f\u06cc\u06ba\u06d4<\/p>\n<pre><code class=\"language-typescript\">import {\n  Body,\n  Button,\n  Container,\n  Head,\n  Heading,\n  Html,\n  Img,\n  Preview,\n  Section,\n  Tailwind,\n  Text,\n} from \"react-email\";\n\nconst WelcomeEmail = () => {\n  const previewText = `Welcome to ((.Company)), ((.Username))!`;\n\n  return (\n    \n      <\/code>\n      <preview>{previewText}<\/preview>\n      <tailwind>\n        \n          <container classname=\"mb-10 mx-auto p-5 max-w-[465px]\">\n            <section classname=\"mt-10\">\n              <img loading=\"lazy\" decoding=\"async\" src=\"{`https:\/\/storage.googleapis.com\/gopherizeme.appspot.com\/gophers\/69428e5ec867c34bb4a49d5a063fdbc2a6633aed.png`}\" width=\"80\" height=\"80\" alt=\"\u06af\u0648\u0641\u0631\" classname=\"my-0 mx-auto\" title=\"\">\n            <\/section>\n            <heading classname=\"text-2xl font-normal text-center p-0 my-8 mx-0\">\n              Welcome to <strong>((.Company))<\/strong>, ((.Username))!\n            <\/heading>\n            <text classname=\"text-start text-base\">Hello ((.Username)),<\/text>\n            <text classname=\"text-start text-base leading-relaxed\">\n              We're excited to have you onboard at <strong>((.Company))<\/strong>\n              . We hope you enjoy your journey with us. If you have any\n              questions or need assistance, feel free to reach out to any of the\n              following Gophers:\n            <\/text>\n            <div classname=\"text-start text-base leading-relaxed\">\n              <ul classname=\"pl-3\">\n                ((range .Gophers))\n                <li>((.))<\/li>\n                ((end))\n              <\/ul>\n            <\/div>\n            <section classname=\"text-center mt-[32px] mb-[32px]\">\n              <button classname=\"py-2.5 px-5 bg-white rounded-md border text-black text-base font-semibold no-underline text-center\" href=\"{`https:\/\/go.dev`}\">\n                Get Started\n              <\/button>\n            <\/section>\n\n            <text classname=\"text-start text-base\">\n              Cheers,\n              <br\/>The ((.Company)), Team\n            <\/text>\n          <\/container>\n        \n      <\/tailwind>\n    \n  );\n};\n\nexport default WelcomeEmail;\n<\/pre>\n<p>\u0686\u0644\u0627\u0626\u06cc\u06ba <code>npm run export<\/code> \u062c\u0691 \u0679\u0631\u0645\u06cc\u0646\u0644 \u0645\u06cc\u06ba <code>_emails<\/code> \u06cc\u06c1 \u0648\u06c1 \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u06c1\u06d2 \u062c\u06c1\u0627\u06ba \u06c1\u0645 React \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u06a9\u0627 \u06cc\u06c1 \u0648\u0631\u0698\u0646 \u0628\u0646\u0627\u062a\u06d2 \u06c1\u06cc\u06ba \u0627\u0648\u0631 \u0627\u0633\u06d2 HTML \u0645\u06cc\u06ba \u0627\u06cc\u06a9\u0633\u067e\u0648\u0631\u0679 \u06a9\u0631\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4 \u062a\u06cc\u0627\u0631 \u06a9\u0631\u062f\u06c1 HTML \u0645\u06cc\u06ba Go \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u06a9\u06d2 \u062a\u0628\u0635\u0631\u06d2 \u06c1\u0648\u062a\u06d2 \u06c1\u06cc\u06ba \u062c\u0646 \u067e\u0631 Go HTML \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0628\u0646\u0627\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u06af\u0648 \u06a9\u06d2 \u0630\u0631\u06cc\u0639\u06d2 \u062a\u062c\u0632\u06cc\u06c1 \u06a9\u0631\u0646\u06d2 \u067e\u0631 \u0639\u0645\u0644 \u06a9\u06cc\u0627 \u062c\u0627\u062a\u0627 \u06c1\u06d2\u06d4<\/p>\n<p>\u067e\u0631 <code>mailer<\/code> \u0627\u06cc\u06a9 \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc\u060c \u0646\u0627\u0645 \u06a9\u06cc \u0627\u06cc\u06a9 \u0641\u0627\u0626\u0644 \u0628\u0646\u0627\u062a\u0627 \u06c1\u06d2\u06d4 <code>fs.go<\/code>. \u0641\u0627\u0626\u0644 \u0645\u06cc\u06ba \u0645\u0648\u062c\u0648\u062f \u06a9\u0648\u0688 \u06a9\u0648 \u0627\u06af\u0644\u06cc \u0641\u0627\u0626\u0644 \u0645\u06cc\u06ba \u0641\u0627\u0626\u0644 \u06a9\u0648 \u0634\u0627\u0645\u0644 \u06a9\u0631\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u06cc\u0627 \u062c\u0627\u062a\u0627 \u06c1\u06d2\u06d4 <code>templates<\/code> \u06af\u0648 \u0627\u06cc\u067e\u0644\u06cc\u06a9\u06cc\u0634\u0646 \u06a9\u06d2 \u0630\u0631\u06cc\u0639\u06d2 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u06cc \u062c\u0627\u0646\u06d2 \u0648\u0627\u0644\u06cc \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc\u06d4 \u0630\u06cc\u0644 \u06a9\u06d2 \u0679\u06a9\u0691\u0648\u06ba \u06a9\u06d2 \u0645\u0648\u0627\u062f \u06a9\u0648 \u06a9\u0627\u067e\u06cc \u0627\u0648\u0631 \u067e\u06cc\u0633\u0679 \u06a9\u0631\u06cc\u06ba\u06d4 <code>fs.go<\/code>:<\/p>\n<pre><code class=\"language-go\">package mailer\n\nimport (\n\t\"embed\"\n\t\"io\/fs\"\n)\n\n\/\/go:embed templates\/*\nvar embedded embed.FS\nvar templateFS, _ = fs.Sub(embedded, \"templates\")\n<\/code><\/pre>\n<p><code>\/\/go:embed templates\/*<\/code>    \u06af\u0648 \u06a9\u0645\u067e\u0627\u0626\u0644\u0631 \u06a9\u0648 \u0645\u0648\u062c\u0648\u062f\u06c1 \u0688\u0627\u0626\u0631\u06a9\u0679\u0631\u06cc \u0633\u06d2 \u0641\u0627\u0626\u0644\u06cc\u06ba \u0634\u0627\u0645\u0644 \u06a9\u0631\u0646\u06d2 \u06a9\u06cc \u06c1\u062f\u0627\u06cc\u062a \u06a9\u0631\u062a\u0627 \u06c1\u06d2 (<code>mailer<\/code>) \u06af\u0648 \u0627\u06cc\u067e\u0644\u06cc\u06a9\u06cc\u0634\u0646 \u06a9\u06cc \u0645\u0631\u062a\u0628 \u06a9\u0631\u062f\u06c1 \u0628\u0627\u0626\u0646\u0631\u06cc \u0645\u06cc\u06ba\u06d4 \u0622\u067e \u06a9\u0648 \u0627\u067e\u0646\u06cc \u06af\u0648 \u0627\u06cc\u067e\u0644\u06cc\u06a9\u06cc\u0634\u0646 \u0633\u06d2 HTML \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0641\u0627\u0626\u0644 \u062a\u06a9 \u0631\u0633\u0627\u0626\u06cc \u06a9\u06d2 \u0644\u06cc\u06d2 \u0627\u0633 \u0645\u0639\u0644\u0648\u0645\u0627\u062a \u06a9\u06cc \u0636\u0631\u0648\u0631\u062a \u06c1\u0648\u06af\u06cc\u06d4 <code>templateFS<\/code> \u0645\u06cc\u06ba \u0641\u0627\u0626\u0644\u0648\u06ba \u062a\u06a9 \u0631\u0633\u0627\u0626\u06cc \u06a9\u06d2 \u0644\u06cc\u06d2 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u06cc\u0627 \u062c\u0627\u062a\u0627 \u06c1\u06d2\u06d4 <code>templates<\/code> \u0630\u06cc\u0644\u06cc \u0688\u0627\u0626\u0631\u06a9\u0679\u0631\u06cc\u06d4<\/p>\n<p>\u0628\u0631\u0627\u06c1 \u06a9\u0631\u0645 \u0627\u06cc\u06a9 \u0627\u0648\u0631 \u0641\u0627\u0626\u0644 \u0628\u0646\u0627\u0626\u06cc\u06ba\u06d4 <code>mailer<\/code> \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u0627\u0648\u0631 \u0646\u0627\u0645 <code>mailer.go<\/code>. <code>mailer.go<\/code> Go HTML \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0628\u0646\u0627\u0646\u06d2 \u0627\u0648\u0631 \u0627\u06cc \u0645\u06cc\u0644\u0632 \u0628\u06be\u06cc\u062c\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 HTML \u0641\u0627\u0626\u0644\u0648\u06ba \u06a9\u0648 \u067e\u0627\u0631\u0633 \u06a9\u0631\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06c1\u0648\u0646\u06d2 \u0648\u0627\u0644\u06d2 \u06a9\u0648\u0688 \u067e\u0631 \u0645\u0634\u062a\u0645\u0644 \u06c1\u06d2\u06d4 \u0630\u06cc\u0644 \u0645\u06cc\u06ba \u06a9\u0648\u0688 \u06a9\u06d2 \u0679\u06a9\u0691\u0648\u06ba \u06a9\u06d2 \u0645\u0648\u0627\u062f \u06a9\u0648 \u06a9\u0627\u067e\u06cc \u06a9\u0631\u06cc\u06ba\u06d4 <code>mailer.go<\/code>:<\/p>\n<pre><code class=\"language-go\">package mailer\n\nimport (\n\t\"html\/template\"\n\t\"io\"\n)\n\nconst (\n\twelcomeMailKey = \"welcome_mail\"\n)\n\nfunc setUpTemplates() (map[string]*template.Template, error) {\n\ttemplates := make(map[string]*template.Template)\n\n\ttmpl := template.New(\"welcome.html\").Delims(\"((\", \"))\")\n\twelcomeEmailTmpl, err := tmpl.ParseFS(templateFS, \"welcome.html\")\n\tif err != nil {\n\t\treturn nil, err\n\t}\n\n\ttemplates[welcomeMailKey] = welcomeEmailTmpl\n\n\treturn templates, nil\n}\n\ntype Mailer struct {\n\ttemplates map[string]*template.Template\n}\n\n\/\/ NewMailer creates a new mailer\nfunc NewMailer() (*Mailer, error) {\n\ttpls, err := setUpTemplates()\n\tif err != nil {\n\t\treturn nil, err\n\t}\n\n\treturn &Mailer{\n\t\ttemplates: tpls,\n\t}, nil\n}\n\ntype WelcomEmailData struct {\n\tUsername string\n\tCompany  string\n\tGophers  []string\n}\n\nfunc (mailer *Mailer) WriteWelcomeMail(w io.Writer, data WelcomEmailData) error {\n\ttmpl := mailer.templates[welcomeMailKey]\n\terr := tmpl.Execute(w, data)\n\n\treturn err\n}\n<\/code><\/pre>\n<p>\u0627\u0648\u067e\u0631 \u06a9\u0648\u0688 \u06a9\u06d2 \u0679\u06a9\u0691\u0648\u06ba \u0645\u06cc\u06ba:<\/p>\n<ul>\n<li>\n<p><code>setUpTemplates<\/code>    \u0627\u06cc\u06a9 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0622\u0628\u062c\u06cc\u06a9\u0679 \u0628\u0646\u0627\u0626\u06cc\u06ba\u060c <code>tmpl<\/code>\u0627\u0644\u06af \u06a9\u0631\u0646\u06d2 \u0648\u0627\u0644\u0627 \u0633\u06cc\u0679 \u06a9\u0631\u06cc\u06ba\u06d4 <code>tmpl<\/code> \u062a\u0639\u0628\u06cc\u0631 \u06a9\u0631\u0646\u0627 <code>welcome.html<\/code> \u0627\u0633\u06d2 \u06af\u0648 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0645\u06cc\u06ba \u062a\u0628\u062f\u06cc\u0644 \u06a9\u0631\u06cc\u06ba \u0627\u0648\u0631 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u06a9\u0648 \u0627\u0633 \u0637\u0631\u062d \u0645\u062d\u0641\u0648\u0638 \u06a9\u0631\u06cc\u06ba: <code>welcomeEmailTmpl<\/code> \u0634\u0646\u0627\u062e\u062a \u06a9\u0646\u0646\u062f\u06c1 \u06a9\u06d2 \u0637\u0648\u0631 \u067e\u0631 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u06cc\u0627 \u062c\u0627\u062a\u0627 \u06c1\u06d2\u06d4 \u062c\u0628 \u0633\u06d2\u060c <code>welcomeEmailTmpl<\/code> \u0645\u06cc\u06ba \u0634\u0627\u0645\u0644 \u06a9\u06cc\u0627 \u062c\u0627\u0626\u06d2 \u06af\u0627\u06d4 <code>templates<\/code> \u0646\u0642\u0634\u06c1 <code>welcomeMailKey<\/code> \u0627\u0633 \u0686\u0627\u0628\u06cc \u06a9\u06d2 \u0633\u0627\u062a\u06be <code>templates<\/code> \u0648\u0627\u067e\u0633 \u06a9\u0631 \u062f\u06cc\u0627 \u062c\u0627\u062a\u0627 \u06c1\u06d2.<\/p>\n<\/li>\n<li>\n<p><code>NewMailer<\/code>    \u0628\u0646\u0627\u0626\u06cc\u06ba \u0627\u0648\u0631 \u0648\u0627\u067e\u0633 \u06a9\u0631\u06cc\u06ba\u06d4 <code>Mailer<\/code> \u0627\u06cc\u06a9 \u0627\u06cc\u0633\u06cc \u0686\u06cc\u0632 \u062c\u0633 \u0645\u06cc\u06ba \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u06a9\u06d2 \u0646\u0642\u0634\u06d2 \u0627\u0648\u0631 \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u06a9\u06d2 \u0633\u0627\u062a\u06be \u06a9\u0627\u0645 \u06a9\u0631\u0646\u06d2 \u06a9\u06d2 \u0637\u0631\u06cc\u0642\u06d2 \u06c1\u0648\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4<\/p>\n<\/li>\n<li>\n<p>WriteWelcomeMail \u0627\u0633 \u0637\u0631\u062d \u06a9\u0627 \u0637\u0631\u06cc\u0642\u06c1 \u06c1\u06d2: <code>Mailer<\/code> \u06cc\u06c1 \u0627\u0635\u0644 \u0688\u06cc\u0679\u0627 \u06a9\u06d2 \u0633\u0627\u062a\u06be \u0648\u06cc\u0644\u06a9\u0645 \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u06a9\u0648 \u0686\u0644\u0627\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06c1\u0648\u062a\u0627 \u06c1\u06d2\u06d4<\/p>\n<\/li>\n<\/ul>\n<p>\u0645\u0648\u062c\u0648\u062f\u06c1 \u06a9\u0648\u0688\u0628\u06cc\u0633 \u06a9\u06cc \u0645\u0648\u062c\u0648\u062f\u06c1 \u062d\u0627\u0644\u062a \u062f\u06cc\u06a9\u06be\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2\u060c freeCodeCamp-go-react-email\/04-create-golang-template \u0645\u0644\u0627\u062d\u0638\u06c1 \u06a9\u0631\u06cc\u06ba\u06d4<\/p>\n<h3 id=\"heading-render-the-dynamic-email-in-the-browser\">\u0628\u0631\u0627\u0624\u0632\u0631 \u0645\u06cc\u06ba \u0645\u062a\u062d\u0631\u06a9 \u0627\u06cc \u0645\u06cc\u0644 \u0631\u06cc\u0646\u0688\u0631\u0646\u06af<\/h3>\n<p>\u0627\u0633 \u0633\u06cc\u06a9\u0634\u0646 \u0645\u06cc\u06ba\u060c \u06c1\u0645 \u0627\u06cc\u06a9 \u0633\u0627\u062f\u06c1 \u0648\u06cc\u0628 \u0633\u0631\u0648\u0631 \u0628\u0646\u0627\u0626\u06cc\u06ba \u06af\u06d2 \u062a\u0627\u06a9\u06c1 \u0627\u06cc\u06a9 \u067e\u06cc\u0634 \u06a9\u0631\u062f\u06c1 \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u06a9\u0648 \u062f\u06cc\u06a9\u06be\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0645\u062a\u062d\u0631\u06a9 \u0627\u0642\u062f\u0627\u0631 \u06a9\u06d2 \u0633\u0627\u062a\u06be \u0627\u0633 \u067e\u0631 \u0645\u0646\u062a\u0642\u0644 \u06a9\u06cc\u0627 \u062c\u0627\u0626\u06d2\u06d4<\/p>\n<p>\u062f\u0631\u062c \u0630\u06cc\u0644 \u06a9\u0648 \u062a\u0628\u062f\u06cc\u0644 \u06a9\u0631\u06cc\u06ba: <code>main.go<\/code> \u0630\u06cc\u0644 \u0645\u06cc\u06ba \u06a9\u0648\u0688 \u06a9\u0627 \u0679\u06a9\u0691\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2:<\/p>\n<pre><code class=\"language-go\">package main\n\nimport (\n\t\"fmt\"\n\t\"net\/http\"\n\t\"os\"\n\n\tpkgMailer \"github.com\/orimdominic\/freeCodeCamp-go-react-email\/mailer\"\n)\n\nfunc main() {\n\tmailer, err := pkgMailer.NewMailer()\n\tif err != nil {\n\t\tfmt.Fprint(os.Stderr, err)\n\t\tos.Exit(1)\n\t}\n\n\thttp.HandleFunc(\"\/mail\", func(w http.ResponseWriter, r *http.Request) {\n\t\tusername := r.URL.Query().Get(\"username\")\n\t\tcompany := r.URL.Query().Get(\"company\")\n\t\tgophers := []string{\"Tinky Winky\", \"Dipsy\", \"Laa-Laa\", \"Po\"}\n\n\t\terr := mailer.WriteWelcomeMail(w, pkgMailer.WelcomEmailData{\n\t\t\tUsername: username,\n\t\t\tCompany:  company,\n\t\t\tGophers:  gophers,\n\t\t})\n\t\tif err != nil {\n\t\t\thttp.Error(w, err.Error(), http.StatusInternalServerError)\n\t\t\treturn\n\t\t}\n\t})\n\n\tport := \":8888\"\n\terr = http.ListenAndServe(port, nil)\n\tif err != nil {\n\t\tfmt.Fprint(os.Stderr, err)\n\t\tos.Exit(1)\n\t}\n}\n<\/code><\/pre>\n<p>\u0627\u0648\u067e\u0631 \u06a9\u0648\u0688 \u06a9\u0627 \u0679\u06a9\u0691\u0627 \u067e\u06c1\u0644\u06d2 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u0645\u06cc\u0644\u0631 \u0622\u0628\u062c\u06cc\u06a9\u0679 \u0628\u0646\u0627\u062a\u0627 \u06c1\u06d2: <code>NewMailer<\/code> \u0641\u0646\u06a9\u0634\u0646 <code>mailer.go<\/code>. \u0627\u06cc\u06a9 \u0633\u0627\u062f\u06c1 \u0648\u06cc\u0628 \u0633\u0631\u0648\u0631 \u0628\u0646\u0627\u062a\u0627 \u06c1\u06d2 \u062c\u0648 \u063a\u0644\u0637\u06cc \u0633\u06d2 \u0646\u0645\u0679\u0646\u06d2 \u06a9\u06d2 \u0628\u0639\u062f \u067e\u0648\u0631\u0679 \u067e\u0631 \u0686\u0644\u062a\u0627 \u06c1\u06d2\u06d4 <code>8888<\/code> \u0627\u0648\u0631 <code>GET \/mail<\/code> \u0631\u0627\u0633\u062a\u06c1<\/p>\n<p>\u06a9\u06c1 <code>GET \/mail<\/code> \u0631\u0627\u0633\u062a\u06c1 \u062f\u0648 \u0627\u0633\u062a\u0641\u0633\u0627\u0631 \u067e\u06cc\u0631\u0627\u0645\u06cc\u0679\u0631\u0632 \u06a9\u0648 \u0642\u0628\u0648\u0644 \u06a9\u0631\u062a\u0627 \u06c1\u06d2: <code>username<\/code> \u0627\u0648\u0631 <code>company<\/code>\u06cc\u06c1 \u0627\u06cc \u0645\u06cc\u0644\u0632 \u0645\u06cc\u06ba \u0645\u062a\u062d\u0631\u06a9 \u0688\u06cc\u0679\u0627 \u06a9\u06d2 \u0637\u0648\u0631 \u067e\u0631 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06c1\u0648\u062a\u0627 \u06c1\u06d2\u06d4 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0686\u0644\u0627\u0646\u06d2 \u06a9\u06d2 \u0646\u062a\u0627\u0626\u062c <code>WriteWelcomeMail<\/code> \u06cc\u06c1 \u0628\u0631\u0627\u0624\u0632\u0631 \u06a9\u0648 HTML \u062c\u0648\u0627\u0628 \u06a9\u06d2 \u0637\u0648\u0631 \u067e\u0631 \u0644\u06a9\u06be\u0627 \u062c\u0627\u062a\u0627 \u06c1\u06d2\u06d4 \u0627\u0633 \u0631\u0627\u0633\u062a\u06d2 \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 <code>mailer<\/code> \u067e\u06cc\u06a9\u062c<\/p>\n<p>\u0633\u0631\u0648\u0631 \u0634\u0631\u0648\u0639 \u06a9\u0631\u0646\u06d2 \u0633\u06d2 \u067e\u06c1\u0644\u06d2\u060c \u0622\u067e \u06a9\u0648 \u0627\u067e\u0646\u06d2 React \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0628\u0646\u0627\u0646\u06d2 \u0627\u0648\u0631 \u0628\u0631\u0622\u0645\u062f \u06a9\u0631\u0646\u06d2 \u06a9\u06cc \u0636\u0631\u0648\u0631\u062a \u06c1\u06d2 \u062a\u0627\u06a9\u06c1 \u0622\u067e \u06a9\u06cc HTML \u0641\u0627\u0626\u0644\u0648\u06ba \u0645\u06cc\u06ba \u06c1\u0645\u06cc\u0634\u06c1 \u0622\u067e \u06a9\u06d2 React \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0645\u06cc\u06ba \u062a\u0627\u0632\u06c1 \u062a\u0631\u06cc\u0646 \u062a\u0628\u062f\u06cc\u0644\u06cc\u0627\u06ba \u0645\u0648\u062c\u0648\u062f \u06c1\u0648\u06ba\u06d4 \u0627\u067e\u0646\u06d2 \u0633\u0631\u0648\u0631 \u06a9\u0648 \u0628\u0646\u0627\u0646\u06d2\u060c \u0628\u0631\u0622\u0645\u062f \u06a9\u0631\u0646\u06d2 \u0627\u0648\u0631 \u0686\u0644\u0627\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0645\u062a\u0639\u062f\u062f \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc\u0648\u06ba \u06a9\u06d2 \u062f\u0631\u0645\u06cc\u0627\u0646 \u0645\u0646\u062a\u0642\u0644 \u06c1\u0648\u0646\u06d2 \u06a9\u06d2 \u0628\u062c\u0627\u0626\u06d2\u060c \u0622\u067e \u0645\u06cc\u06a9 \u0641\u0627\u0626\u0644 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631 \u0633\u06a9\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4<\/p>\n<p>\u0627\u067e\u0646\u06d2 \u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u0631\u0648\u0679 \u0688\u0627\u0626\u0631\u06a9\u0679\u0631\u06cc \u0645\u06cc\u06ba \u0679\u0631\u0645\u06cc\u0646\u0644 \u067e\u0631 \u062c\u0627\u0626\u06cc\u06ba \u0627\u0648\u0631 \u0627\u0633 \u0637\u0631\u062d \u06a9\u06cc \u0641\u0627\u0626\u0644 \u0628\u0646\u0627\u0626\u06cc\u06ba: <code>Makefile<\/code>. \u0630\u06cc\u0644 \u0645\u06cc\u06ba \u06a9\u0648\u0688 \u06a9\u06d2 \u0679\u06a9\u0691\u0648\u06ba \u06a9\u06d2 \u0645\u0648\u0627\u062f \u06a9\u0648 \u06a9\u0627\u067e\u06cc \u0627\u0648\u0631 \u067e\u06cc\u0633\u0679 \u06a9\u0631\u06cc\u06ba\u06d4<\/p>\n<pre><code class=\"language-plaintext\">run: email-build\n\tgo run cmd\/main.go\n\nemail-build: mailer\/_emails\n\tnpm --prefix mailer\/_emails run export\n<\/code><\/pre>\n<p>\u06a9\u06c1 <code>run<\/code> \u0627\u0648\u067e\u0631 \u062f\u06cc \u06af\u0626\u06cc \u0645\u06cc\u06a9 \u0641\u0627\u0626\u0644 \u0627\u0633\u06a9\u0631\u067e\u0679 HTML \u0645\u06cc\u06ba \u0627\u06cc\u06a9 React \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u0628\u0646\u0627\u062a\u06cc \u0627\u0648\u0631 \u0628\u0631\u0622\u0645\u062f \u06a9\u0631\u062a\u06cc \u06c1\u06d2\u06d4 <code>mailer\/templates<\/code> \u0688\u0627\u0626\u0631\u06cc\u06a9\u0679\u0631\u06cc \u0645\u0646\u062a\u062e\u0628 \u06a9\u0631\u06cc\u06ba \u0627\u0648\u0631 \u067e\u06be\u0631 \u06af\u0648 \u0627\u06cc\u067e\u0644\u06cc\u06a9\u06cc\u0634\u0646 \u0634\u0631\u0648\u0639 \u06a9\u0631\u06cc\u06ba\u06d4 \u062f\u0631\u062c \u0630\u06cc\u0644 \u06a9\u0648 \u0686\u06cc\u06a9 \u06a9\u0631\u06cc\u06ba: <code>Makefile<\/code> \u0627\u0646\u0688\u06cc\u0646\u0679\u06cc\u0634\u0646 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0633\u062e\u062a \u0679\u06cc\u0628\u0632 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u06cc\u06ba\u060c \u062e\u0627\u0644\u06cc \u062c\u06af\u06c1 \u0646\u06c1\u06cc\u06ba\u06d4<\/p>\n<p>\u0686\u0644\u0627\u0626\u06cc\u06ba <code>make run<\/code> \u0627\u067e\u0646\u06d2 \u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u06a9\u06cc \u0631\u0648\u0679 \u0688\u0627\u0626\u0631\u06a9\u0679\u0631\u06cc \u06a9\u06d2 \u0679\u0631\u0645\u06cc\u0646\u0644 \u0645\u06cc\u06ba\u060c \u0645\u0644\u0627\u062d\u0638\u06c1 \u06a9\u0631\u06cc\u06ba: <code>http:\/\/localhost:8888\/mail?username=Nicole&company=GoWorld<\/code> \u0622\u067e \u06a9\u06d2 \u0628\u0631\u0627\u0624\u0632\u0631 \u0645\u06cc\u06ba\u06d4 \u0622\u067e \u0627\u067e\u0646\u06d2 \u0628\u0631\u0627\u0624\u0632\u0631 UI \u0645\u06cc\u06ba \u0627\u067e\u0646\u0627 \u0627\u06cc \u0645\u06cc\u0644 \u067e\u06cc\u0634 \u06a9\u0631\u062f\u06c1 \u062f\u06cc\u06a9\u06be\u06cc\u06ba \u06af\u06d2\u06d4<\/p>\n<p><img alt=\"\u0628\u0631\u0627\u0624\u0632\u0631 \u0645\u06cc\u06ba \u0686\u0644\u0646\u06d2 \u0648\u0627\u0644\u06d2 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u06a9\u0648 \u062f\u06cc\u06a9\u06be\u06cc\u06ba\" style=\"display:block;margin:0 auto\" width=\"600\" height=\"400\" loading=\"lazy\"\/><\/p>\n<p>\u0642\u062f\u0631 \u06a9\u0648 \u062a\u0628\u062f\u06cc\u0644 \u06a9\u0631\u06cc\u06ba\u06d4 <code>username<\/code> \u0627\u0648\u0631 <code>company<\/code> URL \u0645\u06cc\u06ba \u0645\u062e\u062a\u0644\u0641 \u0627\u0642\u062f\u0627\u0631 \u06a9\u06d2 \u0633\u0627\u062a\u06be \u0627\u067e\u0646\u06d2 \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u06cc \u062c\u0627\u0646\u0686 \u06a9\u0631\u06cc\u06ba\u06d4<\/p>\n<p>\u06cc\u06c1 \u062a\u0631\u062a\u06cc\u0628 \u0622\u067e \u06a9\u0648 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u06a9\u06d2 \u0639\u0645\u0644 \u06a9\u06d2 \u0646\u062a\u0627\u0626\u062c \u06a9\u0648 \u0627\u067e\u0646\u06d2 \u0645\u06cc\u0644 \u06a9\u0644\u0627\u0626\u0646\u0679 \u06a9\u06d2 \u0633\u0627\u062a\u06be \u0645\u0631\u0628\u0648\u0637 \u06a9\u0631\u0646\u06d2 \u06a9\u06cc \u0627\u062c\u0627\u0632\u062a \u062f\u06cc\u062a\u06cc \u06c1\u06d2 \u0627\u0648\u0631 \u0627\u06cc \u0645\u06cc\u0644 \u0648\u0635\u0648\u0644 \u06a9\u0646\u0646\u062f\u06af\u0627\u0646 \u06a9\u0648 \u0627\u0646 \u06a9\u06d2 \u0628\u0631\u0627\u0624\u0632\u0631 \u0645\u06cc\u06ba \u062f\u06a9\u06be\u0627\u0626\u06cc \u062c\u0627\u0646\u06d2 \u0648\u0627\u0644\u06cc \u0627\u06cc \u0645\u06cc\u0644 \u062f\u06cc\u06a9\u06be\u0646\u06d2 \u06a9\u06cc \u0627\u062c\u0627\u0632\u062a \u062f\u06cc\u062a\u06cc \u06c1\u06d2\u06d4<\/p>\n<p>\u0645\u0648\u062c\u0648\u062f\u06c1 \u06a9\u0648\u0688\u0628\u06cc\u0633 \u06a9\u06cc \u0645\u0648\u062c\u0648\u062f\u06c1 \u062d\u0627\u0644\u062a \u062f\u06cc\u06a9\u06be\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2\u060c freeCodeCamp-go-react-email\/05-render-dynamic-email \u0645\u0644\u0627\u062d\u0638\u06c1 \u06a9\u0631\u06cc\u06ba\u06d4<\/p>\n<h3 id=\"heading-send-and-test-email-with-go-mail-and-mailhog\">\u06af\u0648 \u0645\u06cc\u0644 \u0627\u0648\u0631 \u0645\u06cc\u0644 \u06c1\u0627\u06af \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u0627\u06cc \u0645\u06cc\u0644 \u0628\u06be\u06cc\u062c\u0646\u0627 \u0627\u0648\u0631 \u062c\u0627\u0646\u0686\u0646\u0627<\/h3>\n<p>\u067e\u0686\u06be\u0644\u06d2 \u062d\u0635\u06d2 \u0645\u06cc\u06ba \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u06a9\u0648 \u0686\u0644\u0627\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0688\u06cc\u0679\u0627 \u0641\u0631\u0627\u06c1\u0645 \u06a9\u06cc\u0627 \u06af\u06cc\u0627 \u062a\u06be\u0627\u060c \u0644\u06cc\u06a9\u0646 \u06cc\u06c1 \u0628\u0631\u0627\u0624\u0632\u0631 \u0645\u06cc\u06ba \u067e\u06cc\u0634 \u06a9\u06cc\u0627 \u06af\u06cc\u0627 \u062a\u06be\u0627\u060c \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u0644\u0627\u0626\u0646\u0679 \u0645\u06cc\u06ba \u0646\u06c1\u06cc\u06ba\u06d4 \u0627\u0633 \u0633\u06cc\u06a9\u0634\u0646 \u0645\u06cc\u06ba \u06c1\u0645 \u0627\u06cc \u0645\u06cc\u0644\u0632 \u0628\u06be\u06cc\u062c\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u06af\u0648 \u0645\u06cc\u0644 \u0627\u0648\u0631 \u0627\u0646 \u06a9\u0648 \u0631\u0648\u06a9\u0646\u06d2 \u0627\u0648\u0631 \u062f\u06cc\u06a9\u06be\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0645\u06cc\u0644 \u06c1\u0627\u06af \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u06cc\u06ba \u06af\u06d2\u06d4<\/p>\n<p>\u06cc\u06c1 \u0633\u06cc\u06a9\u0634\u0646 \u0627\u062e\u062a\u06cc\u0627\u0631\u06cc \u06c1\u06d2\u06d4 \u0627\u06af\u0631 \u0645\u06cc\u0644 \u06c1\u0627\u06af \u0645\u0642\u0627\u0645\u06cc \u0637\u0648\u0631 \u067e\u0631 \u0627\u0646\u0633\u0679\u0627\u0644 \u0646\u06c1\u06cc\u06ba \u06c1\u06d2\u060c \u062a\u0648 \u0622\u067e \u06a9\u0648 \u0627\u0633 \u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0627\u0633\u06d2 \u062a\u0631\u062a\u06cc\u0628 \u062f\u06cc\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0688\u0648\u06a9\u0631 \u06a9\u0645\u067e\u0648\u0632 \u06a9\u06cc \u0636\u0631\u0648\u0631\u062a \u06c1\u0648\u06af\u06cc\u06d4 \u062c\u0627\u0631\u06cc \u0631\u06a9\u06be\u0646\u06d2 \u0633\u06d2 \u067e\u06c1\u0644\u06d2\u060c \u06cc\u0642\u06cc\u0646\u06cc \u0628\u0646\u0627\u0626\u06cc\u06ba \u06a9\u06c1 \u0622\u067e \u06a9\u06d2 \u06a9\u0645\u067e\u06cc\u0648\u0679\u0631 \u067e\u0631 Docker Compose \u0627\u0646\u0633\u0679\u0627\u0644 \u06c1\u06d2\u06d4<\/p>\n<p>\u0679\u0631\u0645\u06cc\u0646\u0644 \u0645\u06cc\u06ba\u060c \u0627\u067e\u0646\u06d2 \u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u06a9\u06cc \u0631\u0648\u0679 \u0688\u0627\u0626\u0631\u06a9\u0679\u0631\u06cc \u067e\u0631 \u062c\u0627\u0626\u06cc\u06ba \u0627\u0648\u0631 \u0686\u0644\u0627\u0626\u06cc\u06ba: <code>go get github.com\/wneessen\/go-mail<\/code> Gomail \u0627\u0646\u0633\u0679\u0627\u0644 \u06a9\u0631\u06cc\u06ba\u06d4 \u0628\u0646\u0627\u0646\u0627 <code>compose.yml<\/code> \u0641\u0627\u0626\u0644 \u06a9\u0648 \u0627\u067e\u0646\u06d2 \u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u06a9\u06cc \u0631\u0648\u0679 \u0688\u0627\u0626\u0631\u06a9\u0679\u0631\u06cc \u0645\u06cc\u06ba \u06a9\u0627\u067e\u06cc \u06a9\u0631\u06cc\u06ba \u0627\u0648\u0631 \u0646\u06cc\u0686\u06d2 \u06a9\u0648\u0688 \u06a9\u06d2 \u0679\u06a9\u0691\u0648\u06ba \u06a9\u06d2 \u0645\u0648\u0627\u062f \u06a9\u0648 \u067e\u06cc\u0633\u0679 \u06a9\u0631\u06cc\u06ba\u06d4<\/p>\n<pre><code class=\"language-yaml\">services:\n  mailhog:\n    image: mailhog\/mailhog\n    restart: no\n    logging:\n      driver: \"none\" # disable saving logs\n    ports:\n      - 1025:1025 # smtp server\n      - 8025:8025 # web ui\n<\/code><\/pre>\n<p>\u0679\u0631\u0645\u06cc\u0646\u0644 \u0645\u06cc\u06ba\u060c \u0627\u067e\u0646\u06d2 \u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u06a9\u06cc \u0631\u0648\u0679 \u0688\u0627\u0626\u0631\u06a9\u0679\u0631\u06cc \u067e\u0631 \u062c\u0627\u0626\u06cc\u06ba \u0627\u0648\u0631 \u0686\u0644\u0627\u0626\u06cc\u06ba: <code>docker compose up<\/code> \u0645\u06cc\u0644 \u06c1\u0627\u06af SMTP \u0633\u0631\u0648\u0631 \u06a9\u0648 \u06af\u06be\u0633\u06cc\u0679\u06cc\u06ba \u0627\u0648\u0631 \u0634\u0631\u0648\u0639 \u06a9\u0631\u06cc\u06ba\u06d4 \u0645\u06cc\u0644 \u06c1\u0627\u06af \u0628\u0646\u062f\u0631\u06af\u0627\u06c1 \u067e\u0631 \u0627\u06cc \u0645\u06cc\u0644\u0632 \u0633\u0646\u062a\u0627 \u06c1\u06d2\u06d4 <code>1025<\/code> \u0648\u06cc\u0628 UI \u06a9\u0648 \u0628\u06d2 \u0646\u0642\u0627\u0628 \u06a9\u0631\u06cc\u06ba\u06d4 <code>http:\/\/localhost:8025<\/code> \u06cc\u06c1 \u0648\u06c1 \u062c\u06af\u06c1 \u06c1\u06d2 \u062c\u06c1\u0627\u06ba \u0622\u067e \u0645\u0633\u062f\u0648\u062f \u0627\u06cc \u0645\u06cc\u0644\u0632 \u062f\u06cc\u06a9\u06be \u0633\u06a9\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4 \u0622\u067e \u06a9\u06d2 \u0627\u0646\u0679\u0631\u0646\u06cc\u0679 \u06a9\u0646\u06a9\u0634\u0646 \u067e\u0631 \u0645\u0646\u062d\u0635\u0631 \u06c1\u06d2\u060c \u0627\u0628\u062a\u062f\u0627\u0626\u06cc \u062a\u0635\u0648\u06cc\u0631 \u06a9\u06cc \u062f\u0631\u0622\u0645\u062f \u0645\u06cc\u06ba \u06a9\u0626\u06cc \u0645\u0646\u0679 \u0644\u06af \u0633\u06a9\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4<\/p>\n<p>\u062a\u0628\u062f\u06cc\u0644\u06cc <code>mailer.go<\/code> \u0630\u06cc\u0644 \u0645\u06cc\u06ba \u06a9\u0648\u0688 \u06a9\u06d2 \u0679\u06a9\u0691\u0648\u06ba \u06a9\u0627 \u0645\u0648\u0627\u062f \u0645\u0646\u062f\u0631\u062c\u06c1 \u0630\u06cc\u0644 \u06c1\u06d2:<\/p>\n<pre><code class=\"language-go\">package mailer\n\nimport (\n\t\"html\/template\"\n\t\"io\"\n\n\t\"github.com\/wneessen\/go-mail\"\n)\n\nconst (\n\twelcomeMailKey = \"welcome_mail\"\n    sender = \"noreply@localhost.com\"\n)\n\nfunc setUpTemplates() (map[string]*template.Template, error) {\n\ttemplates := make(map[string]*template.Template)\n\n\ttmpl := template.New(\"welcome.html\").Delims(\"((\", \"))\")\n\twelcomeEmailTmpl, err := tmpl.ParseFS(templateFS, \"welcome.html\")\n\tif err != nil {\n\t\treturn nil, err\n\t}\n\n\ttemplates[welcomeMailKey] = welcomeEmailTmpl\n\n\treturn templates, nil\n}\n\ntype Mailer struct {\n\tclient    *mail.Client\n\ttemplates map[string]*template.Template\n}\n\n\/\/ NewMailer creates a new mailer\nfunc NewMailer() (*Mailer, error) {\n\ttpls, err := setUpTemplates()\n\tif err != nil {\n\t\treturn nil, err\n\t}\n\n\tc, err := mail.NewClient(\n\t\t\"localhost\",\n\t\tmail.WithPort(1025),\n\t\tmail.WithTLSPolicy(mail.NoTLS),\n\t)\n\n\tif err != nil {\n\t\treturn nil, err\n\t}\n\n\treturn &Mailer{\n\t\tclient:    c,\n\t\ttemplates: tpls,\n\t}, nil\n}\n\ntype WelcomEmailData struct {\n\tUsername string\n\tCompany  string\n\tGophers  []string\n}\n\nfunc (mailer *Mailer) WriteWelcomeMail(w io.Writer, data WelcomEmailData) error {\n\ttmpl := mailer.templates[welcomeMailKey]\n\terr := tmpl.Execute(w, data)\n\n\treturn err\n}\n\nfunc (mailer *Mailer) SendWelcomeMail(to string, data WelcomEmailData) error {\n\tm := mail.NewMsg()\n\tm.From(sender)\n\tm.To(to)\n\tm.Subject(\"Welcome to \" + data.Company)\n\tm.SetBodyHTMLTemplate(mailer.templates[welcomeMailKey], data)\n\n\terr := mailer.client.DialAndSend(m)\n\treturn err\n}\n<\/code><\/pre>\n<p>\u0646\u0626\u06cc \u062a\u0628\u062f\u06cc\u0644\u06cc\u0648\u06ba \u0645\u06cc\u06ba \u0634\u0627\u0645\u0644 \u06c1\u06cc\u06ba: <code>mailer.go<\/code> \u0634\u0627\u0645\u0644 \u06c1\u06cc\u06ba:<\/p>\n<ul>\n<li>\n<p>\u06af\u0648 \u0645\u06cc\u0644 \u0622\u0645\u062f\u0646\u06cc<\/p>\n<\/li>\n<li>\n<p>\u06a9\u06cc \u062a\u062e\u0644\u06cc\u0642 <code>sender<\/code> \u0628\u06be\u06cc\u062c\u0646\u06d2 \u0648\u0627\u0644\u06d2 \u06a9\u06d2 \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u06cc \u0645\u0633\u062a\u0642\u0644 \u0646\u0645\u0627\u0626\u0646\u062f\u06af\u06cc \u06a9\u0631\u062a\u0627 \u06c1\u06d2\u06d4<\/p>\n<\/li>\n<li>\n<p>\u06af\u0648 \u0645\u06cc\u0644 \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u0645\u06cc\u0644 \u06a9\u0644\u0627\u0626\u0646\u0679 \u0628\u0646\u0627\u0646\u0627<\/p>\n<\/li>\n<li>\n<p>\u06a9\u06cc \u062a\u062e\u0644\u06cc\u0642 <code>SendWelcomeMail<\/code> \u06a9\u06cc\u0633\u06d2\u061f <code>mailer<\/code> \u0688\u06be\u0627\u0646\u0686\u06c1 \u062c\u0648 \u0627\u06cc \u0645\u06cc\u0644 \u0628\u0646\u0627\u062a\u0627 \u06c1\u06d2\u06d4 <code>welcomeEmailTmpl<\/code>\u0627\u0633\u06d2 \u0686\u0644\u0627\u0626\u06cc\u06ba \u0627\u0648\u0631 \u0648\u0635\u0648\u0644 \u06a9\u0646\u0646\u062f\u06c1 \u06a9\u0648 \u0628\u06be\u06cc\u062c\u06cc\u06ba\u06d4<\/p>\n<\/li>\n<\/ul>\n<p>\u0645\u06cc\u06ba <code>main.go<\/code>\u0627\u067e \u0688\u06cc\u0679 <code>GET \/mail<\/code> \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u0646\u06d2 \u06a9\u0627 \u0631\u0627\u0633\u062a\u06c1 <code>SendWelcomeMail<\/code> \u0627\u0633 \u06a9\u06d2 \u0628\u062c\u0627\u0626\u06d2 <code>WriteWelcomeMail<\/code>. \u0622\u067e \u0627\u067e\u0646\u06cc \u0645\u0631\u0636\u06cc \u06a9\u06d2 \u0645\u0637\u0627\u0628\u0642 \u06a9\u0648\u0626\u06cc \u0628\u06be\u06cc \u0627\u06cc \u0645\u06cc\u0644 \u0627\u06cc\u0688\u0631\u06cc\u0633 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631 \u0633\u06a9\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4 \u0630\u06cc\u0644 \u06a9\u0627 \u0679\u06a9\u0691\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u0627 \u06c1\u06d2: <code>fcc@go.dev<\/code>:<\/p>\n<pre><code class=\"language-go\">\t\terr := mailer.SendWelcomeMail(\"fcc@go.dev\", pkgMailer.WelcomEmailData{\n\t\t\tUsername: username,\n\t\t\tCompany:  company,\n\t\t\tGophers:  gophers,\n\t\t})\n\t\tif err != nil {\n\t\t\thttp.Error(w, err.Error(), http.StatusInternalServerError)\n\t\t\treturn\n\t\t}\n\n\t\tfmt.Fprint(w, \"Email sent\")\n<\/code><\/pre>\n<p>\u0627\u067e\u0646\u06d2 \u0648\u06cc\u0628 \u0628\u0631\u0627\u0624\u0632\u0631 \u0645\u06cc\u06ba http:\/\/localhost:8025 \u067e\u0631 \u062c\u0627 \u06a9\u0631 \u062a\u0635\u062f\u06cc\u0642 \u06a9\u0631\u06cc\u06ba \u06a9\u06c1 \u0622\u067e \u06a9\u0627 \u0645\u06cc\u0644 \u0633\u0631\u0648\u0631 \u0686\u0644 \u0631\u06c1\u0627 \u06c1\u06d2\u06d4 \u062f\u0648\u0633\u0631\u06d2 \u0679\u0631\u0645\u06cc\u0646\u0644 \u0645\u06cc\u06ba \u067e\u0631\u0648\u062c\u06cc\u06a9\u0679 \u0631\u0648\u0679 \u0688\u0627\u0626\u0631\u06a9\u0679\u0631\u06cc \u0633\u06d2 \u0686\u0644\u0627\u0626\u06cc\u06ba: <code>make run<\/code> \u0633\u0631\u0648\u0631 \u0634\u0631\u0648\u0639 \u06a9\u0631\u06cc\u06ba\u06d4 \u062a\u0634\u0631\u06cc\u0641 \u0644\u0627\u0626\u06cc\u06ba \u0627\u0648\u0631 \u0627\u067e\u0646\u06d2 \u0631\u0627\u0633\u062a\u06d2 \u06a9\u06cc \u0641\u0639\u0627\u0644\u06cc\u062a \u06a9\u06cc \u062c\u0627\u0646\u0686 \u06a9\u0631\u06cc\u06ba\u06d4 <code>http:\/\/localhost:8888\/mail?username=Nicole&company=GoWorld<\/code> \u0627\u06cc\u06a9 \u0628\u0627\u0631 \u067e\u06be\u0631\u06d4 \u0627\u0633 \u06a9\u06d2 \u0628\u0639\u062f\u060c http:\/\/localhost:8025 \u067e\u0631 \u062c\u0627 \u06a9\u0631 \u0627\u067e\u0646\u0627 \u0627\u06cc \u0645\u06cc\u0644 \u0633\u0631\u0648\u0631 \u0686\u06cc\u06a9 \u06a9\u0631\u06cc\u06ba\u06d4 \u0622\u067e \u0646\u06cc\u0686\u06d2 \u0627\u0633\u06a9\u0631\u06cc\u0646 \u0634\u0627\u0679 \u06a9\u06cc \u0637\u0631\u062d \u0627\u06cc\u06a9 UI \u062f\u06cc\u06a9\u06be\u06cc\u06ba \u06af\u06d2\u06d4<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/umang.pk\/wp-content\/uploads\/2026\/04\/1776743505_974_React-\u0627\u06cc-\u0645\u06cc\u0644-\u06a9\u0627-\u0627\u0633\u062a\u0639\u0645\u0627\u0644-\u06a9\u0631\u062a\u06d2-\u06c1\u0648\u0626\u06d2-Go-\u0645\u06cc\u06ba-\u0645\u062a\u062d\u0631\u06a9.png\" alt=\"\u0645\u06cc\u0644 \u067e\u06cc\u0634 \u0646\u0638\u0627\u0631\u06c1 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0645\u06cc\u0644 \u06c1\u0627\u06af UI\" style=\"display:block;margin:0 auto\" width=\"600\" height=\"400\" loading=\"lazy\" title=\"\"><\/p>\n<p>\u0627\u067e\u0646\u0627 \u0627\u06cc \u0645\u06cc\u0644 \u062f\u06cc\u06a9\u06be\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 &quot;Helix \u0645\u06cc\u06ba \u062e\u0648\u0634 \u0622\u0645\u062f\u06cc\u062f&#8221; \u067e\u0631 \u06a9\u0644\u06a9 \u06a9\u0631\u06cc\u06ba\u06d4<\/p>\n<p>\u0645\u0648\u062c\u0648\u062f\u06c1 \u06a9\u0648\u0688\u0628\u06cc\u0633 \u06a9\u06cc \u0645\u0648\u062c\u0648\u062f\u06c1 \u0635\u0648\u0631\u062a\u062d\u0627\u0644 \u062f\u06cc\u06a9\u06be\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2\u060c freeCodeCamp-go-react-email\/06-send-email \u0645\u0644\u0627\u062d\u0638\u06c1 \u06a9\u0631\u06cc\u06ba\u06d4<\/p>\n<h2 id=\"heading-conclusion\">\u0646\u062a\u06cc\u062c\u06c1<\/h2>\n<p>\u0627\u0633 \u0679\u06cc\u0648\u0679\u0648\u0631\u06cc\u0644 \u067e\u0631 \u0639\u0645\u0644 \u06a9\u0631\u0646\u06d2 \u0633\u06d2 \u0622\u067e \u06a9\u0648 \u062f\u0631\u062c \u0630\u06cc\u0644 \u0641\u0648\u0627\u0626\u062f \u062d\u0627\u0635\u0644 \u06c1\u0648\u06ba \u06af\u06d2\u06d4<\/p>\n<ul>\n<li>\n<p>\u0622\u067e \u0646\u06d2 React \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0633\u06d2 Go \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0628\u0646\u0627\u0646\u06d2 \u06a9\u0627 \u0637\u0631\u06cc\u0642\u06c1 \u0633\u06cc\u06a9\u06be\u0627\u06d4<\/p>\n<\/li>\n<li>\n<p>\u0622\u067e \u0646\u06d2 \u0645\u06cc\u06a9 \u0641\u0627\u0626\u0644\u0632 \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u0627\u067e\u0646\u06cc \u0645\u0631\u0636\u06cc \u06a9\u06d2 \u0645\u0637\u0627\u0628\u0642 \u0627\u0633\u06a9\u0631\u067e\u0679 \u0686\u0644\u0627\u0646\u06d2 \u06a9\u0627 \u0637\u0631\u06cc\u0642\u06c1 \u0633\u06cc\u06a9\u06be\u0627\u06d4<\/p>\n<\/li>\n<li>\n<p>\u0645\u06cc\u06ba \u0646\u06d2 \u0628\u0631\u0627\u0624\u0632\u0631 \u0645\u06cc\u06ba \u0627\u06cc \u0645\u06cc\u0644 \u06a9\u0627 \u067e\u06cc\u0634 \u0646\u0638\u0627\u0631\u06c1 \u06a9\u0631\u06a9\u06d2 \u0645\u06cc\u0644 \u06c1\u0627\u06af \u06a9\u0627 \u0627\u0633\u062a\u0639\u0645\u0627\u0644 \u06a9\u0631\u062a\u06d2 \u06c1\u0648\u0626\u06d2 \u0627\u0633 \u06a9\u0627 \u062a\u062c\u0631\u0628\u06c1 \u06a9\u06cc\u0627\u06d4<\/p>\n<\/li>\n<\/ul>\n<p>\u0627\u0628 \u0622\u067e \u062e\u0627\u0645 HTML \u0627\u06cc \u0645\u06cc\u0644 \u0679\u06cc\u0628\u0644 \u0628\u0646\u0627\u0646\u06d2 \u06cc\u0627 \u0646\u0626\u06cc \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679 \u06a9\u06cc \u0632\u0628\u0627\u0646 \u0633\u06cc\u06a9\u06be\u0646\u06d2 \u06a9\u06cc \u067e\u0631\u06cc\u0634\u0627\u0646\u06cc \u06a9\u0648 \u0686\u06be\u0648\u0691 \u0633\u06a9\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4 \u0631\u06cc \u0627\u06cc\u06a9\u0679 \u0627\u06cc \u0645\u06cc\u0644 \u0627\u0648\u0631 \u06af\u0648 \u0679\u06cc\u0645\u067e\u0644\u06cc\u0679\u0633 \u0622\u067e \u06a9\u0648 \u0635\u0627\u0641 \u0633\u062a\u06be\u0631\u06d2\u060c \u0632\u06cc\u0627\u062f\u06c1 \u0688\u0648\u06cc\u0644\u067e\u0631 \u06a9\u06d2 \u0645\u0648\u0627\u0641\u0642 \u0637\u0631\u06cc\u0642\u06d2 \u0633\u06d2 \u0632\u0628\u0631\u062f\u0633\u062a \u0627\u06cc \u0645\u06cc\u0644\u0632 \u0628\u0646\u0627\u0646\u06d2 \u0627\u0648\u0631 \u0628\u06be\u06cc\u062c\u0646\u06d2 \u0645\u06cc\u06ba \u0645\u062f\u062f \u06a9\u0631\u062a\u06d2 \u06c1\u06cc\u06ba\u06d4<\/p>\n<\/p><\/div>\n","protected":false},"excerpt":{"rendered":"<p>\u0627\u06cc\u067e\u0644\u06cc\u06a9\u06cc\u0634\u0646 \u0627\u0646\u0679\u0631\u0641\u06cc\u0633 \u0633\u06d2 \u0628\u0627\u06c1\u0631 \u0627\u0637\u0644\u0627\u0639\u0627\u062a \u06a9\u06cc \u0641\u0631\u0627\u06c1\u0645\u06cc \u0627\u0648\u0631 \u0645\u0648\u0627\u0635\u0644\u0627\u062a \u06a9\u0648 \u0628\u0631\u0642\u0631\u0627\u0631 \u0631\u06a9\u06be\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0635\u0627\u0631\u0641\u06cc\u0646 \u06a9\u0648 \u0627\u06cc \u0645\u06cc\u0644\u0632 \u0628\u06be\u06cc\u062c\u0646\u06d2 \u06a9\u06d2 \u0644\u06cc\u06d2 \u0628\u06cc\u06a9 \u0627\u06cc\u0646\u0688 \u0627\u06cc\u067e\u0644\u06cc \u06a9\u06cc\u0634\u0646 \u06a9\u06cc \u0636\u0631\u0648\u0631\u062a \u06c1\u06d2\u06d4 \u06cc\u06c1 \u0627\u06cc \u0645\u06cc\u0644\u0632 \u0645\u062a\u062d\u0631\u06a9 \u06c1\u06cc\u06ba\u060c \u0639\u0627\u0645 \u0637\u0648\u0631 \u067e\u0631 \u06c1\u0631 \u0635\u0627\u0631\u0641 \u06a9\u06d2 \u0628\u0627\u0631\u06d2 \u0645\u06cc\u06ba \u0645\u062e\u0635\u0648\u0635 \u0645\u0639\u0644\u0648\u0645\u0627\u062a \u067e\u0631 \u0645\u0634\u062a\u0645\u0644 \u06c1\u0648\u062a\u06cc \u06c1\u06cc\u06ba\u060c \u062c\u06cc\u0633\u06d2 \u0635\u0627\u0631\u0641 \u06a9\u0627 \u0646\u0627\u0645 \u06cc\u0627 \u067e\u062a\u06c1\u06d4 \u06cc\u06c1 \u0645\u0636\u0645\u0648\u0646 [&hellip;]<\/p>\n","protected":false},"author":7,"featured_media":22799,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[1],"tags":[],"class_list":["post-22798","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog"],"_links":{"self":[{"href":"https:\/\/umang.pk\/en_us\/wp-json\/wp\/v2\/posts\/22798","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/umang.pk\/en_us\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/umang.pk\/en_us\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/umang.pk\/en_us\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/umang.pk\/en_us\/wp-json\/wp\/v2\/comments?post=22798"}],"version-history":[{"count":1,"href":"https:\/\/umang.pk\/en_us\/wp-json\/wp\/v2\/posts\/22798\/revisions"}],"predecessor-version":[{"id":22800,"href":"https:\/\/umang.pk\/en_us\/wp-json\/wp\/v2\/posts\/22798\/revisions\/22800"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/umang.pk\/en_us\/wp-json\/wp\/v2\/media\/22799"}],"wp:attachment":[{"href":"https:\/\/umang.pk\/en_us\/wp-json\/wp\/v2\/media?parent=22798"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/umang.pk\/en_us\/wp-json\/wp\/v2\/categories?post=22798"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/umang.pk\/en_us\/wp-json\/wp\/v2\/tags?post=22798"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}