Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/murshidazher/zen
⚡️ My personal website — 2023 edition
https://github.com/murshidazher/zen
nextjs personal-website
Last synced: about 5 hours ago
JSON representation
⚡️ My personal website — 2023 edition
- Host: GitHub
- URL: https://github.com/murshidazher/zen
- Owner: murshidazher
- License: mit
- Created: 2023-08-08T19:29:09.000Z (over 1 year ago)
- Default Branch: develop
- Last Pushed: 2024-10-23T17:34:45.000Z (16 days ago)
- Last Synced: 2024-10-24T17:27:52.860Z (15 days ago)
- Topics: nextjs, personal-website
- Language: TypeScript
- Homepage: https://murshidazher.com/
- Size: 2.14 MB
- Stars: 2
- Watchers: 2
- Forks: 1
- Open Issues: 11
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Security: SECURITY.md
Awesome Lists containing this project
README
# [zen](https://github.com/murshidazher/zen)
- ⚡️ My personal website — 2023 edition
## Table of Contents
- [zen](#zen)
- [Table of Contents](#table-of-contents)
- [Getting Started](#getting-started)
- [Pre-requisite](#pre-requisite)
- [Up and Running](#up-and-running)
- [Contact email setup](#contact-email-setup)
- [Inspirations](#inspirations)
- [Typeface](#typeface)
- [License](#license)
## Getting Started
### Pre-requisite
> 💡 We use [pnpm](https://pnpm.io/) as a drop-in replacement for `npm` for better package management
1. Install either [asdf](https://asdf-vm.com/guide/getting-started.html) or [nvm](https://github.com/nvm-sh/nvm#installing-and-updating) to manage your node version.
2. Install the node version mentioned in the `.nvmrc` file.
```sh
# if you're using asdf
asdf install nodejs
# if you're using nvm
nvm install
```
3. Install `pnpm` globally as package manager,
```sh
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
```sh
git clone [email protected]:murshidazher/zen.git
pnpm i
```
Create an `.env.local` file with the following variables:
```sh
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
```sh
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](https://postmarkapp.com/integrations/netlify) and [env variable config](https://docs.netlify.com/integrations/email-integration/#required-environment-variables).
Set the email directory to in,
```sh
NETLIFY_EMAILS_DIRECTORY="./functions/mail/templates"
```
To check the email provider api locally,
```sh
netlify dev # run on port http://localhost:8888/.netlify/functions/emails
```
## Inspirations
- ✺ [Hayden Bleasel](https://haydenbleasel.com/) - Most of the component styles were heavily inspired and taken from this portfolio.
- 🗞️ [Siddharth Arun](https://sdrn.co/) - The website layout.
- 📦 [radix](https://www.radix-ui.com/) - UI elements.
- ⚙️ [shadn](https://ui.shadcn.com/) - Components and styles.
- 🫐 [qoals](https://qoals.com/) - Blended Blur Background.
## Typeface
The primary typeface used is [Inter](https://rsms.me/inter/), a sleek and minimalist sans-serif font, while [Google Sans](https://flutter.googlesource.com/gallery-assets/+/refs/heads/master/lib/fonts/) is employed for the headings.
## License
[MIT](./LICENSE) © 2023-present Murshid Azher.