Skip to content
Branch: master
Clone or download
Latest commit 8556b6a Mar 18, 2019

README.md

icon

MDX Blocks

A wild new way to build websites EXPERIMENTAL

build status version MIT License

https://mdx-blocks.netlify.com

npm i mdx-blocks

Import and use MDX Blocks as layout components

import { Bar } from 'mdx-blocks'

export default props =>
  <Bar
    {...props}
  />

# Hello

- [Link](/)
- [Click](/click)
- [Beep](/beep)

Create a block for each section of a page

import { Banner } from 'mdx-blocks'
export default Banner

# Hello

This is a banner with a background image.

![](kitten.png)
// Combine blocks together to create a page
import { BlocksProvider } from 'mdx-blocks'
import Header from './header.mdx'
import Banner from './banner.mdx'

export default props =>
  <BlocksProvider>
    <Header />
    <Banner />
  </BlocksProvider>

Features

  • Write content in markdown and use React components inline with MDX
  • Customize the look and feel with theming
  • Create custom block layouts with minimal effort
  • Quickly swap out the layout of blocks without touching the content

Get Started

Read the docs


Related

Code of Conduct MIT License

You can’t perform that action at this time.