https://github.com/satnaing/satnaing.dev

My portfolio & blog website developed with NextJS, TypeScript, and TailwindCSS. Markdown is used for contents. Contents are managed via Forestry headless CMS.
https://github.com/satnaing/satnaing.dev

blog developer-portfolio forestry github learn nextjs portfolio react reactjs tailwindcss typescript

Last synced: 8 days ago
JSON representation

My portfolio & blog website developed with NextJS, TypeScript, and TailwindCSS. Markdown is used for contents. Contents are managed via Forestry headless CMS.

• Host: GitHub
• URL: https://github.com/satnaing/satnaing.dev
• Owner: satnaing
• Created: 2022-03-14T15:51:14.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2024-05-10T02:14:27.000Z (6 months ago)
• Last Synced: 2024-10-23T13:38:45.907Z (15 days ago)
• Topics: blog, developer-portfolio, forestry, github, learn, nextjs, portfolio, react, reactjs, tailwindcss, typescript
• Language: TypeScript
• Homepage: https://satnaing.dev
• Size: 11.8 MB
• Stars: 111
• Watchers: 3
• Forks: 29
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

README

        
# Sat Naing Portfolio & Blog

![satnaing-portfolio-and-blog](https://user-images.githubusercontent.com/53733092/169645862-d1dda9cb-482f-4428-a63c-8eaf6910ab35.png)

![ts](https://badgen.net/badge/Built%20With/TypeScript/blue) ![vercel](https://img.shields.io/github/deployments/satnaing/my-portfolio/production?label=vercel&logo=vercel&logoColor=white)

My portfolio & blog website developed with Next.JS(SSG) and TypeScript. Tailwind CSS and GSAP is used for styling and animations. Blog contents are written in Markdown format. Light & Dark themes supported.

## Features

- Responsive Design 📱💻

- Light & Dark themes ☀️🌙

- Fully Accessible ♿️

- Categories, Tags 🏷

- Search Box 👀

- SEO Friendly 🔎

- Markdown Content 📰

## Tech Stack

**Frontend** - [NextJS](https://nextjs.org/), [React](https://reactjs.org/), [TypeScript](https://www.typescriptlang.org/)  

**Styling** - [Tailwind CSS](https://tailwindcss.com/)  

**Animations** - [GSAP](https://greensock.com/)  

**Design & Prototype** - [Figma](https://figma.com/)  

**State Management** - [ContextAPI](https://reactjs.org/docs/context.html)  

**Backend** - [Forestry Headless CMS](https://forestry.io/)  

**Deployment** - [Vercel](https://vercel.com/)

## Lighthouse Score



  

    

  



## Running Locally

Clone the project

```bash

git clone https://github.com/satnaing/satnaing.dev.git

```

Go to the project directory

```bash

cd satnaing.dev

```

Remove remote origin

```bash

git remote remove origin

```

Install dependencies

```bash

npm install

```

Start the server

```bash

npm run dev

```

## Inspiration and Credits

Here are some inspiration and credits for the design of my portfolio. However I can guarantee that I wrote 100% of the code. These credits are just for ideas and design for my portfolio and blog website.

- [Lee Robinson Website](https://leerob.io/)

- [Papermod Hugo Theme](https://adityatelange.github.io/hugo-PaperMod/)

- [Brittany Chiang Website](https://brittanychiang.com/)

- [Max Böck Website](https://mxb.dev/)

The digital art in the hero section was illustrated by a friend of mine ([Swann Fevian Kyaw](https://www.facebook.com/bon.zai.3910) [@ToonHa](https://www.facebook.com/ToonHa-102639465752883))

## Author

- [@satnaing](https://satnaing.dev)