jpreagan.com
remark-mdx-images
jpreagan.com | remark-mdx-images | |
---|---|---|
4 | 1 | |
31 | 25 | |
- | - | |
8.5 | 6.6 | |
3 months ago | about 1 month ago | |
TypeScript | JavaScript | |
MIT License | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
jpreagan.com
-
Building Your Own Platform: The Importance of Having a Personal Website
You are welcome to take inspiration or use code from my website, but please remove my personal information and content. The source code is available on GitHub with updated documentation to make it easier for you to start. If you have any questions or feedback, don't hesitate to reach me on Twitter."
-
Give your blog superpowers with MDX in a Next.js project
Also, note I've made use of some styling here; just a minimal example of how you can use Tailwind CSS and the official Tailwind Typography plugin. It's really fantastic for this sort of use case. If you're curious more about the styling have a look at the GitHub repo.
-
Give your blog superpowers with MDX in a Next.js
Here I'm using remarkGfm to provide GitHub Flavored Markdown, and rehype-prism-plus to give syntax highlighting for code blocks. You'll need to import a prism theme in /pages/_app.tsx or add your own custom tokens to global styles. I went with the latter option and you can take a look at how I did that here.
-
Starting a personal dashboard with the Spotify API
You can see my page here, and the code lives here. Also, be sure to check out Lee Robinson's personal dashboard for more inspiration.
remark-mdx-images
-
Give your blog superpowers with MDX in a Next.js
You might also want to embed images in your MDX. Proprietary solutions like Cloudinary are great services, but can get a bit pricey too. Something you might want to look at is image bundling with remark-mdx-images, which you can use with mdx-bundler.
What are some alternatives?
personal-website - My portfolio and blog page build in NextJs
remark-react - Legacy plugin to transform to React — please use `remark-rehype` and `rehype-react` instead
eleventy 🕚⚡️ - A simpler site generator. Transforms a directory of templates (of varying types) into HTML.
remark-mdx-code-meta - A remark MDX plugin for using markdown code block metadata
next-mdx-remote - Load mdx content from anywhere through getStaticProps in next.js
tailwindcss-typography - Beautiful typographic defaults for HTML you don't control.
vanilla-extract - Zero-runtime Stylesheets-in-TypeScript
flanker - Python email address and Mime parsing library
mdx-bundler - 🦤 Give me MDX/TSX strings and I'll give you back a component you can render. Supports imports!
mdx - Markdown for the component era