diff --git a/CHANGELOG.md b/CHANGELOG.md
index d2060f2726..ded617f06b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -25,6 +25,7 @@ Our versioning strategy is as follows:
 ### 🧹 Chores
 
 * Upgrade to Node.js 20.x ([#1679](https://github.com/Sitecore/jss/pull/1679))([#1681](https://github.com/Sitecore/jss/pull/1681))
+* `[nextjs/template]` Upgrade graphql-codegen packages to latest ([#1711](https://github.com/Sitecore/jss/pull/1711))
 
 ## 21.6.0
 
diff --git a/packages/create-sitecore-jss/src/templates/nextjs/package.json b/packages/create-sitecore-jss/src/templates/nextjs/package.json
index 88381c0784..b788bb0ac9 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs/package.json
+++ b/packages/create-sitecore-jss/src/templates/nextjs/package.json
@@ -34,14 +34,14 @@
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@graphql-codegen/cli": "^1.21.8",
-    "@graphql-codegen/import-types-preset": "^2.2.6",
-    "@graphql-codegen/plugin-helpers": "^3.1.2",
-    "@graphql-codegen/typed-document-node": "^2.3.12",
-    "@graphql-codegen/typescript": "^2.8.7",
-    "@graphql-codegen/typescript-operations": "^2.5.12",
-    "@graphql-codegen/typescript-resolvers": "^2.7.12",
-    "@graphql-typed-document-node/core": "^3.1.1",
+    "@graphql-codegen/cli": "^5.0.0",
+    "@graphql-codegen/import-types-preset": "^3.0.0",
+    "@graphql-codegen/plugin-helpers": "^5.0.1",
+    "@graphql-codegen/typed-document-node": "^5.0.1",
+    "@graphql-codegen/typescript": "^4.0.1",
+    "@graphql-codegen/typescript-operations": "^4.0.1",
+    "@graphql-codegen/typescript-resolvers": "^4.0.1",
+    "@graphql-typed-document-node/core": "^3.2.0",
     "@sitecore-jss/sitecore-jss-cli": "~21.7.0-canary",
     "@sitecore-jss/sitecore-jss-dev-tools": "~21.7.0-canary",
     "@types/node": "^18.11.18",