Product
Introducing Ruby Support in Socket
Socket is launching Ruby support for all users. Enhance your Rails projects with AI-powered security scans for vulnerabilities and supply chain threats. Now in Beta!
next-tinacms-github
Advanced tools
This package provides helpers for managing the github auth token for requests, as well as providing helpers for loading content from the Github API.
This package provides helpers for managing the github auth token for requests, as well as providing helpers for loading content from the Github API.
npm install --save next-tinacms-github
or
yarn add next-tinacms-github
Any functions in the pages/api
directory are are mapped to /api/*
endpoints.
createCreateAccessTokenFn
Helper for creating a createCreateAccessToken
server function.
// pages/api/create-github-access-token.ts
import { createAuthHandler } from 'next-tinacms-github'
export default createAuthHandler(
process.env.GITHUB_CLIENT_ID,
process.env.GITHUB_CLIENT_SECRET,
process.env.SIGNING_KEY
)
See Next's documentation for adding environment variables
See below for instructions on creating a Github OAuth App to generate these Client ID & Client Secret variables.
The Signing Key should be a random 256-bit key, used server-side to encrypt and decrypt authentication tokens sent to the client.
You can generate a key by running openssl rand -base64 32
in your terminal, using the output as your Signing Key. You can read more on the topic here.
apiProxy
Proxies requests to GitHub, attaching the GitHub access token in the process
// pages/api/proxy-github.ts
import { apiProxy } from 'next-tinacms-github'
export default apiProxy(process.env.SIGNING_KEY)
previewHandler
Handles setting the the Nextjs preview data from your cookie data.
// pages/api/preview.ts
import { previewHandler } from 'next-tinacms-github'
export default previewHandler(process.env.SIGNING_KEY)
The preview
data, which gets set by calling your preview function, will be accesible through getStaticProps
throughout your app.
//Blog template [slug].ts
import {
getGithubPreviewProps
parseMarkdown,
} from 'next-tinacms-github'
// ...
export const getStaticProps: GetStaticProps = async function({
preview,
previewData,
...ctx
}) {
if (preview) {
return getGithubPreviewProps({
...previewData,
fileRelativePath: 'src/content/home.json',
parse: parseMarkdown
});
}
return {
props: {
sourceProvider: null,
error: null,
preview,
file: {
fileRelativePath: 'src/content/home.json',
data: (await import('../content/home.json')).default,
},
},
};
}
In GitHub, within your account Settings, click Oauth Apps under Developer Settings.
click "New Oauth App".
For the Authorization callback URL, enter the url for the "authorizing" page that you created above (e.g https://your-url/github/authorizing). Fill out the other fields with your custom values. Note: If you are testing your app locally, you may need a separate development Github app (with a localhost redirect), and a production Github app.
The generated Client ID & Client Secret will be consumed by the createCreateAccessTokenFn
defined above.
Now that we have configured our backend API functions to manage our Github authentication token, we will need to configure the front-end to use these endpoints. You may want to use the react-tinacms-github package.
FAQs
Unknown package
The npm package next-tinacms-github receives a total of 12 weekly downloads. As such, next-tinacms-github popularity was classified as not popular.
We found that next-tinacms-github demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 11 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Product
Socket is launching Ruby support for all users. Enhance your Rails projects with AI-powered security scans for vulnerabilities and supply chain threats. Now in Beta!
Product
Ensure open-source compliance with Socket’s License Enforcement Beta. Set up your License Policy and secure your software!
Product
We're launching a new set of license analysis and compliance features for analyzing, managing, and complying with licenses across a range of supported languages and ecosystems.