Skip to content
← Back to portfolio

Project case study · Web system

Cartes.dev

An earlier version of my Cartes.dev portfolio. Next.js pre-rendered the project and blog pages from an MDX pipeline built with next-mdx-remote and gray-matter.

Next.jsReactSSGJavaScriptMDXTailwind CSSImage OptimizationDark Mode

The previous Cartes.dev portfolio

This was the previous version of my Cartes.dev portfolio. It used Next.js Static Generation to pre-render project and blog pages from MDX files. The content pipeline parsed front matter with gray-matter and serialized the MDX with next-mdx-remote, with React components available inside the content.

The JavaScript interface used React.js for reusable navigation, project cards, screenshot carousels, and the theme toggle. Tailwind CSS provided responsive styling and dark mode, while Next.js Image handled image optimization. I deployed it on Vercel.

The Astro rebuild that powers this site has since replaced it.

Run the project

The project is open source and available on GitHub.

$ git clone https://github.com/alfonsocartes/cartes_dev.git
$ cd cartes_dev
$ npm install
$ npm run dev

Have a project in mind?

Tell me what you're working on and where you need help.