zen

• ⚡️ My personal website — 2023 edition

Table of Contents

• zen
  • Table of Contents
  • Getting Started
    • Pre-requisite
    • Up and Running
    • Contact email setup
  • Inspirations
  • Typeface
  • License

Getting Started

Pre-requisite

💡 We use pnpm as a drop-in replacement for npm for better package management

1. Install either asdf or nvm to manage your node version.
2. Install the node version mentioned in the .nvmrc file.

# if you're using asdf
asdf install nodejs
# if you're using nvm
nvm install

3. Install pnpm globally as package manager,

npm install -g pnpm

4. You need a postmark account for sending contact emails.
5. You need a cloudinary account for image hosting.

Up and Running

Clone the repository and install dependencies

git clone [email protected]:murshidazher/zen.git
pnpm i

Create an .env.local file with the following variables:

NEXT_PUBLIC_SITE_URL=                   # The local / hosted url (i.e. http://localhost:3000)
EMAIL_ADDRESS=""                        # The email address to send emails
NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=""    # Add your cloudinary name

To start the development server

netlify link    # link the netlify repo to get site id
netlify build   # build the deps
netlify dev     # run the development server with email functionality

Contact email setup

💡 Read more on setup and usage of postmark & netlify and env variable config.

Set the email directory to in,

NETLIFY_EMAILS_DIRECTORY="./functions/mail/templates"

To check the email provider api locally,

netlify dev     # run on port http://localhost:8888/.netlify/functions/emails

Inspirations

• ✺ Hayden Bleasel - Most of the component styles were heavily inspired and taken from this portfolio.
• 🗞️ Siddharth Arun - The website layout.
• 📦 radix - UI elements.
• ⚙️ shadn - Components and styles.
• 🫐 qoals - Blended Blur Background.

Typeface

The primary typeface used is Inter, a sleek and minimalist sans-serif font, while Google Sans is employed for the headings.

License

MIT © 2023-present Murshid Azher.