Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/markdoc/markdoc
A powerful, flexible, Markdown-based authoring framework.
https://github.com/markdoc/markdoc
authoring documentation markdoc markdown react toolchain
Last synced: 5 days ago
JSON representation
A powerful, flexible, Markdown-based authoring framework.
- Host: GitHub
- URL: https://github.com/markdoc/markdoc
- Owner: markdoc
- License: mit
- Created: 2022-05-09T17:50:46.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-05-15T16:17:18.000Z (8 months ago)
- Last Synced: 2024-05-16T05:10:17.303Z (8 months ago)
- Topics: authoring, documentation, markdoc, markdown, react, toolchain
- Language: TypeScript
- Homepage: https://markdoc.dev
- Size: 202 KB
- Stars: 7,023
- Watchers: 29
- Forks: 150
- Open Issues: 19
-
Metadata Files:
- Readme: README.md
- Contributing: .github/CONTRIBUTING.md
- License: LICENSE
- Code of conduct: .github/CODE_OF_CONDUCT.md
Awesome Lists containing this project
- awesome - markdoc/markdoc - A powerful, flexible, Markdown-based authoring framework. (TypeScript)
- awesome - markdoc/markdoc - A powerful, flexible, Markdown-based authoring framework. (TypeScript)
- Awesome - Markdoc - A Markdown-based authoring system (Development / VoIP)
- awesome - markdoc/markdoc - A powerful, flexible, Markdown-based authoring framework. (TypeScript)
- awesome-github-repos - markdoc/markdoc - A powerful, flexible, Markdown-based authoring framework. (TypeScript)
- jimsghstars - markdoc/markdoc - A powerful, flexible, Markdown-based authoring framework. (TypeScript)
- awesome-documentation - Markdoc - A Markdown-based syntax and toolchain for creating custom documentation sites and experiences. (General Tools / Site Builder)
README
A powerful, flexible, Markdown-based authoring framework.
Markdoc is a [Markdown](https://commonmark.org)-based syntax and toolchain for creating custom documentation sites and experiences.
We designed Markdoc to power [Stripe's public docs](http://stripe.com/docs), our largest and most complex content site.
## Installation
To get started with Markdoc, first install the library:
```shell
npm install @markdoc/markdoc
```
or
```shell
yarn add @markdoc/markdoc
```
and import it in your app:
```js
const Markdoc = require('@markdoc/markdoc');
```
or if you are using ESM
```js
import Markdoc from '@markdoc/markdoc';
```
then use `Markdoc` in your app or tool:
```js
const doc = `
# Markdoc README
{% image src="/logo.svg" /%}
`;
const ast = Markdoc.parse(doc);
const content = Markdoc.transform(ast);
return Markdoc.renderers.react(content, React);
```
Check out [our docs](https://markdoc.dev/docs) for more guidance on how to use Markdoc.
### TypeScript
This is the minimal `tsconfig.json` required to use Markdoc in your TypeScript project:
```json
{
"compilerOptions": {
"moduleResolution": "node",
"target": "esnext", // works with es2015 or greater
"esModuleInterop": true
}
}
```
### React
If you are using React, install Markdoc with:
```sh
npm install @markdoc/markdoc react @types/react
```
## Contributing
Contributions and feedback are welcome and encouraged. Check out our [contributing guidelines](.github/CONTRIBUTING.md) on how to do so.
### Development
1. Run `npm install`
1. Run `npm run build`
1. Run the tests using `npm test`
## Code of conduct
This project has adopted the Stripe [Code of conduct](.github/CODE_OF_CONDUCT.md).
## License
This project uses the [MIT license](LICENSE).
## Credits
Special shout out to:
- [@marcioAlmada](https://github.com/marcioAlmada) for providing us with the [@markdoc](https://github.com/markdoc) GitHub org.
- [@koomen](https://github.com/koomen) for gifting us https://markdoc.dev.