This repository contains the source code for my personal website. The website itself covers an intro to my projects and a little about who I am.
View Live Site
·
Report Bug
- Written in Typescript with NextJS/React.
- Fully dynamic will scale (well) to most devices.
- Website is entirely statically generated.
- Articles (projects) are written in MDX format and get compiled automatically as a Github workflow.
To get a local copy up and running follow these simple steps:
- npm
- Clone the repo
git clone https://github.com/smp46/smp46.me.git
- Install NPM packages
npm install
For developing npm run dev, this even works for adding MDX files. Navigating away then back to /projects, will refresh and get new files.
For building/generating a static site npm run build, find the website files in /out.
Painfully! It was a lot of banging my head against the wall using various guides and resources to reach my goal of easier article creation / updating. What ended up being the most helpful article was this one by Colby Fayock.
The end result is a relatively easy way to maintain and add articles/project write-ups. The process is as simple as:
- Write the article in Markdown(X) and copy it to the src/projects directory.
- Add the required fields to the top of the page, to extract a title and allow for categorising, meta tags etc. For example:
--- title: "Portfolio Website" subtitle: "Building My Developer Portfolio with Next.js, MDX, and GitHub Actions" type: "personal" description: "A fully statically-generated personal portfolio built with Next.js, React, and TypeScript. It showcases projects, articles written in MDX, and a bit about me." keywords: "personal website, portfolio, Next.js, React, TypeScript, static site generation, MDX, GitHub Actions, web development, developer portfolio" github: "[https://github.com/smp46/smp46.me](https://github.com/smp46/smp46.me)" --- git add . && git commitAnd ta-dah, the Github workflow handles the compiling and then it goes live at smp46.me/projects.
Distributed under the MIT License. See LICENSE file for more information.
Samuel P - me@smp46.me
Project Link: https://github.com/smp46/smp46.me