https://github.com/sm3sher/portfolio

Personal portfolio based on Next.js
https://github.com/sm3sher/portfolio

contentful graphql next next-intl next-themes react-hook-form supabase tailwindcss zod

Last synced: about 1 month ago
JSON representation

Personal portfolio based on Next.js

• Host: GitHub
• URL: https://github.com/sm3sher/portfolio
• Owner: sm3sher
• Created: 2024-11-08T07:45:26.000Z (3 months ago)
• Default Branch: main
• Last Pushed: 2024-12-25T12:18:25.000Z (about 1 month ago)
• Last Synced: 2024-12-25T13:25:03.784Z (about 1 month ago)
• Topics: contentful, graphql, next, next-intl, next-themes, react-hook-form, supabase, tailwindcss, zod
• Language: TypeScript
• Homepage:
• Size: 9.75 MB
• Stars: 0
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
## Portfolio Project

This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).

It serves as a personal portfolio to showcase my skills in web development.

## ✨ Features

- **Dark Mode Support**: Powered by [next-themes](https://github.com/pacocoursey/next-themes)

- **Forms**: Built with [react-hook-form](https://react-hook-form.com) and validated using [zod](https://zod.dev) on both client and server-side

- **Form Handling**: Submitted data is stored in [Supabase](https://supabase.com)

- **Content Management**: Text and images are managed through [Contentful](https://contentful.com) and queried via [GraphQL](https://graphql.org/)

- **Internationalization**: Supports multiple languages with [next-intl](https://next-intl.dev/) and localized content powered by [Contentful](https://contentful.com)

- **Icons**: Integrated with [hugeicons-react](https://hugeicons.com) for lightweight and scalable icons

- **Font**: Utilizes Vercel’s new [Geist font](https://vercel.com/font) for modern typography

- **Styling**: Developed using [Tailwind CSS](https://tailwindcss.com) with a mobile-first approach

- **Linting and Formatting**: Code quality maintained with [ESLint](https://eslint.org) and [Prettier](https://prettier.io)

- **Git Hooks**: Enforces commit, linting and formatting standards using [Husky](https://typicode.github.io/husky) and [CommitLint](https://github.com/conventional-changelog/commitlint/tree/master/%40commitlint/config-conventional)

## 🛠 Commands

Here are the main commands that I use:

- `npm run dev`: Start the development server

- `npm run build`: Build for production

- `npm run start`: Start the production server

- `npm run lint`: Run ESLint to check for issues

- `npm run format`: Format code with Prettier

- `npm test`: Run unit tests with Vitest

- `npm run graphql:generate`: Generate types for GraphQL queries