diff --git a/CHANGELOG.md b/CHANGELOG.md
index dbbbe471d9..d1a8b60ffc 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -13,8 +13,12 @@ Our versioning strategy is as follows:
 
 ### 🛠 Breaking Changes
 
-* `[sitecore-jss-rendering-host]` `startDevServer` is retired. `startRenderingHostServer` is the only way to start the rendering host from now on. ([#1426](https://github.com/Sitecore/jss/pull/1426))
 * `[sitecore-jss-react]` `[sitecore-jss-nextjs]` FEaaS component is now server rendered. Prop type used FEaaSWrapper has been modified alongside with FEaaSWrapper implementation. Make sure you use the updated type and the updated wrapper. ([#1413](https://github.com/Sitecore/jss/pull/1413))
+* `[sitecore-jss-rendering-host]` `startDevServer` is retired. `startRenderingHostServer` is the only way to start the rendering host from now on. ([#1426](https://github.com/Sitecore/jss/pull/1426))
+* `[sitecore-jss-nextjs]` Some imports have been moved to avoid accidentally importing nextjs server logic inside client componenents([#1430](https://github.com/Sitecore/jss/pull/1430/)):
+  * SiteInfo and SiteResolver imports have been moved from '@sitecore-jss/sitecore-jss-nextjs/middleware' module to '@sitecore-jss/sitecore-jss-nextjs/site'
+  * tryParseEnvValue import has been moved from '@sitecore-jss/sitecore-jss-nextjs/middleware' module to '@sitecore-jss/sitecore-jss-nextjs/utils'
+  * exports for isEditorActive, resetEditorChromes, resolveUrl, tryParseEnvValue, handleEditorFastRefresh, getPublicUrl from '@sitecore-jss/sitecore-jss-nextjs' are depreceated. '@sitecore-jss/sitecore-jss-nextjs/utils' module should be used for them instead. 
 
 ### 🎉 New Features & Improvements
 
diff --git a/packages/create-sitecore-jss/src/templates/nextjs-multisite/src/lib/site-resolver/plugins/multisite.ts b/packages/create-sitecore-jss/src/templates/nextjs-multisite/src/lib/site-resolver/plugins/multisite.ts
index b8c491b75b..95344b275b 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs-multisite/src/lib/site-resolver/plugins/multisite.ts
+++ b/packages/create-sitecore-jss/src/templates/nextjs-multisite/src/lib/site-resolver/plugins/multisite.ts
@@ -1,4 +1,4 @@
-import { SiteInfo } from '@sitecore-jss/sitecore-jss-nextjs/middleware';
+import { SiteInfo } from '@sitecore-jss/sitecore-jss-nextjs/site';
 import config from 'temp/config';
 import { SiteResolverPlugin } from '..';
 
diff --git a/packages/create-sitecore-jss/src/templates/nextjs-personalize/src/lib/site-resolver/plugins/default.ts b/packages/create-sitecore-jss/src/templates/nextjs-personalize/src/lib/site-resolver/plugins/default.ts
index 321cb400d2..6fcb0af050 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs-personalize/src/lib/site-resolver/plugins/default.ts
+++ b/packages/create-sitecore-jss/src/templates/nextjs-personalize/src/lib/site-resolver/plugins/default.ts
@@ -1,4 +1,5 @@
-import { SiteInfo, tryParseEnvValue } from '@sitecore-jss/sitecore-jss-nextjs/middleware';
+import { SiteInfo } from '@sitecore-jss/sitecore-jss-nextjs/site';
+import { tryParseEnvValue } from '@sitecore-jss/sitecore-jss-nextjs/utils';
 import config from 'temp/config';
 import { SiteResolverPlugin } from '..';
 
diff --git a/packages/create-sitecore-jss/src/templates/nextjs-styleguide-tracking/src/Navigation.tsx b/packages/create-sitecore-jss/src/templates/nextjs-styleguide-tracking/src/Navigation.tsx
index 0b6a4f91d2..5a99606061 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs-styleguide-tracking/src/Navigation.tsx
+++ b/packages/create-sitecore-jss/src/templates/nextjs-styleguide-tracking/src/Navigation.tsx
@@ -1,6 +1,6 @@
 import Link from 'next/link';
 import { useI18n } from 'next-localization';
-import { getPublicUrl } from '@sitecore-jss/sitecore-jss-nextjs';
+import { getPublicUrl } from '@sitecore-jss/sitecore-jss-nextjs/utils';
 
 // Prefix public assets with a public URL to enable compatibility with Sitecore Experience Editor.
 // If you're not supporting the Experience Editor, you can remove this.
diff --git a/packages/create-sitecore-jss/src/templates/nextjs-styleguide/src/Navigation.tsx b/packages/create-sitecore-jss/src/templates/nextjs-styleguide/src/Navigation.tsx
index 00a690262f..946876672f 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs-styleguide/src/Navigation.tsx
+++ b/packages/create-sitecore-jss/src/templates/nextjs-styleguide/src/Navigation.tsx
@@ -1,6 +1,6 @@
 import Link from 'next/link';
 import { useI18n } from 'next-localization';
-import { getPublicUrl } from '@sitecore-jss/sitecore-jss-nextjs';
+import { getPublicUrl } from '@sitecore-jss/sitecore-jss-nextjs/utils';
 
 // Prefix public assets with a public URL to enable compatibility with Sitecore Experience Editor.
 // If you're not supporting the Experience Editor, you can remove this.
diff --git a/packages/create-sitecore-jss/src/templates/nextjs-styleguide/src/components/graphql/GraphQL-ConnectedDemo.dynamic.tsx b/packages/create-sitecore-jss/src/templates/nextjs-styleguide/src/components/graphql/GraphQL-ConnectedDemo.dynamic.tsx
index 0f7c56572e..e6722af6e1 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs-styleguide/src/components/graphql/GraphQL-ConnectedDemo.dynamic.tsx
+++ b/packages/create-sitecore-jss/src/templates/nextjs-styleguide/src/components/graphql/GraphQL-ConnectedDemo.dynamic.tsx
@@ -7,8 +7,10 @@ import {
   constants,
   GraphQLRequestClient,
   withDatasourceCheck,
-  resetEditorChromes,
 } from '@sitecore-jss/sitecore-jss-nextjs';
+import {
+  resetEditorChromes
+} from '@sitecore-jss/sitecore-jss-nextjs/utils';
 import NextLink from 'next/link';
 import { ConnectedDemoQueryDocument } from './GraphQL-ConnectedDemo.dynamic.graphql';
 import {
diff --git a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/Layout.tsx b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/Layout.tsx
index 83835113f8..3d4800e3d3 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/Layout.tsx
+++ b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/Layout.tsx
@@ -5,11 +5,11 @@ import React from 'react';
 import Head from 'next/head';
 import {
   Placeholder,
-  getPublicUrl,
   LayoutServiceData,
   Field,
   HTMLLink,
 } from '@sitecore-jss/sitecore-jss-nextjs';
+import { getPublicUrl } from '@sitecore-jss/sitecore-jss-nextjs/utils';
 import Scripts from 'src/Scripts';
 
 // Prefix public assets with a public URL to enable compatibility with Sitecore Experience Editor.
diff --git a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/pages/api/sitemap.ts b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/pages/api/sitemap.ts
index 3d3e0eca10..98b45e1530 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/pages/api/sitemap.ts
+++ b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/pages/api/sitemap.ts
@@ -1,5 +1,6 @@
 import type { NextApiRequest, NextApiResponse } from 'next';
-import { AxiosDataFetcher, GraphQLSitemapXmlService, getPublicUrl, AxiosResponse } from '@sitecore-jss/sitecore-jss-nextjs';
+import { AxiosDataFetcher, GraphQLSitemapXmlService, AxiosResponse } from '@sitecore-jss/sitecore-jss-nextjs';
+import { getPublicUrl } from '@sitecore-jss/sitecore-jss-nextjs/utils';
 import { siteResolver } from 'lib/site-resolver';
 import config from 'temp/config';
 
diff --git a/packages/create-sitecore-jss/src/templates/nextjs/next.config.js b/packages/create-sitecore-jss/src/templates/nextjs/next.config.js
index f1a4f5901b..68a38d992e 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs/next.config.js
+++ b/packages/create-sitecore-jss/src/templates/nextjs/next.config.js
@@ -1,5 +1,5 @@
 const jssConfig = require('./src/temp/config');
-const { getPublicUrl } = require('@sitecore-jss/sitecore-jss-nextjs');
+const { getPublicUrl } = require('@sitecore-jss/sitecore-jss-nextjs/utils');
 const plugins = require('./src/temp/next-config-plugins') || {};
 
 const publicUrl = getPublicUrl();
diff --git a/packages/create-sitecore-jss/src/templates/nextjs/src/Layout.tsx b/packages/create-sitecore-jss/src/templates/nextjs/src/Layout.tsx
index c888ee3812..c3679bd1b0 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs/src/Layout.tsx
+++ b/packages/create-sitecore-jss/src/templates/nextjs/src/Layout.tsx
@@ -2,11 +2,11 @@ import React from 'react';
 import Head from 'next/head';
 import {
   Placeholder,
-  getPublicUrl,
   LayoutServiceData,
   Field,
   HTMLLink,
 } from '@sitecore-jss/sitecore-jss-nextjs';
+import { getPublicUrl } from '@sitecore-jss/sitecore-jss-nextjs/utils';
 import Navigation from 'src/Navigation';
 import Scripts from 'src/Scripts';
 
diff --git a/packages/create-sitecore-jss/src/templates/nextjs/src/Navigation.tsx b/packages/create-sitecore-jss/src/templates/nextjs/src/Navigation.tsx
index 5eb5aa69e3..e7ee30e853 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs/src/Navigation.tsx
+++ b/packages/create-sitecore-jss/src/templates/nextjs/src/Navigation.tsx
@@ -1,4 +1,4 @@
-import { getPublicUrl } from '@sitecore-jss/sitecore-jss-nextjs';
+import { getPublicUrl } from '@sitecore-jss/sitecore-jss-nextjs/utils';
 
 // Prefix public assets with a public URL to enable compatibility with Sitecore editors.
 // If you're not supporting Sitecore editors, you can remove this.
diff --git a/packages/create-sitecore-jss/src/templates/nextjs/src/lib/site-resolver/index.ts b/packages/create-sitecore-jss/src/templates/nextjs/src/lib/site-resolver/index.ts
index 9a7c011193..9cc5964fa6 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs/src/lib/site-resolver/index.ts
+++ b/packages/create-sitecore-jss/src/templates/nextjs/src/lib/site-resolver/index.ts
@@ -1,4 +1,4 @@
-import { SiteInfo, SiteResolver } from '@sitecore-jss/sitecore-jss-nextjs/middleware';
+import { SiteInfo, SiteResolver } from '@sitecore-jss/sitecore-jss-nextjs/site';
 import * as plugins from 'temp/site-resolver-plugins';
 
 /*
diff --git a/packages/create-sitecore-jss/src/templates/nextjs/src/lib/site-resolver/plugins/default.ts b/packages/create-sitecore-jss/src/templates/nextjs/src/lib/site-resolver/plugins/default.ts
index 8f8531b17a..45cd4e034c 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs/src/lib/site-resolver/plugins/default.ts
+++ b/packages/create-sitecore-jss/src/templates/nextjs/src/lib/site-resolver/plugins/default.ts
@@ -1,4 +1,4 @@
-import { SiteInfo } from '@sitecore-jss/sitecore-jss-nextjs/middleware';
+import { SiteInfo } from '@sitecore-jss/sitecore-jss-nextjs/site';
 import config from 'temp/config';
 import { SiteResolverPlugin } from '..';
 
diff --git a/packages/create-sitecore-jss/src/templates/nextjs/src/pages/[[...path]].tsx b/packages/create-sitecore-jss/src/templates/nextjs/src/pages/[[...path]].tsx
index 6b65abdc53..ac95326bea 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs/src/pages/[[...path]].tsx
+++ b/packages/create-sitecore-jss/src/templates/nextjs/src/pages/[[...path]].tsx
@@ -10,12 +10,12 @@ import {
   RenderingType,
   SitecoreContext,
   ComponentPropsContext,
-  handleEditorFastRefresh,
   EditingComponentPlaceholder,
   <% if (prerender === 'SSG') { -%>
   StaticPath,
   <% } -%>
 } from '@sitecore-jss/sitecore-jss-nextjs';
+import { handleEditorFastRefresh } from '@sitecore-jss/sitecore-jss-nextjs/utils';
 import { SitecorePageProps } from 'lib/page-props';
 import { sitecorePagePropsFactory } from 'lib/page-props-factory';
 // different componentFactory method will be used based on whether page is being edited
diff --git a/packages/sitecore-jss-nextjs/site.d.ts b/packages/sitecore-jss-nextjs/site.d.ts
new file mode 100644
index 0000000000..877b126c34
--- /dev/null
+++ b/packages/sitecore-jss-nextjs/site.d.ts
@@ -0,0 +1 @@
+export * from './types/site/index';
diff --git a/packages/sitecore-jss-nextjs/site.js b/packages/sitecore-jss-nextjs/site.js
new file mode 100644
index 0000000000..6e8bf57d82
--- /dev/null
+++ b/packages/sitecore-jss-nextjs/site.js
@@ -0,0 +1 @@
+module.exports = require('./dist/cjs/site/index');
diff --git a/packages/sitecore-jss-nextjs/src/editing/editing-data-middleware.ts b/packages/sitecore-jss-nextjs/src/editing/editing-data-middleware.ts
index 31ec96ab27..7f53003880 100644
--- a/packages/sitecore-jss-nextjs/src/editing/editing-data-middleware.ts
+++ b/packages/sitecore-jss-nextjs/src/editing/editing-data-middleware.ts
@@ -2,7 +2,7 @@ import { NextApiRequest, NextApiResponse } from 'next';
 import { EditingDataCache, editingDataDiskCache } from './editing-data-cache';
 import { EditingData, isEditingData } from './editing-data';
 import { QUERY_PARAM_EDITING_SECRET } from './editing-data-service';
-import { getJssEditingSecret } from '../utils';
+import { getJssEditingSecret } from '../utils/utils';
 
 export interface EditingDataMiddlewareConfig {
   /**
diff --git a/packages/sitecore-jss-nextjs/src/editing/editing-data-service.ts b/packages/sitecore-jss-nextjs/src/editing/editing-data-service.ts
index f660dd6f45..d6a51f9b0e 100644
--- a/packages/sitecore-jss-nextjs/src/editing/editing-data-service.ts
+++ b/packages/sitecore-jss-nextjs/src/editing/editing-data-service.ts
@@ -1,7 +1,7 @@
 import { AxiosDataFetcher, debug } from '@sitecore-jss/sitecore-jss';
 import { EditingData } from './editing-data';
 import { EditingDataCache, editingDataDiskCache } from './editing-data-cache';
-import { getJssEditingSecret } from '../utils';
+import { getJssEditingSecret } from '../utils/utils';
 import { PreviewData } from 'next';
 
 export const QUERY_PARAM_EDITING_SECRET = 'secret';
diff --git a/packages/sitecore-jss-nextjs/src/editing/editing-render-middleware.ts b/packages/sitecore-jss-nextjs/src/editing/editing-render-middleware.ts
index d546285f64..b38ba79a82 100644
--- a/packages/sitecore-jss-nextjs/src/editing/editing-render-middleware.ts
+++ b/packages/sitecore-jss-nextjs/src/editing/editing-render-middleware.ts
@@ -9,7 +9,7 @@ import {
   editingDataService,
   QUERY_PARAM_EDITING_SECRET,
 } from './editing-data-service';
-import { getJssEditingSecret } from '../utils';
+import { getJssEditingSecret } from '../utils/utils';
 
 export interface EditingRenderMiddlewareConfig {
   /**
diff --git a/packages/sitecore-jss-nextjs/src/index.ts b/packages/sitecore-jss-nextjs/src/index.ts
index 57152f1504..ea9450d379 100644
--- a/packages/sitecore-jss-nextjs/src/index.ts
+++ b/packages/sitecore-jss-nextjs/src/index.ts
@@ -11,12 +11,38 @@ export {
   HTMLLink,
   enableDebug,
 } from '@sitecore-jss/sitecore-jss';
-export {
-  isEditorActive,
-  resetEditorChromes,
-  resolveUrl,
-  tryParseEnvValue,
+
+// we will remove the root exports for these later
+// we cannot mark exports as deprected directly, so we're using this hack instead
+import {
+  isEditorActive as isEditorActiveDep,
+  resetEditorChromes as resetEditorChromesDep,
+  resolveUrl as resolveUrlDep,
+  tryParseEnvValue as tryParseEnvValueDep,
 } from '@sitecore-jss/sitecore-jss/utils';
+import {
+  handleEditorFastRefresh as handleEditorFastRefreshDep,
+  getPublicUrl as getPublicUrlDep,
+} from './utils';
+/** @deprecated use import from '@sitecore-jss/sitecore-jss-nextjs/utils' instead */
+const {
+  isEditorActiveDep: isEditorActive,
+  resetEditorChromesDep: resetEditorChromes,
+  resolveUrlDep: resolveUrl,
+  tryParseEnvValueDep: tryParseEnvValue,
+  handleEditorFastRefreshDep: handleEditorFastRefresh,
+  getPublicUrlDep: getPublicUrl,
+} = {
+  isEditorActiveDep,
+  resetEditorChromesDep,
+  resolveUrlDep,
+  tryParseEnvValueDep,
+  handleEditorFastRefreshDep,
+  getPublicUrlDep,
+};
+export { handleEditorFastRefresh, getPublicUrl };
+export { isEditorActive, resetEditorChromes, resolveUrl, tryParseEnvValue };
+
 export {
   LayoutService,
   LayoutServiceData,
@@ -119,8 +145,6 @@ export {
   useComponentProps,
 } from './components/ComponentPropsContext';
 
-export { handleEditorFastRefresh, getPublicUrl } from './utils';
-
 export { Link, LinkProps } from './components/Link';
 export { RichText, RichTextProps } from './components/RichText';
 export { Placeholder } from './components/Placeholder';
diff --git a/packages/sitecore-jss-nextjs/src/middleware/index.ts b/packages/sitecore-jss-nextjs/src/middleware/index.ts
index 5c91e1946e..b9c1ecf305 100644
--- a/packages/sitecore-jss-nextjs/src/middleware/index.ts
+++ b/packages/sitecore-jss-nextjs/src/middleware/index.ts
@@ -1,5 +1,3 @@
 export { RedirectsMiddleware, RedirectsMiddlewareConfig } from './redirects-middleware';
 export { PersonalizeMiddleware, PersonalizeMiddlewareConfig } from './personalize-middleware';
 export { MultisiteMiddleware, MultisiteMiddlewareConfig } from './multisite-middleware';
-export { SiteResolver, SiteInfo } from '@sitecore-jss/sitecore-jss/site';
-export { tryParseEnvValue } from '@sitecore-jss/sitecore-jss/utils';
diff --git a/packages/sitecore-jss-nextjs/src/site/index.ts b/packages/sitecore-jss-nextjs/src/site/index.ts
new file mode 100644
index 0000000000..ca91a76914
--- /dev/null
+++ b/packages/sitecore-jss-nextjs/src/site/index.ts
@@ -0,0 +1 @@
+export { SiteResolver, SiteInfo } from '@sitecore-jss/sitecore-jss/site';
diff --git a/packages/sitecore-jss-nextjs/src/utils/index.ts b/packages/sitecore-jss-nextjs/src/utils/index.ts
new file mode 100644
index 0000000000..bb06217af3
--- /dev/null
+++ b/packages/sitecore-jss-nextjs/src/utils/index.ts
@@ -0,0 +1,7 @@
+export { getPublicUrl, handleEditorFastRefresh } from './utils';
+export {
+  tryParseEnvValue,
+  isEditorActive,
+  resetEditorChromes,
+  resolveUrl,
+} from '@sitecore-jss/sitecore-jss/utils';
diff --git a/packages/sitecore-jss-nextjs/src/utils.test.ts b/packages/sitecore-jss-nextjs/src/utils/utils.test.ts
similarity index 100%
rename from packages/sitecore-jss-nextjs/src/utils.test.ts
rename to packages/sitecore-jss-nextjs/src/utils/utils.test.ts
diff --git a/packages/sitecore-jss-nextjs/src/utils.ts b/packages/sitecore-jss-nextjs/src/utils/utils.ts
similarity index 100%
rename from packages/sitecore-jss-nextjs/src/utils.ts
rename to packages/sitecore-jss-nextjs/src/utils/utils.ts
diff --git a/packages/sitecore-jss-nextjs/tsconfig.json b/packages/sitecore-jss-nextjs/tsconfig.json
index 1ab721015b..e103177d08 100644
--- a/packages/sitecore-jss-nextjs/tsconfig.json
+++ b/packages/sitecore-jss-nextjs/tsconfig.json
@@ -17,6 +17,8 @@
     "middleware.d.ts",
     "editing.d.ts",
     "monitoring.d.ts",
+    "site.d.ts",
+    "utils.d.ts",
     "src/tests/*",
     "src/test-data/*",
     "**/*.test.ts",
diff --git a/packages/sitecore-jss-nextjs/utils.d.ts b/packages/sitecore-jss-nextjs/utils.d.ts
new file mode 100644
index 0000000000..1c13daa98d
--- /dev/null
+++ b/packages/sitecore-jss-nextjs/utils.d.ts
@@ -0,0 +1 @@
+export * from './types/utils/index';
diff --git a/packages/sitecore-jss-nextjs/utils.js b/packages/sitecore-jss-nextjs/utils.js
new file mode 100644
index 0000000000..e8b89d3406
--- /dev/null
+++ b/packages/sitecore-jss-nextjs/utils.js
@@ -0,0 +1 @@
+module.exports = require('./dist/cjs/utils/index');