Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/styxlab/next-cms-ghost

Publish flaring fast blogs with Next.js and Ghost CMS
https://github.com/styxlab/next-cms-ghost

blogging casper cms-ghost gatsby-alternative ghost-blog ghost-theme image-optimization lighthouse nextjs nextjs-blog nextjs-serverless nextjs-starter react static-site-generator typescript

Last synced: about 1 month ago
JSON representation

Publish flaring fast blogs with Next.js and Ghost CMS

Host: GitHub
URL: https://github.com/styxlab/next-cms-ghost
Owner: styxlab
License: mit
Created: 2020-11-11T15:39:01.000Z (almost 4 years ago)
Default Branch: master
Last Pushed: 2023-08-01T08:09:32.000Z (about 1 year ago)
Last Synced: 2024-04-14T09:04:49.796Z (5 months ago)
Topics: blogging, casper, cms-ghost, gatsby-alternative, ghost-blog, ghost-theme, image-optimization, lighthouse, nextjs, nextjs-blog, nextjs-serverless, nextjs-starter, react, static-site-generator, typescript
Language: TypeScript
Homepage: https://next.jamify.org
Size: 1.5 MB
Stars: 653
Watchers: 18
Forks: 201
Open Issues: 8
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE

Awesome Lists containing this project

Awesome-NextJs - next-cms-ghost - [demo](https://next.jamify.org/) (Nextjs Templates)
jimsghstars - styxlab/next-cms-ghost - Publish flaring fast blogs with Next.js and Ghost CMS (TypeScript)

README

![next-cms-ghost](https://static.gotsby.org/v1/assets/images/next-ghost.png)

# next-cms-ghost

[![PRs welcome!](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)]()

#### The fastest React frontend for headless Ghost CMS.

Create and publish flaring fast blogs with next-cms-ghost. Powered by the React framework Next.js and content fed by headless Ghost, you'll get a production ready hybrid frontend that combines the best of static and server-rendered sites. Most importantly, your website can be easily distributed globally to be served from the edge. At the same time your content creators can continue to work with the Ghost authoring system they are used to.

## ✨ Features

Ghost CMS integration

Supports Ghost `v3` and `v4`

Ghost Casper look & feel

Infinite scroll

Fully responsive

Sticky navigation headers

Hover on author avatar

Styled 404 page

Preview Section in posts

Sitemap

RSS feed

SEO optimized

Extened Casper Styles ✨

Dark Mode

Featured posts pinned on top

Customizable navigation headers

Zoom images on click to full-screen

Render GitHub Gists

Images with Next/Images 🚀

Feature and inline images

Auto-optimized images

No content shifts due to consistent placeholders

Advanced Routing

Auto-detects custom paths

Configurable collections

Developer friendly

MIT licenced

Truly open-source

Easy to contribute

Made typesafe with TypeScript

Integrated Plugins

Member Subscriptions

Commenting with Commento or Disqus

Syntax highlighting with PrismJS

Table Of Contents

Contact Page with built-in notification service

Google Analytics

NextJS Features

Incremental Regeneration

Support for Preview

## 🚀 Performance

![Lighthouse Score](https://static.gotsby.org/v1/assets/images/jamify-lh-scores-light.gif)

^{Scores calculated with Lighthouse 6.4.0.}

## 🏁 Getting Started

```bash
git clone https://github.com/styxlab/next-cms-ghost.git
cd next-cms-ghost
yarn

# Development
yarn dev

# Production
yarn build
```

## 🌀 NextJS image optimizations

The `IMAGE_DOMAINS` environment variable must contain a comma separated list of all domains that you use for in-sourcing images. For example:

```
IMAGE_DOMAINS=res.cloudinary.com,yoursource.imgix.net
```

> Image optimization is automatically turned off when deploying to Netlify, because it is currently on supported on Netlify.

## 🌎 Domain Settings

The `SITE_URL` environment variable should be set to the public facing URL of your site, in most cases to your custom domain.

| Key | Value (example) |
| -------- | ------------------------- |
| SITE_URL | https://www.your-blog.org |

If you don't specify `SITE_URL`, it will get populated according to the following defaults:

| Platform | System Value | Conditions |
| -------- | ------------ | ------------------------------------------------------------------- |
| Vercel | VERCEL_URL | _Automatically expose System Environment Variables_ must be checked |
| Netlify | URL | |

In all other cases `SITE_URL` is set to `http://localhost:3000`.

## 🔑 Ghost Content API keys

All content is sourced from a Ghost CMS. Choose the method according to your build scenario.

### Building locally

Create a new text file `.env.local` in the project root folder with the following content:

```
CMS_GHOST_API_URL=http://localhost:2368
CMS_GHOST_API_KEY=9fccdb0e4ea5b572e2e5b92942
```

Change `CMS_GHOST_API_URL` and `CMS_GHOST_API_KEY` with the values that you can generate in your Ghost Admin under `Integrations`.

### Building with cloud providers

If you build your project with a cloud provider, the best option is to provide the keys with environment variables:

| Key | Value (example) |
| ----------------- | ---------------------------- |
| CMS_GHOST_API_URL | https:\/\/your-ghost-cms.org |
| CMS_GHOST_API_KEY | 9fccdb0e4ea5b572e2e5b92942 |

## 💫 Deploy

For best results, deploying to Vercel is recommended. As an alternative, you can also deploy to Netlify.

[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/git/external?repository-url=https%3A%2F%2Fgithub.com%2Fstyxlab%2Fnext-cms-ghost&project-name=next-cms-ghost&repository-name=next-cms-ghost)

[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/styxlab/next-cms-ghost&utm_source=github)

## 🤯 Ensure headless mode of Ghost CMS

For best SEO results it is strongly recommended to disable the default Ghost Handlebars theme front-end by selecting the _Make this site private_ flag within your Ghost admin settings.

## 💣 Reporting issues

Please report all bugs and issues at [next-cms-ghost/issues](https://github.com/styxlab/next-cms-ghost/issues).

## 🎈 Contributions

PRs are welcome! Consider contributing to this project if you want to make a better web.

Special thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):

_{Vince Fulco}
📖

_{Manuel Taberna}
🌍

_{Akshat Mittal}
💻

_{christianlauer}
🐛

_{Rahul Suresh}
🐛

_{Miguel Bernard}
💻

_{Stevan Aji}
💻

_{Toan Le}
🐛

_{Davor Budimir}
🐛

_{Simon Holdorf}
🐛

_{Sumit Kumar}
🐛

_francolamcn
🐛

_{Charles Chan}
💻

_{Raihan Ameen}
🐛

_{Andy Grunwald}
📖

_Hikz
💻

_Huy
🐛

_{Laurent Meyer}
💻

_Garfounkel
💻

_{Orleando Dassi}
💻

_{Flavio Li Volsi}
💻

_{Nat Ring}
💻

_{VITOR PEREIRA}
💻