Next.js + MDX Crash Course
MDX and Next.js is a great combination. It allows for faster page speeds and easier content development. In this video, I show you how to connect Next.js and MDX pages. I show you how to add custom styles as well. One great application for mdx is using to to create a blog! I definitely recommend using mdx pages for a developer personal website that has static content.
We use the following dependencies to help us:
@mdx-js/loader
@mdx-js/react
@next/mdx
Helpful links:
Next.js docs: https://nextjs.org/docs/getting-started
0:00 Introduction
0:22 Starter Files
0:30 Adding dependencies
0:53 next.config.js
1:16 Adding our about.mdx file
2:08 Custom Components
3:31 Custom MDX styles
5:05 Adding wrapper to _app.js
6:08 styling InlineCode
7:04 Conclusion
My Coding Gear:
⌨️ Keyboard - Apple Magic Keyboard - https://amzn.to/3i7X3gx
💻 Laptop - Apple MacBook Pro (2018 - 15 inch) - https://amzn.to/3o7y2l5
🖥️ Monitor - Samsung CF390 Series - https://amzn.to/3p6zbur
My Camera Gear:
📹 Camera - Canon EOS M50 - https://amzn.to/2Ok9f1e
🔭 Awesome Camera Lens - Sigma
🎤 Microphone - https://amzn.to/3ia5XdA
💡 Lights - Neewer LED Lights - https://amzn.to/3oUsMSj
My Favorite Software:
📽️ Final Cut Pro - https://www.apple.com/final-cut-pro/
❗ Student Discount For FCP - https://www.apple.com/us-hed/shop/pro...
🚀 VSCode - https://code.visualstudio.com/
View All My Gear - https://benjamincarlson.io/gear
Support Me:
👨🏼💼 Join this channel to get access to perks - / @benjamincarlson
💸 Sponsor me on GitHub - https://github.com/sponsors/bjcarlson42
Who Am I?
I’m Benjamin Carlson, a developer, student, and YouTube creator living in CT, USA. I make videos on programming, computer science, and productivity. I also started a programming tutorial website called Coffeeclass (https://coffeeclass.io) that complements this YouTube channel. Finally, I have a newsletter (https://buttondown.email/benjamincarlson) where I send out updates on my recent videos, writing, and anything I’m currently working on or find interesting. You can expect emails every 2 to 3 weeks.
Connect With Me:
📧 Email - [email protected]
🚅 Website - https://benjamincarlson.io
🐦 Twitter - / bjmncrlsn
Github: https://github.com/bjcarlson42
💼 LinkedIn - / bjcarlson42
✍️ Medium - / benjamincarlson
📓 Newsletter - https://buttondown.email/benjamincarlson
If you need to contact me, the best way is email. I try to respond to everyone but it may take some time!
#nextjs #mdx
