This is my personal website built with Next.js, Tailwind CSS, and hosted on Vercel
- π₯ Next.js with app router directory structure
- βοΈ React
- β‘οΈ Typescript
- π Tailwind CSS
- 𧩠Contentlayer with MDX plugins
- βοΈ SEO metadata
- π ESLint β Find and fix problems in your code
- π Prettier β Format your code consistently
- πΆ Husky & Lint Staged β Run scripts on your staged files before they are committed
- π€ Conventional Commit Lint
-
Clone this repository
git clone https://github.com/ranacode6/ranacode6.git
-
Change directory
cd ranacode6
-
Install dependencies
yarn install
-
Create a
.env
file similar to.env.example
and input environment variables# Client NEXT_PUBLIC_APP_URL=http://localhost:3000 NEXT_PUBLIC_GOOGLE_ANALYTICS= NEXT_PUBLIC_AVAILABLE_FOR_HIRE=true # Server # database DATABASE_URL= # next-auth NEXTAUTH_URL=http://localhost:3000 NEXTAUTH_SECRET= # google GOOGLE_ID= GOOGLE_SECRET= # github GITHUB_ID= GITHUB_SECRET= GITHUB_READ_USER_TOKEN_PERSONAL=
-
Start hacking
yarn dev
Deploy to Vercel, Netlify, etc
config/site.ts
- updatesite
with yours.config/github.ts
- updateGITHUB_ACCOUNT
with yours.constants/experiences.ts
- update with your cool experiences.app/about/page.tsx
- update with yours.app/resume/page.tsx
- (optional) update with your resume or you can remove it.public/share/resume.pdf
- (optional) replace with your best resume.public/media/*
- store assets such as images and favicons.tailwind.config.js
- contains the tailwind styles, and modify as you like to change overall look and feel to the site.content
- replace with your blog posts, projects, and notes.next.config.js
- configuration related to Next.js. You need to adapt the Content Security Policy if you want to load scripts, images etc. from other domains.
- Framework: Next.js
- Styling: Tailwind CSS
- Database: PlanetScale
- ORM: Prisma
- Authentication: NextAuth.js
- Deployment: Vercel
- Content: MDX, contentlayer
Licensed under the MIT License.