iainsmith.me

Framework: Next.js
Database: Vercel Storage
Deployment: Vercel
Content: MDX
Styling: Tailwind CSS

Learn More

I was highly inspired by Lee Rob's blog and used it as a starting point. I would recommend having a look at his site and YouTube channel

Differences from lee's blog

Added categories, e.g., Flutter, How to
Added Strava integration to dashboard
Added spinners to dashboard
Added categories, title, and summary to search
Added center image component
Added caption image component
Added info/warning/success/failure components
Added Google Analytics
Added a now page - https://dawchihliou.github.io/now
Changed Cons component to have a cross icon
Changed font to Outfit
Changed "Most Popular" to come from data
Changed all Assets to webp

Overview

data/* - MDX data that is used for blogs, newsletters, and code snippets.
layouts/* - The different page layouts each MDX category (blog, newsletter, snippets) uses.
lib/* - Short for "library", a collection of helpful utilities or code for external services.
pages/api/* - API routes powering /dashboard, newsletter subscription, and post views.
pages/blog/* - Static pre-rendered blog pages using MDX.
pages/dashboard - Personal dashboard tracking metrics.
pages/* - All other static pages.
prisma/* - My Prisma schema, which uses a PlanetScale MySQL database.
public/* - Static assets including fonts and images.
scripts/* - Two useful scripts to generate an RSS feed and a sitemap.
styles/* - A small amount of global styles. I'm mostly using vanilla Tailwind CSS.

Running Locally

$ git clone https://github.com/b099l3/iainsmith.me.git
$ cd iainsmith.me
$ yarn
$ yarn dev

Create a .env file similar to .env.example.

Cloning / Forking

Please review the license and remove all of my personal information (resume, blog posts, images, etc.).

Making a new post?

create mdx file in /data/blog/
add the meta data, can use the snippet newpost:

  ---
  title: 'The future-proof solution to manage your Flutter versions: global, FVM, or asdf-vm?'
  publishedAt: '2022-01-26'
  summary: 'Want to try the latest Flutter version but don't want your existing projects to break? Want to have a consistent environment across the dev team? Want to future-proof your dev environment? Let me show you how...'
  image: '/static/images/future-proof-your-flutter-env/banner.webp'
  category: 'Flutter'
  ---

add banner image to /static/images//banner.webp
- If gif, png, jpg - use the convert script

b099l3 / iainsmith.me