Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/timtbdev/next.js-portfolio-app
✨ Portfolio app built with Next.js 13 & MDX, Contentlayer
https://github.com/timtbdev/next.js-portfolio-app
contentlayer contentlayer-nextjs framer-motion headlessui mdx metadata-api nextjs nodemailer portfolio radix-ui react react-email react-hot-toast shadcn-ui tailwind tailwindcss typescript vercel vercel-og zod
Last synced: about 2 months ago
JSON representation
✨ Portfolio app built with Next.js 13 & MDX, Contentlayer
- Host: GitHub
- URL: https://github.com/timtbdev/next.js-portfolio-app
- Owner: timtbdev
- License: mit
- Created: 2023-03-21T11:00:48.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-02-17T23:12:28.000Z (11 months ago)
- Last Synced: 2024-04-23T19:12:26.305Z (9 months ago)
- Topics: contentlayer, contentlayer-nextjs, framer-motion, headlessui, mdx, metadata-api, nextjs, nodemailer, portfolio, radix-ui, react, react-email, react-hot-toast, shadcn-ui, tailwind, tailwindcss, typescript, vercel, vercel-og, zod
- Language: TypeScript
- Homepage: https://timtb.dev
- Size: 4.92 MB
- Stars: 25
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Portfolio app built with Next.js 13 & Contentlayer, MDX
Demo
## 💻 Preview
https://github.com/timtbdev/Next.js-Portfolio-App/assets/25026241/a18eca2c-b205-4f50-9e96-eb29d179b475
## 📊 Google Lighthouse performance statistics
### Desktop
### Mobile
## 📚 Features
- App Router,
- Server Actions
- Server and Client Components
- Metadata files
- Open Graph Image Generation using [Vercel/Og](https://vercel.com/docs/concepts/functions/edge-functions/og-image-generation)
- UI Components built using [Shadcn UI](https://ui.shadcn.com/), [Radix UI](https://www.radix-ui.com/) and [Headless UI](https://headlessui.com/),
- Pages and blogs are using [MDX](https://mdxjs.com/) and [Contentlayer](https://www.contentlayer.dev/)
- Sending emails using [NodeMailer](https://nodemailer.com) and [React Email](https://https://react.email/), [Gmail](https://gmail.com)
- Styled using [Tailwind CSS](https://tailwindcss.com/)
- Icons using [Heroicons](https://heroicons.com/) and [Lucide](https://lucide.dev/)
- Validations using [Zod](https://www.zod.dev)
- Written in [TypeScript](https://www.typescriptlang.org/)
## ⌨️ Code Quality
- [TypeScript](https://www.typescriptlang.org/)
- [Prettier](https://prettier.io/)
- [ESLint](https://eslint.org/)
## 📈 Miscellaneous
- [Vercel Analytics](https://vercel.com/analytics)
# ⚙️ Getting Started
## Requirements
To run this app locally you need
- [Node.js (Version: >=18.x)](https://nodejs.org/en/download/)
- Node Package Manager NPM - included in Node.js
- [PostgreSQL (local or remote)](https://www.postgresql.org/download/)
## Developer Quickstart
Want to get up and running quickly? Follow these steps:
- [Clone the repository](https://help.github.com/articles/cloning-a-repository/) it to your local device.
```sh
git clone https://github.com/timtbdev/Next.js-Portfolio-App.git
```
- Set up your `.env.local` file using the recommendations in the `.env.example` file.
- Run `npm installation --legacy-peer-deps` in the root directory
```sh
npm installation --legacy-peer-deps
```
- Run `npm run dev` in the root directory
- Want it even faster? Just use
```sh
npm run d
```
That's it! You should now be able to access the app at http://localhost:3000
Admin dashboard will also be available on http://localhost:300/dashboard
## 🙇 Author
- Tim ([@timtbdev](https://twitter.com/timtbdev))
## License
Licensed under the [MIT license](https://github.com/shadcn/taxonomy/blob/main/LICENSE.md).