Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update blog-starter example #11071

Merged
merged 10 commits into from
Mar 18, 2020

Conversation

timneutkens
Copy link
Member

@timneutkens timneutkens commented Mar 14, 2020

Based on one of the CMS examples, but with Markdown from the filesystem as datasource 💯

Left to be done:

  • Readme guide

When creating more examples for other Headless CMSs, we need to modify the following:

  • README.md (the most time consuming part)
  • package.json - Update name and remove react-datocms
  • .env.example - Use different env variable names
  • next.config.js - Use different env variable names
  • lib/api.js
  • now.json
  • pages/index.js - Update getStaticProps
  • pages/posts/[slug].js - Update getStaticProps and getStaticPaths
  • pages/api/preview.js - Update the secret environment variable (NEXT_EXAMPLE_CMS_DATOCMS_PREVIEW_SECRET)
  • lib/constants.js - ogp image is created on https://og-image.now.sh (config)
  • lib/markdownToHtml.js - DatoCMS sends down markdown so we had to convert it to HTML, but might not be necessary for other CMSs
  • components/cover-image.js - Uses react-datocms to render progressive images.

Also, add to the "More Examples" section on:

  • docs/basic-features/pages.md
  • docs/basic-features/data-fetching.md
  • docs/advanced-features/preview-mode.md

@ijjk
Copy link
Member

ijjk commented Mar 14, 2020

Stats from current PR

Default Server Mode
General
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
buildDuration 9.4s 9.8s ⚠️ +424ms
nodeModulesSize 56.6 MB 56.6 MB
Client Bundles (main, webpack, commons)
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
main-HASH.js gzip 5.77 kB 5.77 kB
webpack-HASH.js gzip 746 B 746 B
de003c3a9d30..8eb0.js gzip 9.78 kB 9.78 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 55.4 kB 55.4 kB
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
main-HASH.module.js gzip 4.78 kB 4.78 kB
webpack-HASH..dule.js gzip 746 B 746 B
de003c3a9d30..dule.js gzip 6.71 kB 6.71 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 51.4 kB 51.4 kB
Legacy Client Bundles (polyfills)
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
polyfills-HASH.js gzip 26.2 kB 26.2 kB
Overall change 26.2 kB 26.2 kB
Client Pages
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
_app.js gzip 1.09 kB 1.09 kB
_error.js gzip 2.97 kB 2.97 kB
hooks.js gzip 664 B 664 B
index.js gzip 222 B 222 B
link.js gzip 1.89 kB 1.89 kB
routerDirect.js gzip 279 B 279 B
withRouter.js gzip 278 B 278 B
Overall change 7.39 kB 7.39 kB
Client Pages Modern
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
_app.module.js gzip 594 B 594 B
_error.module.js gzip 2.08 kB 2.08 kB
hooks.module.js gzip 370 B 370 B
index.module.js gzip 212 B 212 B
link.module.js gzip 1.48 kB 1.48 kB
routerDirect..dule.js gzip 271 B 271 B
withRouter.m..dule.js gzip 270 B 270 B
Overall change 5.28 kB 5.28 kB
Client Build Manifests
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
_buildManifest.js gzip 61 B 61 B
_buildManife..dule.js gzip 61 B 61 B
Overall change 122 B 122 B
Rendered Page Sizes
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
index.html gzip 916 B 916 B
link.html gzip 925 B 925 B
withRouter.html gzip 913 B 913 B
Overall change 2.75 kB 2.75 kB

Serverless Mode (Increase detected ⚠️)
General
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
buildDuration 9.5s 9.5s -88ms
nodeModulesSize 56.6 MB 56.6 MB
Client Bundles (main, webpack, commons)
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
main-HASH.js gzip 5.77 kB 5.77 kB
webpack-HASH.js gzip 746 B 746 B
de003c3a9d30..8eb0.js gzip 9.78 kB 9.78 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 55.4 kB 55.4 kB
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
main-HASH.module.js gzip 4.78 kB 4.78 kB
webpack-HASH..dule.js gzip 746 B 746 B
de003c3a9d30..dule.js gzip 6.71 kB 6.71 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 51.4 kB 51.4 kB
Legacy Client Bundles (polyfills)
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
polyfills-HASH.js gzip 26.2 kB 26.2 kB
Overall change 26.2 kB 26.2 kB
Client Pages
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
_app.js gzip 1.09 kB 1.09 kB
_error.js gzip 2.97 kB 2.97 kB
hooks.js gzip 664 B 664 B
index.js gzip 222 B 222 B
link.js gzip 1.89 kB 1.89 kB
routerDirect.js gzip 279 B 279 B
withRouter.js gzip 278 B 278 B
Overall change 7.39 kB 7.39 kB
Client Pages Modern
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
_app.module.js gzip 594 B 594 B
_error.module.js gzip 2.08 kB 2.08 kB
hooks.module.js gzip 370 B 370 B
index.module.js gzip 212 B 212 B
link.module.js gzip 1.48 kB 1.48 kB
routerDirect..dule.js gzip 271 B 271 B
withRouter.m..dule.js gzip 270 B 270 B
Overall change 5.28 kB 5.28 kB
Client Build Manifests
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
_buildManifest.js gzip 61 B 61 B
_buildManife..dule.js gzip 61 B 61 B
Overall change 122 B 122 B
Serverless bundles Overall increase ⚠️
zeit/next.js canary timneutkens/next.js add/update-blog-starter Change
_error.js gzip 293 kB 294 kB ⚠️ +1.16 kB
404.html gzip 1.32 kB 1.32 kB
hooks.html gzip 957 B 957 B
index.js gzip 294 kB 294 kB -10 B
link.js gzip 301 kB 301 kB ⚠️ +139 B
routerDirect.js gzip 300 kB 300 kB ⚠️ +38 B
withRouter.js gzip 300 kB 299 kB -486 B
Overall change 1.49 MB 1.49 MB ⚠️ +836 B

@sandys
Copy link

sandys commented Mar 14, 2020

is it possible to avoid https://og-image.now.sh ? anything like https://www.gatsbyjs.org/packages/gatsby-remark-images/ that can process offline ?

@timneutkens
Copy link
Member Author

is it possible to avoid og-image.now.sh ? anything like gatsbyjs.org/packages/gatsby-remark-images that can process offline ?

og-image.now.sh is just a og-image generator we use at ZEIT, it has nothing to do with image processing in particular. You already have an open feature request and an open GitHub discussions thread so doesn't seem relevant to discuss that here.

@chibicode
Copy link
Member

Looks good, but which account is https://next-blog-starter.now.sh/ deployed to? I tweaked CSS and made it display excerpt, so it needs to be re-deployed.

@chibicode chibicode marked this pull request as ready for review March 17, 2020 23:08
@chibicode chibicode requested a review from Timer as a code owner March 17, 2020 23:08
@chibicode chibicode changed the title [WIP] Update blog-starter example Update blog-starter example Mar 17, 2020
@timneutkens timneutkens merged commit 88a6bb3 into vercel:canary Mar 18, 2020
@timneutkens timneutkens deleted the add/update-blog-starter branch March 18, 2020 08:43
@sandys
Copy link

sandys commented Mar 18, 2020

@timneutkens thank you for this update! would it be possible for you to illustrate pagination in here ?
there was an older question that got closed on pagination - #8197

it would be really helpful to see how that works with the new apis.

@brandonpittman
Copy link

@timneutkens Will there be another example that uses MDX instead of plain Markdown?

@vercel vercel locked as resolved and limited conversation to collaborators Jan 30, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants