https://github.com/livewithcodeankit/portfolio-website
This is a personal portfolio website built using Next.js 13, TypeScript, and Tailwind CSS. The website showcases projects, skills, and provides visitors with an overview of your work.
https://github.com/livewithcodeankit/portfolio-website
css html-css-javascript nextjs13 tailwindcss typescript
Last synced: 5 months ago
JSON representation
This is a personal portfolio website built using Next.js 13, TypeScript, and Tailwind CSS. The website showcases projects, skills, and provides visitors with an overview of your work.
- Host: GitHub
- URL: https://github.com/livewithcodeankit/portfolio-website
- Owner: LiveWithCodeAnkit
- Created: 2023-08-12T05:14:59.000Z (over 2 years ago)
- Default Branch: master
- Last Pushed: 2023-08-14T21:57:43.000Z (over 2 years ago)
- Last Synced: 2025-04-10T20:47:38.622Z (8 months ago)
- Topics: css, html-css-javascript, nextjs13, tailwindcss, typescript
- Language: TypeScript
- Homepage: https://portfolio-website-liveankit.vercel.app
- Size: 3.9 MB
- Stars: 4
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Portfolio Website with Next.js 13, TypeScript, and Tailwind CSS
This is a personal portfolio website built using Next.js 13, TypeScript, and Tailwind CSS. The website showcases your projects, skills, and provides visitors with an overview of your work.
## Features
- **Next.js 13:** Utilize the latest version of Next.js to take advantage of its performance improvements and modern features.
- **TypeScript:** Write safer and more maintainable code with TypeScript. Benefit from static typing, enhanced tooling, and improved code quality.
- **Tailwind CSS:** Create responsive and visually appealing UI using the power of Tailwind CSS's utility-first classes.
- **Custom Light and Dark Mode:** Enhance user experience with a toggleable light and dark mode. The website adapts its color scheme based on user preference.
- **Reusable Components:** The project is structured with reusable components for headers, footers, project cards, and more. This promotes maintainability and consistency throughout the site.
- **Portfolio Showcase:** Display your projects in an organized manner. Each project card provides a brief description, links to the project, and technologies used.
- **Skills Section:** Highlight your skills and expertise using visually appealing icons or badges. Let visitors know what technologies and tools you're proficient in.
- **Responsive Design:** Ensure your portfolio looks great on various screen sizes, from large desktop monitors to small mobile devices.
- **SEO Optimization:** Utilize Next.js's built-in features for SEO optimization, including customizable meta tags for each page.
## Installation
1. Clone this repository to your local machine.
2. Navigate to the project directory: `cd nextjs-tailwind-portfolio`.
3. Install dependencies: `npm install`.
4. Run the development server: `npm run dev`.
5. Open your browser and go to `http://localhost:3000` to see the portfolio website in action.
## Configuration
- Customize the content in the `data` directory to reflect your own projects, skills, and information.
- Modify the styling by editing the Tailwind CSS classes in the `styles` directory.
- Adjust the color schemes for light and dark mode in the appropriate CSS files.
- Explore and expand the components in the `components` directory to add new sections or features to your portfolio.
## TypeScript Usage
This project is built using TypeScript, providing enhanced code quality and better developer experience. TypeScript type definitions have been added to the project, ensuring that your code is more robust and easier to maintain.
- Explore the `types` directory to see the TypeScript type definitions used throughout the project.
- Leverage TypeScript interfaces and types for defining data structures and props for your components.
- Enjoy better autocompletion, type checking, and error prevention in your development workflow.
## Contributing
Contributions are welcome! If you find any bugs, have suggestions for improvements, or want to add new features, feel free to open an issue or submit a pull request.
## License
This project is licensed under the [MIT License](LICENSE).
---
Designed and developed by Your Name.