Staging

.env.local.sample

@@ -12,8 +12,12 @@ CONTENTSTACK_API_HOST=
 CONTENTSTACK_APP_HOST=
 CONTENTSTACK_LIVE_PREVIEW=true
 
+#site-map
+NEXT_PUBLIC_HOSTED_URL=http://localhost:3000
+# Requires host url for sitemap. Localhost:3000 is set as default value
+
 # For enabling live editing tags for this project set NEXT_PUBLIC_CONTENTSTACK_LIVE_PREVIEW=true by default it is set to false
 # For NA region add CONTENTSTACK_APP_HOST=app.contentstack.com
 # For EU region add CONTENTSTACK_APP_HOST=eu-app.contentstack.com
 # For setting region add  CONTENTSTACK_REGION=(Optional for US region) Eg- eu
-# For setting custom host add CONTENTSTACK_API_HOST=for(NA: api.contentstack.io, EU: eu-api.contentstack.com)
+# For setting custom host add CONTENTSTACK_API_HOST=for(NA: api.contentstack.io, EU: eu-api.contentstack.com)

.eslintrc.json

@@ -0,0 +1,10 @@
+{
+  "extends": ["next/babel","next/core-web-vitals"],
+  "rules": {
+    "@next/next/no-page-custom-font":"off",
+    "@next/next/no-sync-scripts":"off",
+    "@next/next/no-img-element":"off",
+    "react-hooks/exhaustive-deps":"off",
+    "import/no-anonymous-default-export":"off"
+  }
+}

helper/index.js

@@ -17,6 +17,13 @@ export const getFooterRes = async () => {
   return response[0][0];
 };
 
+export const getAllEntries =async () =>{
+  const response = await Stack.getEntry({
+    contentTypeUid:'page'
+  })
+  return response[0]
+}
+
 export const getHomeRes = async (entryUrl) => {
   const response = await Stack.getEntryByUrl({
     contentTypeUid: 'page',

package.json

@@ -1,14 +1,14 @@
 {
   "name": "contentstack-nextjs-starter-app",
   "description": "A starter app for Contentstack and Nextjs",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "private": true,
   "author": "Contentstack",
   "scripts": {
     "dev": "next dev",
     "build": "next build",
     "start": "next start",
-    "lint": "eslint pages/**/*.js"
+    "lint": "eslint pages/**/*.jsx"
   },
   "dependencies": {
     "@contentstack/live-preview-utils": "^1.0.1",
@@ -24,16 +24,7 @@
     "react-json-view": "^1.21.3"
   },
   "devDependencies": {
-    "babel-core": "^6.26.3",
-    "babel-eslint": "^10.1.0",
-    "eslint": "^7.32.0",
-    "eslint-config-airbnb": "^19.0.4",
-    "eslint-config-prettier": "^8.3.0",
-    "eslint-plugin-import": "^2.24.2",
-    "eslint-plugin-jsx-a11y": "^6.1.0",
-    "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-react": "^7.26.1",
-    "prettier": "^2.5.1",
-    "prettier-eslint": "^13.0.0"
+    "eslint": "^8.10.0",
+    "eslint-config-next": "^12.1.0"
   }
 }

pages/blog/[...post].jsx

@@ -44,7 +44,7 @@ export default function BlogPost(props) {
     onEntryChange(() => {
       if (CONTENTSTACK_LIVE_PREVIEW === 'true') fetchData();
     });
-  }, []);
+  }, [result]);
 
   return (
     <Layout

pages/blog/index.jsx

@@ -16,15 +16,13 @@ import {
 import ArchiveRelative from '../../components/archive-relative';
 
 export default function Blog(props) {
-  const {
-    archived, blog, blogList, header, footer, entryUrl,
-  } = props;
+  const { archived, blog, blogList, header, footer, entryUrl } = props;
   const list = blogList.concat(archived);
   const { CONTENTSTACK_LIVE_PREVIEW } = getConfig().publicRuntimeConfig;
   const [getHeader, setHeader] = useState(header);
   const [getFooter, setFooter] = useState(footer);
-  const [getArchived, setArchived] = useState(archived);
-  const [getList, setList] = useState(blogList);
+  const [getArchived] = useState(archived);
+  const [getList] = useState(blogList);
   const [getBanner, setBanner] = useState(blog);
 
   async function fetchData() {
@@ -58,41 +56,41 @@ export default function Blog(props) {
         <RenderComponents
           pageComponents={getBanner.page_components}
           blogsPage
-          contentTypeUid="page"
+          contentTypeUid='page'
           entryUid={getBanner.uid}
           locale={getBanner.locale}
         />
       )}
 
-      <div className="blog-container">
-        <div className="blog-column-left">
+      <div className='blog-container'>
+        <div className='blog-column-left'>
           {getList?.map((bloglist, index) => (
-            <div className="blog-list" key={index}>
+            <div className='blog-list' key={index}>
               {bloglist.featured_image && (
                 <Link href={bloglist.url}>
                   <a>
                     <img
-                      alt="blog img"
-                      className="blog-list-img"
+                      alt='blog img'
+                      className='blog-list-img'
                       src={bloglist.featured_image.url}
                     />
                   </a>
                 </Link>
               )}
-              <div className="blog-content">
+              <div className='blog-content'>
                 {bloglist.title && (
                   <Link href={bloglist.url}>
-                    <h3>{bloglist.title}</h3>
+                    <a>
+                      <h3>{bloglist.title}</h3>
+                    </a>
                   </Link>
                 )}
                 <p>
-                  {moment(bloglist.date).format('ddd, MMM D YYYY')}
-                  ,
-                  {' '}
+                  {moment(bloglist.date).format('ddd, MMM D YYYY')},{' '}
                   <strong>{bloglist.author[0].title}</strong>
                 </p>
-                {typeof bloglist.body === 'string'
-                  && parse(bloglist.body.slice(0, 300))}
+                {typeof bloglist.body === 'string' &&
+                  parse(bloglist.body.slice(0, 300))}
                 {bloglist.url ? (
                   <Link href={bloglist.url}>
                     <a>
@@ -106,12 +104,9 @@ export default function Blog(props) {
             </div>
           ))}
         </div>
-        <div className="blog-column-right">
+        <div className='blog-column-right'>
           {getBanner.page_components[1].widget && (
-            <h2>
-              {getBanner.page_components[1].widget.title_h2}
-              {' '}
-            </h2>
+            <h2>{getBanner.page_components[1].widget.title_h2} </h2>
           )}
           <ArchiveRelative blogs={getArchived} />
         </div>

pages/sitemap.xml.jsx

@@ -0,0 +1,43 @@
+import { getAllEntries, getBlogListRes } from '../helper/index';
+
+const Sitemap = () => {
+  return null;
+};
+
+export const getServerSideProps = async ({ res }) => {
+  const baseUrl = process.env.NEXT_PUBLIC_HOSTED_URL || 'http://localhost:3000';
+
+  let pages = await getAllEntries();
+  let posts = await getBlogListRes();
+
+  const allPages = pages.map((page) => `${baseUrl}${page.url}`);
+  const allPosts = posts.map((post) => `${baseUrl}${post.url}`);
+  const siteMapList = [...allPages, ...allPosts].sort();
+
+  const sitemap = `<?xml version="1.0" encoding="UTF-8"?>
+    <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+      ${siteMapList
+        .map((url) => {
+          return `
+          <url>
+              <loc>${url}</loc>
+              <lastmod>${new Date().toISOString()}</lastmod>
+              <changefreq>monthly</changefreq>
+              <priority>1.0</priority>
+            </url>
+          `;
+        })
+        .join('')}
+    </urlset>
+  `;
+
+  res.setHeader('Content-Type', 'text/xml');
+  res.write(sitemap);
+  res.end();
+
+  return {
+    props: {},
+  };
+};
+
+export default Sitemap;