{"id":9534,"date":"2023-03-02T10:31:35","date_gmt":"2023-03-02T07:01:35","guid":{"rendered":"https:\/\/nabfollower.com\/blog\/step-by-step-multi-tenant-app-with-nextjs-2mbc\/"},"modified":"2023-03-02T10:31:35","modified_gmt":"2023-03-02T07:01:35","slug":"step-by-step-multi-tenant-app-with-nextjs-2mbc","status":"publish","type":"post","link":"https:\/\/nabfollower.com\/blog\/step-by-step-multi-tenant-app-with-nextjs-2mbc\/","title":{"rendered":"\u06af\u0627\u0645 \u0628\u0647 \u06af\u0627\u0645: \u0627\u067e\u0644\u06cc\u06a9\u06cc\u0634\u0646 Multi-Tenant \u0628\u0627 Next.js"},"content":{"rendered":"<div data-article-id=\"1384061\" id=\"article-body\">\n<p>Next.js \u0627\u06a9\u0646\u0648\u0646 \u0628\u0647 \u0634\u0645\u0627 \u0627\u06cc\u0646 \u0627\u0645\u06a9\u0627\u0646 \u0631\u0627 \u0645\u06cc \u062f\u0647\u062f \u06a9\u0647 \u0628\u0647 \u0631\u0627\u062d\u062a\u06cc \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0632\u06cc\u0631 \u062f\u0627\u0645\u0646\u0647 \u0647\u0627 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u0686\u0646\u062f \u0645\u0633\u062a\u0627\u062c\u0631 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f.  \u0627\u06cc\u0646 \u0628\u0647 \u0634\u0645\u0627 \u0627\u0645\u06a9\u0627\u0646 \u0645\u06cc\u200c\u062f\u0647\u062f \u062a\u0627 \u0628\u0631\u0646\u0627\u0645\u0647\u200c\u0647\u0627\u06cc \u0648\u0628 \u0645\u0627\u0646\u0646\u062f Linktree\u060c Super.so \u0648 \u0633\u0627\u06cc\u0631 \u0628\u0631\u0646\u0627\u0645\u0647\u200c\u0647\u0627 \u0631\u0627 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f \u06a9\u0647 \u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062b\u0627\u0644 \u06a9\u0627\u0631\u0628\u0631 \u0635\u0641\u062d\u0647 \u0648\u0628 \u062e\u0648\u062f \u0631\u0627 \u062f\u0631\u06cc\u0627\u0641\u062a \u0645\u06cc\u200c\u06a9\u0646\u062f. <\/p>\n<p>\u0642\u0628\u0644 \u0627\u0632 \u0634\u0631\u0648\u0639\u060c \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u0686\u0646\u062f \u0645\u0646\u0628\u0639 \u0627\u0636\u0627\u0641\u06cc \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f:<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_85 counter-hierarchy ez-toc-counter-rtl ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">\u0641\u0647\u0631\u0633\u062a \u0645\u0637\u0627\u0644\u0628<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"\u062a\u063a\u06cc\u06cc\u0631 \u0648\u0636\u0639\u06cc\u062a \u0641\u0647\u0631\u0633\u062a \u0645\u0637\u0627\u0644\u0628\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/nabfollower.com\/blog\/step-by-step-multi-tenant-app-with-nextjs-2mbc\/#%D9%85%D8%B1%D8%AD%D9%84%D9%87_1_%DB%8C%DA%A9_%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_Nextjs_%D8%AE%D8%A7%D9%84%DB%8C_%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF_%DA%A9%D9%86%DB%8C%D8%AF\" >\u0645\u0631\u062d\u0644\u0647 1: \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 Next.js \u062e\u0627\u0644\u06cc \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/nabfollower.com\/blog\/step-by-step-multi-tenant-app-with-nextjs-2mbc\/#%D9%85%D8%B1%D8%AD%D9%84%D9%87_2_%D8%A7%D8%B3%D8%AA%D9%82%D8%B1%D8%A7%D8%B1_%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_%D8%AF%D8%B1_Vercel\" >\u0645\u0631\u062d\u0644\u0647 2: \u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u0628\u0631\u0646\u0627\u0645\u0647 \u062f\u0631 Vercel<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/nabfollower.com\/blog\/step-by-step-multi-tenant-app-with-nextjs-2mbc\/#%D9%85%D8%B1%D8%AD%D9%84%D9%87_3_%D8%AF%D8%A7%D9%85%D9%86%D9%87_%D8%AE%D9%88%D8%AF_%D8%B1%D8%A7_%D8%B1%D8%A7%D9%87_%D8%A7%D9%86%D8%AF%D8%A7%D8%B2%DB%8C_%DA%A9%D9%86%DB%8C%D8%AF\" >\u0645\u0631\u062d\u0644\u0647 3: \u062f\u0627\u0645\u0646\u0647 \u062e\u0648\u062f \u0631\u0627 \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u06cc\u062f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/nabfollower.com\/blog\/step-by-step-multi-tenant-app-with-nextjs-2mbc\/#%D9%85%D8%B1%D8%AD%D9%84%D9%87_4_%D8%B1%D8%A7%D9%87_%D8%A7%D9%86%D8%AF%D8%A7%D8%B2%DB%8C_%D9%85%D8%B3%DB%8C%D8%B1%DB%8C%D8%A7%D8%A8%DB%8C_%D8%AF%D8%B1_Nextjs\" >\u0645\u0631\u062d\u0644\u0647 4: \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u0645\u0633\u06cc\u0631\u06cc\u0627\u0628\u06cc \u062f\u0631 Next.js<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/nabfollower.com\/blog\/step-by-step-multi-tenant-app-with-nextjs-2mbc\/#%D9%85%D8%B1%D8%AD%D9%84%D9%87_5_%D8%A7%D9%81%D8%B2%D9%88%D8%AF%D9%86_%D9%85%DB%8C%D8%A7%D9%86_%D8%A7%D9%81%D8%B2%D8%A7%D8%B1_%D9%88_%D8%AF%D8%A7%D8%AF%D9%87_%D9%87%D8%A7%DB%8C_%D8%B3%D8%A7%D8%AE%D8%AA%DA%AF%DB%8C\" >\u0645\u0631\u062d\u0644\u0647 5: \u0627\u0641\u0632\u0648\u062f\u0646 \u0645\u06cc\u0627\u0646 \u0627\u0641\u0632\u0627\u0631 \u0648 \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u0633\u0627\u062e\u062a\u06af\u06cc<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/nabfollower.com\/blog\/step-by-step-multi-tenant-app-with-nextjs-2mbc\/#%D9%85%D8%B1%D8%AD%D9%84%D9%87_6_%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_%D8%B1%D8%A7_%D8%AA%D8%B3%D8%AA_%D9%88_%D8%A7%D8%AC%D8%B1%D8%A7_%DA%A9%D9%86%DB%8C%D8%AF\" >\u0645\u0631\u062d\u0644\u0647 6: \u0628\u0631\u0646\u0627\u0645\u0647 \u0631\u0627 \u062a\u0633\u062a \u0648 \u0627\u062c\u0631\u0627 \u06a9\u0646\u06cc\u062f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/nabfollower.com\/blog\/step-by-step-multi-tenant-app-with-nextjs-2mbc\/#%D9%85%D8%B1%D8%AD%D9%84%D9%87_7_%D9%85%D8%B1%D8%A7%D8%AD%D9%84_%D8%A8%D8%B9%D8%AF%DB%8C\" >\u0645\u0631\u062d\u0644\u0647 7: \u0645\u0631\u0627\u062d\u0644 \u0628\u0639\u062f\u06cc<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"%D9%85%D8%B1%D8%AD%D9%84%D9%87_1_%DB%8C%DA%A9_%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_Nextjs_%D8%AE%D8%A7%D9%84%DB%8C_%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF_%DA%A9%D9%86%DB%8C%D8%AF\"><\/span>\n<p>  \u0645\u0631\u062d\u0644\u0647 1: \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 Next.js \u062e\u0627\u0644\u06cc \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><code>npx create-next-app<\/code><\/p>\n<p>\u0627\u0632 \u0634\u0645\u0627 \u067e\u0631\u0633\u06cc\u062f\u0647 \u0645\u06cc \u0634\u0648\u062f \u06a9\u0647 \u0622\u06cc\u0627 Typescript\u060c ESLint \u0648 \u06af\u0632\u06cc\u0646\u0647 \u0647\u0627\u06cc \u062f\u06cc\u06af\u0631 \u0631\u0627 \u0645\u06cc \u062e\u0648\u0627\u0647\u06cc\u062f.  \u0628\u0631\u0627\u06cc \u0647\u0645\u0647 \u0686\u06cc\u0632 \u0628\u0644\u0647 \u0631\u0627 \u0628\u0632\u0646\u06cc\u062f. <\/p>\n<p>\u067e\u0633 \u0627\u0632 \u0627\u06cc\u062c\u0627\u062f \u0628\u0631\u0646\u0627\u0645\u0647\u060c \u0622\u0646 \u0631\u0627 \u062f\u0631 \u0648\u06cc\u0631\u0627\u06cc\u0634\u06af\u0631 \u06a9\u062f \u062e\u0648\u062f (VSCode) \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D9%85%D8%B1%D8%AD%D9%84%D9%87_2_%D8%A7%D8%B3%D8%AA%D9%82%D8%B1%D8%A7%D8%B1_%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_%D8%AF%D8%B1_Vercel\"><\/span>\n<p>  \u0645\u0631\u062d\u0644\u0647 2: \u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u0628\u0631\u0646\u0627\u0645\u0647 \u062f\u0631 Vercel<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u0628\u0627 \u0628\u0627\u0632 \u06a9\u0631\u062f\u0646 \u062a\u0631\u0645\u06cc\u0646\u0627\u0644 (Command + J \u062f\u0631 \u0645\u06a9) \u062f\u0627\u062e\u0644 VSCode \u0631\u0627 \u0627\u0646\u062c\u0627\u0645 \u062f\u0647\u06cc\u062f. <\/p>\n<p>Vercel CLI \u0631\u0627 \u0646\u0635\u0628 \u06a9\u0646\u06cc\u062f:<br \/><code>npm i -g vercel<\/code><\/p>\n<p>\u067e\u0633 \u0627\u0632 \u0627\u0646\u062c\u0627\u0645 \u0627\u06cc\u0646 \u06a9\u0627\u0631\u060c \u0627\u062f\u0627\u0645\u0647 \u062f\u0647\u06cc\u062f \u0648 \u0627\u062c\u0631\u0627 \u06a9\u0646\u06cc\u062f:<br \/><code>vercel --prod<\/code>  \u062a\u0627 \u0622\u0646 \u0631\u0627 \u062f\u0631 \u062a\u0648\u0644\u06cc\u062f \u0645\u0633\u062a\u0642\u0631 \u06a9\u0646\u062f<\/p>\n<p>\u0631\u0648\u06cc \u067e\u06cc\u0648\u0646\u062f \u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u06a9\u0644\u06cc\u06a9 \u06a9\u0646\u06cc\u062f \u062a\u0627 \u062f\u0631 \u062f\u0627\u0634\u0628\u0648\u0631\u062f Vercel \u0642\u0631\u0627\u0631 \u0628\u06af\u06cc\u0631\u06cc\u062f. <\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D9%85%D8%B1%D8%AD%D9%84%D9%87_3_%D8%AF%D8%A7%D9%85%D9%86%D9%87_%D8%AE%D9%88%D8%AF_%D8%B1%D8%A7_%D8%B1%D8%A7%D9%87_%D8%A7%D9%86%D8%AF%D8%A7%D8%B2%DB%8C_%DA%A9%D9%86%DB%8C%D8%AF\"><\/span>\n<p>  \u0645\u0631\u062d\u0644\u0647 3: \u062f\u0627\u0645\u0646\u0647 \u062e\u0648\u062f \u0631\u0627 \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u06cc\u062f<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0628\u0631\u0627\u06cc \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0648\u06cc\u0698\u06af\u06cc \u0632\u06cc\u0631 \u062f\u0627\u0645\u0646\u0647 \u062f\u0631 Vercel\u060c \u0628\u0627\u06cc\u062f \u062f\u0627\u0645\u0646\u0647 wildcard \u062e\u0648\u062f \u0631\u0627 \u062a\u0646\u0638\u06cc\u0645 \u06a9\u0646\u06cc\u062f.  \u0627\u06af\u0631 \u0634\u0645\u0627 \u06cc\u06a9 \u062a\u0648\u0633\u0639\u0647 \u062f\u0647\u0646\u062f\u0647 \u0647\u0633\u062a\u06cc\u062f\u060c \u0628\u0627\u06cc\u062f \u062f\u0627\u0645\u0646\u0647 \u0647\u0627\u06cc \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0646\u0634\u062f\u0647 \u0632\u06cc\u0627\u062f\u06cc \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u062f \ud83d\ude09 <\/p>\n<p>\u0645\u0627\u0644 \u0645\u0646 buildwithnext.com \u0646\u0627\u0645 \u062f\u0627\u0631\u062f<\/p>\n<p>\u0645\u0646 \u0627\u0632 Namecheap \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc \u06a9\u0646\u0645\u060c \u0628\u0646\u0627\u0628\u0631\u0627\u06cc\u0646 \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u0646\u062d\u0648\u0647 \u0627\u0646\u062c\u0627\u0645 \u0622\u0646 \u0628\u0647 \u0634\u0631\u062d \u0632\u06cc\u0631 \u0627\u0633\u062a:<\/p>\n<p>\u062f\u0631 \u062f\u0627\u0634\u0628\u0648\u0631\u062f Vercel \u062f\u0627\u0645\u0646\u0647 \u0646\u0648\u06cc\u0633\u0647 \u062e\u0648\u062f \u0631\u0627 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u062f<br \/><\/p>\n<p>\u0633\u067e\u0633 \u0648\u0627\u0631\u062f \u062d\u0633\u0627\u0628 Namecheap \u062e\u0648\u062f \u0634\u0648\u06cc\u062f \u0648 \u0622\u062f\u0631\u0633 \u0647\u0627\u06cc DNS Nameserver \u0632\u06cc\u0631 \u0631\u0627 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u062f<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/nabfollower.com\/blog\/wp-content\/uploads\/2023\/03\/1677740495_840_\u06af\u0627\u0645-\u0628\u0647-\u06af\u0627\u0645-\u0627\u067e\u0644\u06cc\u06a9\u06cc\u0634\u0646-Multi-Tenant-\u0628\u0627-Nextjs.png\" alt=\"DNS \u0633\u0631\u0648\u0631 \u0646\u0627\u0645 \u0633\u0641\u0627\u0631\u0634\u06cc \u0631\u0627 \u062f\u0631 Namecheap \u062a\u0646\u0638\u06cc\u0645 \u06a9\u0646\u06cc\u062f\" loading=\"lazy\" width=\"880\" height=\"496\" title=\"\"><\/p>\n<p><em>\u0647\u0646\u06af\u0627\u0645\u06cc \u06a9\u0647 \u06cc\u06a9 \u062f\u0627\u0645\u0646\u0647 \u062d\u0631\u0648\u0641 \u0627\u0636\u0627\u0641\u0647 \u0645\u06cc \u06a9\u0646\u06cc\u062f\u060c Vercel \u0628\u0647 \u0637\u0648\u0631 \u062e\u0648\u062f\u06a9\u0627\u0631 \u0647\u0645\u0647 \u062f\u0627\u0645\u0646\u0647 \u0647\u0627\u06cc \u062f\u06cc\u06af\u0631 \u0631\u0627 \u0628\u0631\u0627\u06cc \u0634\u0645\u0627 \u067e\u0631 \u0645\u06cc \u06a9\u0646\u062f.<\/em><\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D9%85%D8%B1%D8%AD%D9%84%D9%87_4_%D8%B1%D8%A7%D9%87_%D8%A7%D9%86%D8%AF%D8%A7%D8%B2%DB%8C_%D9%85%D8%B3%DB%8C%D8%B1%DB%8C%D8%A7%D8%A8%DB%8C_%D8%AF%D8%B1_Nextjs\"><\/span>\n<p>  \u0645\u0631\u062d\u0644\u0647 4: \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u0645\u0633\u06cc\u0631\u06cc\u0627\u0628\u06cc \u062f\u0631 Next.js<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u06cc\u06a9 \u067e\u0648\u0634\u0647 \u062c\u062f\u06cc\u062f \u062f\u0631 \u067e\u0648\u0634\u0647 pages \u0628\u0647 \u0646\u0627\u0645 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u062f <code>_sites<\/code> \u0648 \u0633\u067e\u0633 \u06cc\u06a9\u06cc \u062f\u06cc\u06af\u0631 \u062f\u0631 \u0622\u0646\u062c\u0627 \u0632\u0646\u06af \u0632\u062f <code>[site]<\/code>.  \u0633\u067e\u0633 \u06cc\u06a9 \u0641\u0627\u06cc\u0644 index.tsx \u0631\u0627 \u0628\u0647 \u0622\u0646 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u062f <code>[site]<\/code> \u067e\u0648\u0634\u0647 <\/p>\n<p>\u0633\u0627\u062e\u062a\u0627\u0631 \u067e\u0648\u0634\u0647 \u062c\u062f\u06cc\u062f \u0634\u0645\u0627 \u0627\u06a9\u0646\u0648\u0646 \u0628\u0627\u06cc\u062f \u0628\u0647 \u0634\u06a9\u0644 \u0632\u06cc\u0631 \u0628\u0627\u0634\u062f:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>pages\n\u2514\u2500\u2500\u2500api\n\u2514\u2500\u2500\u2500sites\n\u2502      \u2502\n\u2502    [site]\n\u2502      \u2502  index.tsx\npackage.json\netc\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062f\u0627\u062e\u0644 \u0641\u0627\u06cc\u0644 index.tsx \u06a9\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u062f:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>import { useRouter } from \"next\/router\";\n\/\/ we will create these in the next step\nimport { getHostnameDataBySubdomain, getSubdomainPaths } from \"@\/lib\/db\";\n\n\/\/ Our types for the site data\nexport interface Props {\n  name: String\n  description: String\n  subdomain: String\n  customDomain: String\n}\n\nexport default function Index(props: Props) {\n  const router = useRouter()\n\n  if (router.isFallback) {\n    return (\n      &lt;&gt;\n        &lt;p&gt;\n          Loading...\n        &lt;\/p&gt;\n      &lt;\/&gt;\n    )\n  }\n\n  return (\n    &lt;&gt;\n      &lt;h1&gt;\n        {props.name}\n      &lt;\/h1&gt;\n    &lt;\/&gt;\n  )\n}\n\n\/\/ Getting the paths for all the subdomains in our database\nexport async function getStaticPaths() {\n  const paths = await getSubdomainPaths()\n\n  return {\n    paths,\n    fallback: true\n  }\n}\n\n\/\/ Getting data to display on each custom subdomain\nexport async function getStaticProps({ params: { site } }) {\n  const sites = await getHostnameDataBySubdomain(site)\n\n  return {\n    props: sites,\n    revalidate: 3600\n  }\n}\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<h2><span class=\"ez-toc-section\" id=\"%D9%85%D8%B1%D8%AD%D9%84%D9%87_5_%D8%A7%D9%81%D8%B2%D9%88%D8%AF%D9%86_%D9%85%DB%8C%D8%A7%D9%86_%D8%A7%D9%81%D8%B2%D8%A7%D8%B1_%D9%88_%D8%AF%D8%A7%D8%AF%D9%87_%D9%87%D8%A7%DB%8C_%D8%B3%D8%A7%D8%AE%D8%AA%DA%AF%DB%8C\"><\/span>\n<p>  \u0645\u0631\u062d\u0644\u0647 5: \u0627\u0641\u0632\u0648\u062f\u0646 \u0645\u06cc\u0627\u0646 \u0627\u0641\u0632\u0627\u0631 \u0648 \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u0633\u0627\u062e\u062a\u06af\u06cc<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u06cc\u06a9 \u0641\u0627\u06cc\u0644 \u0645\u06cc\u0627\u0646\u200c\u0627\u0641\u0632\u0627\u0631 \u0628\u0647 \u0645\u0627 \u0627\u06cc\u0646 \u0627\u0645\u06a9\u0627\u0646 \u0631\u0627 \u0645\u06cc\u200c\u062f\u0647\u062f \u06a9\u0647 \u062a\u0645\u0627\u0633\u200c\u0647\u0627\u06cc api \u0628\u0647 \u0628\u0627\u0637\u0646 \u062e\u0648\u062f \u0631\u0627 \u0631\u0647\u06af\u06cc\u0631\u06cc \u06a9\u0646\u06cc\u0645 \u0648 \u06a9\u0627\u0631\u06cc \u0628\u0627 \u0622\u0646 \u0627\u0646\u062c\u0627\u0645 \u062f\u0647\u06cc\u0645.  \u062f\u0631 \u0627\u06cc\u0646 \u0645\u0648\u0631\u062f \u0645\u0627 \u0627\u0632 \u0645\u06cc\u0627\u0646 \u0627\u0641\u0632\u0627\u0631 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc \u06a9\u0646\u06cc\u0645 \u062a\u0627 \u0645\u0634\u062e\u0635 \u06a9\u0646\u06cc\u0645 \u06a9\u0647 \u0641\u0631\u0627\u062e\u0648\u0627\u0646\u06cc api \u0628\u0631\u0627\u06cc \u0686\u0647 \u0646\u0627\u0645 \u0645\u06cc\u0632\u0628\u0627\u0646\u06cc \u0627\u0646\u062c\u0627\u0645 \u0645\u06cc \u0634\u0648\u062f \u0648 \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u0635\u062d\u06cc\u062d \u0631\u0627 \u0646\u0645\u0627\u06cc\u0634 \u0645\u06cc \u062f\u0647\u06cc\u0645. <\/p>\n<p>\u0628\u06cc\u0627\u06cc\u06cc\u062f \u06cc\u06a9 \u0631\u0627 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u0645 <code>middleware.ts<\/code> \u0641\u0627\u06cc\u0644 \u062f\u0631 \u0631\u06cc\u0634\u0647 \u062f\u0627\u06cc\u0631\u06a9\u062a\u0648\u0631\u06cc \u067e\u0631\u0648\u0698\u0647 \u0645\u0627<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>pages\n\u2514\u2500\u2500\u2500api\n\u2514\u2500\u2500\u2500sites\n\u2502      \u2502\n\u2502    [site]\n\u2502      \u2502  index.tsx\nmiddleware.ts\npackage.json\netc\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062f\u0631 \u062f\u0627\u062e\u0644 \u0641\u0627\u06cc\u0644 Middleware.ts \u0627\u06cc\u0646 \u06a9\u062f \u0631\u0627 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u062f:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>import { NextRequest, NextResponse } from 'next\/server'\nimport { getHostnameDataOrDefault } from '.\/lib\/db'\n\nexport const config = {\n  matcher: [\"https:\/\/dev.to\/\", \"https:\/\/dev.to\/about\", '\/_sites\/:path'],\n}\n\nexport default async function middleware(req: NextRequest) {\n  const url = req.nextUrl\n\n  \/\/ Get hostname (e.g. vercel.com, test.vercel.app, etc.)\n  const hostname = req.headers.get('host')\n\n  \/\/ If localhost, assign the host value manually\n  \/\/ If prod, get the custom domain\/subdomain value by removing the root URL\n  \/\/ (in the case of \"subdomain-3.localhost:3000\", \"localhost:3000\" is the root URL)\n  \/\/ process.env.NODE_ENV === \"production\" indicates that the app is deployed to a production environment\n  \/\/ process.env.VERCEL === \"1\" indicates that the app is deployed on Vercel\n  const currentHost =\n    process.env.NODE_ENV === \"production\" &amp;&amp; process.env.VERCEL === \"1\"\n      ? hostname\n        .replace(`.buildwithnext.com`, \"\")\n      : hostname.replace(`.localhost:3000`, \"\");\n\n\n\n  const data = await getHostnameDataOrDefault(currentHost)\n\n  \/\/ Prevent security issues \u2013 users should not be able to canonically access\n  \/\/ the pages\/sites folder and its respective contents.\n  if (url.pathname.startsWith(`\/_sites`)) {\n    url.pathname = `\/404`\n  } else {\n    \/\/ console.log('URL 2', req.nextUrl.href)\n    \/\/ rewrite to the current subdomain under the pages\/sites folder\n    url.pathname = `\/_sites\/${data.subdomain}${url.pathname}`\n  }\n\n  return NextResponse.rewrite(url)\n}\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u0627\u06cc\u0646\u062c\u0627 \u0627\u062a\u0641\u0627\u0642\u0627\u062a \u0632\u06cc\u0627\u062f\u06cc \u0645\u06cc \u0627\u0641\u062a\u062f\u060c \u0627\u0645\u0627 \u0645\u0646 \u0633\u0639\u06cc \u06a9\u0631\u062f\u0645 \u0646\u0638\u0631\u0627\u062a \u0628\u06cc\u0634\u062a\u0631\u06cc \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u0645 \u062a\u0627 \u0647\u0645\u0647 \u0686\u06cc\u0632 \u0631\u0648\u0634\u0646 \u0634\u0648\u062f.  \u0645\u0645\u06a9\u0646 \u0627\u0633\u062a \u062f\u0631 \u0627\u0628\u062a\u062f\u0627 \u062a\u0631\u0633\u0646\u0627\u06a9 \u0628\u0647 \u0646\u0638\u0631 \u0628\u0631\u0633\u062f\u060c \u0627\u0645\u0627 \u0633\u0639\u06cc \u06a9\u0646\u06cc\u062f \u062e\u0637 \u0628\u0647 \u062e\u0637 \u0628\u0631\u0648\u06cc\u062f \u0648 \u0646\u0638\u0631\u0627\u062a \u0631\u0627 \u0628\u062e\u0648\u0627\u0646\u06cc\u062f.  \u062f\u0631 \u0646\u0647\u0627\u06cc\u062a \u0645\u0639\u0646\u0627 \u067e\u06cc\u062f\u0627 \u062e\u0648\u0627\u0647\u062f \u06a9\u0631\u062f. <\/p>\n<p>\u062d\u0627\u0644\u0627 \u0628\u06cc\u0627\u06cc\u06cc\u062f \u062c\u0644\u0648 \u0628\u0631\u0648\u06cc\u0645 \u0648 \u06cc\u06a9 \u067e\u0648\u0634\u0647 lib \u062f\u0631 \u0631\u06cc\u0634\u0647 \u062f\u0627\u06cc\u0631\u06a9\u062a\u0648\u0631\u06cc \u067e\u0631\u0648\u0698\u0647 \u062e\u0648\u062f \u0648 \u06cc\u06a9 \u0641\u0627\u06cc\u0644 db.ts \u062f\u0631 \u062f\u0627\u062e\u0644 \u0622\u0646 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u0645.<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>lib\n\u2514\u2500\u2500\u2500db.ts\npages\n\u2514\u2500\u2500\u2500api\n\u2514\u2500\u2500\u2500sites\n\u2502      \u2502\n\u2502    [site]\n\u2502      \u2502  index.tsx\nmiddleware.ts\npackage.json\netc\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062f\u0627\u062e\u0644 \u0641\u0627\u06cc\u0644 db.ts \u06a9\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u062f:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>\/\/ Dummy data to be replaced with your database\nconst hostnamesDB = [\n  {\n    name: 'This is Site 1',\n    description: 'Subdomain + custom domain',\n    subdomain: 'test1',\n    customDomain: 'custom-domain-1.com',\n    \/\/ Default subdomain for Preview deployments and for local development\n    defaultForPreview: true,\n  },\n  {\n    name: 'This is Site 2',\n    description: 'Subdomain only',\n    subdomain: 'test2',\n  },\n  {\n    name: 'This is Site 3',\n    description: 'Subdomain only',\n    subdomain: 'test3',\n  },\n]\nconst DEFAULT_HOST = hostnamesDB.find((h) =&gt; h.defaultForPreview)\n\n\/**\n * Returns the data of the hostname based on its subdomain or custom domain\n * or the default host if there's no match.\n *\n * This method is used by middleware.ts\n *\/\nexport async function getHostnameDataOrDefault(\n  subdomainOrCustomDomain?: string\n) {\n  if (!subdomainOrCustomDomain) return DEFAULT_HOST\n\n  \/\/ check if site is a custom domain or a subdomain\n  const customDomain = subdomainOrCustomDomain.includes('.')\n\n  \/\/ fetch data from mock database using the site value as the key\n  return (\n    hostnamesDB.find((item) =&gt;\n      customDomain\n        ? item.customDomain === subdomainOrCustomDomain\n        : item.subdomain === subdomainOrCustomDomain\n    ) ?? DEFAULT_HOST\n  )\n}\n\n\/**\n * Returns the data of the hostname based on its subdomain.\n *\n * This method is used by pages under middleware.ts\n *\/\nexport async function getHostnameDataBySubdomain(subdomain: string) {\n  return hostnamesDB.find((item) =&gt; item.subdomain === subdomain)\n}\n\n\/**\n * Returns the paths for `getStaticPaths` based on the subdomain of every\n * available hostname.\n *\/\nexport async function getSubdomainPaths() {\n  \/\/ get all sites that have subdomains set up\n  const subdomains = hostnamesDB.filter((item) =&gt; item.subdomain)\n\n  \/\/ build paths for each of the sites in the previous two lists\n  return subdomains.map((item) =&gt; {\n    return { params: { site: item.subdomain } }\n  })\n}\n\nexport default hostnamesDB\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u0627\u06cc\u0646 \u06cc\u06a9\u06cc \u06a9\u0627\u0645\u0644\u0627\u064b \u062e\u0648\u062f \u062a\u0648\u0636\u06cc\u062d\u06cc \u0627\u0633\u062a.  \u0645\u0627 \u0627\u0633\u0627\u0633\u0627\u064b \u0628\u0631\u062e\u06cc \u0627\u0632 \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u0633\u0627\u062e\u062a\u06af\u06cc \u062f\u0627\u0631\u06cc\u0645 \u06a9\u0647 \u0627\u0632 \u0622\u0646\u0647\u0627 \u0628\u0631\u0627\u06cc \u062f\u0631\u06cc\u0627\u0641\u062a \u0632\u06cc\u0631 \u062f\u0627\u0645\u0646\u0647 \u0648 \u062f\u0627\u062f\u0647 \u0647\u0627 \u0628\u0631\u0627\u06cc \u0646\u0645\u0627\u06cc\u0634 \u062f\u0631 \u0642\u0633\u0645\u062a \u062c\u0644\u0648 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc \u06a9\u0646\u06cc\u0645. <\/p>\n<p>\u0628\u0627\u0632 \u0647\u0645 \u062e\u0637 \u0628\u0647 \u062e\u0637 \u0628\u0631\u0648\u06cc\u062f \u0648 \u0646\u0638\u0631\u0627\u062a \u0631\u0627 \u0628\u062e\u0648\u0627\u0646\u06cc\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D9%85%D8%B1%D8%AD%D9%84%D9%87_6_%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_%D8%B1%D8%A7_%D8%AA%D8%B3%D8%AA_%D9%88_%D8%A7%D8%AC%D8%B1%D8%A7_%DA%A9%D9%86%DB%8C%D8%AF\"><\/span>\n<p>  \u0645\u0631\u062d\u0644\u0647 6: \u0628\u0631\u0646\u0627\u0645\u0647 \u0631\u0627 \u062a\u0633\u062a \u0648 \u0627\u062c\u0631\u0627 \u06a9\u0646\u06cc\u062f<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0627\u06a9\u0646\u0648\u0646 \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u0645 \u0627\u062c\u0631\u0627 \u06a9\u0646\u06cc\u0645 <code>npm run dev<\/code> \u0628\u0631\u0627\u06cc \u062a\u0633\u062a \u0628\u0631\u0646\u0627\u0645\u0647 <\/p>\n<p>\u0628\u0647 localhost:3000 \u0628\u0631\u0648\u06cc\u062f (\u0645\u0637\u0645\u0626\u0646 \u0634\u0648\u06cc\u062f \u06a9\u0647 \u0631\u0648\u06cc localhost:3000 \u0627\u062c\u0631\u0627 \u0645\u06cc\u200c\u06a9\u0646\u06cc\u062f \u0632\u06cc\u0631\u0627 \u0627\u06cc\u0646 \u0647\u0645\u0627\u0646 \u0686\u06cc\u0632\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0645\u0627 \u062f\u0631 \u0641\u0627\u06cc\u0644 Middleware.ts \u0642\u0631\u0627\u0631 \u062f\u0627\u062f\u0647\u200c\u0627\u06cc\u0645).<\/p>\n<p>\u062d\u0627\u0644\u0627 \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u0633\u0639\u06cc \u06a9\u0646\u06cc\u062f \u0628\u0647 <code>test2.localhost:3000<\/code>.  \u0645\u062d\u062a\u0648\u0627 \u0628\u0627\u06cc\u062f \u0628\u0647 <code>This is Site 2<\/code><\/p>\n<p>\u0627\u06af\u0631 \u0627\u06a9\u0646\u0648\u0646 \u0628\u0631\u0646\u0627\u0645\u0647 \u062e\u0648\u062f \u0631\u0627 \u0645\u0633\u062a\u0642\u0631 \u06a9\u0646\u06cc\u062f\u060c \u0628\u0627\u06cc\u062f \u0628\u0647 \u0647\u0645\u06cc\u0646 \u0635\u0648\u0631\u062a \u0639\u0645\u0644 \u06a9\u0646\u062f! <code>vercel --prod<\/code><\/p>\n<p><img decoding=\"async\" src=\"https:\/\/nabfollower.com\/blog\/wp-content\/uploads\/2023\/03\/1677740495_487_\u06af\u0627\u0645-\u0628\u0647-\u06af\u0627\u0645-\u0627\u067e\u0644\u06cc\u06a9\u06cc\u0634\u0646-Multi-Tenant-\u0628\u0627-Nextjs.png\" alt=\"\u0628\u0631\u0646\u0627\u0645\u0647 Next.js \u062f\u0627\u0631\u0627\u06cc \u0645\u0639\u0645\u0627\u0631\u06cc \u0686\u0646\u062f \u0645\u0633\u062a\u0627\u062c\u0631 \u0627\u0633\u062a\" loading=\"lazy\" width=\"622\" height=\"376\" title=\"\"><\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D9%85%D8%B1%D8%AD%D9%84%D9%87_7_%D9%85%D8%B1%D8%A7%D8%AD%D9%84_%D8%A8%D8%B9%D8%AF%DB%8C\"><\/span>\n<p>  \u0645\u0631\u062d\u0644\u0647 7: \u0645\u0631\u0627\u062d\u0644 \u0628\u0639\u062f\u06cc<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0627\u06a9\u0646\u0648\u0646 \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u0633\u0627\u062e\u062a\u06af\u06cc \u0631\u0627 \u0628\u0627 \u06cc\u06a9 \u067e\u0627\u06cc\u06af\u0627\u0647 \u062f\u0627\u062f\u0647 \u0645\u0627\u0646\u0646\u062f PlanetScale \u062c\u0627\u06cc\u06af\u0632\u06cc\u0646 \u06a9\u0646\u06cc\u062f \u0648 \u0627\u0632 Prisma ORM \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u062f \u062a\u0627 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u062e\u0648\u062f \u0632\u06cc\u0631 \u062f\u0627\u0645\u0646\u0647 \u062e\u0648\u062f \u0631\u0627 \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u0646\u062f \u0648 \u062f\u0627\u062f\u0647 \u0647\u0627 \u0631\u0627 \u0628\u0647 \u0633\u0627\u06cc\u062a \u0647\u0627\u06cc \u062e\u0648\u062f \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u0646\u062f!  \u0645\u0646 \u0622\u0645\u0648\u0632\u0634 \u0647\u0627\u06cc \u0628\u06cc\u0634\u062a\u0631\u06cc \u062f\u0631 \u0645\u0648\u0631\u062f \u0646\u062d\u0648\u0647 \u0627\u0646\u062c\u0627\u0645 \u0627\u06cc\u0646 \u06a9\u0627\u0631 \u0627\u0636\u0627\u0641\u0647 \u062e\u0648\u0627\u0647\u0645 \u06a9\u0631\u062f\u060c \u067e\u0633 \u0628\u0627 \u0645\u0627 \u0647\u0645\u0631\u0627\u0647 \u0628\u0627\u0634\u06cc\u062f. <\/p>\n<p>\u0627\u0645\u06cc\u062f\u0648\u0627\u0631\u0645 \u0627\u06cc\u0646 \u0645\u0642\u0627\u0644\u0647 \u0645\u0641\u06cc\u062f \u0628\u0648\u062f\u0647 \u0628\u0627\u0634\u062f!<\/p>\n<\/p><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Next.js \u0627\u06a9\u0646\u0648\u0646 \u0628\u0647 \u0634\u0645\u0627 \u0627\u06cc\u0646 \u0627\u0645\u06a9\u0627\u0646 \u0631\u0627 \u0645\u06cc \u062f\u0647\u062f \u06a9\u0647 \u0628\u0647 \u0631\u0627\u062d\u062a\u06cc \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0632\u06cc\u0631 \u062f\u0627\u0645\u0646\u0647 \u0647\u0627 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u0686\u0646\u062f \u0645\u0633\u062a\u0627\u062c\u0631 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f. \u0627\u06cc\u0646 \u0628\u0647 \u0634\u0645\u0627 \u0627\u0645\u06a9\u0627\u0646 \u0645\u06cc\u200c\u062f\u0647\u062f \u062a\u0627 \u0628\u0631\u0646\u0627\u0645\u0647\u200c\u0647\u0627\u06cc \u0648\u0628 \u0645\u0627\u0646\u0646\u062f Linktree\u060c Super.so \u0648 \u0633\u0627\u06cc\u0631 \u0628\u0631\u0646\u0627\u0645\u0647\u200c\u0647\u0627 \u0631\u0627 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f \u06a9\u0647 \u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062b\u0627\u0644 \u06a9\u0627\u0631\u0628\u0631 \u0635\u0641\u062d\u0647 \u0648\u0628 \u062e\u0648\u062f \u0631\u0627 \u062f\u0631\u06cc\u0627\u0641\u062a \u0645\u06cc\u200c\u06a9\u0646\u062f. \u0642\u0628\u0644 \u0627\u0632 \u0634\u0631\u0648\u0639\u060c &hellip;<\/p>\n","protected":false},"author":2,"featured_media":9535,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"fifu_image_url":"","fifu_image_alt":"","footnotes":""},"categories":[339],"tags":[],"class_list":["post-9534","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-dev"],"_links":{"self":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/9534","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/comments?post=9534"}],"version-history":[{"count":0,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/9534\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media\/9535"}],"wp:attachment":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media?parent=9534"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/categories?post=9534"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/tags?post=9534"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}