Project Two Clicks offers a modern, customizable portfolio website built with Next.js 14, TypeScript, and Tailwind CSS.
It features a clean design, dark mode support, and easy content management to help you showcase your work effortlessly.
- ⚡ Next.js 14 with App Router
- 💨 Tailwind CSS for styling
- 🎨 Dark mode support
- 📱 Fully responsive design
- ♿ Accessible components
- 🔍 SEO optimized
- 📝 Easy content management
- 🛠 Customizable sections
- 🔄 Real-time preview
- 🚀 One-click deployment
As a former student of Ethical Concerns in Software Engineering, I want to highlight that the majority of the frontend components in this project were generated using V0.dev, significantly reducing frontend development time to just two days.
However, from ideation to execution, I handled everything from ensuring the system worked as envisioned, integrating different components, and implementing critical features.
Additionally, some comment lines in the code have been intentionally left to credit AI for its contribution and maintain transparency in its usage.
Before you begin, ensure you have the following installed:
- Node.js 18.17 or later
- Git
- A code editor (we recommend VS Code)
-
Clone the repository:
git clone https://github.com/abhishekbuilds/project-two-clicks cd project-two-clicks -
Install dependencies:
npm install -
Start the development server:
npm run devOpen http://localhost:3000 in your browser to see portfolio.
Make your portfolio unique by customizing the following:
- Update your personal information in
lib/data.ts - Modify the theme in
app/globals.css - Add your projects, experience, and other content
- Customize components inside the
components/directory
portfolio/
├── app/ # Next.js app directory
├── components/ # Reusable UI components
├── lib/ # Utility functions and data
├── public/ # Static assets (images, icons, etc.)
└── styles/ # Global styles
We welcome contributions! Follow these steps:
- Fork the repository
- Create a new branch:
git checkout -b feature/your-feature-name
- Make your changes and commit them:
git commit -m "Add some feature" - Push to your fork:
git push origin feature/your-feature-name
- Open a Pull Request on GitHub.
- Use TypeScript for all new files.
- Follow the existing code style.
- Use meaningful variable and function names.
- Keep functions small and focused.
- Add comments for complex logic.
- Use clear and descriptive commit messages.
- Follow conventional commits format.
- Reference issues in commits when applicable.
- Create a descriptive PR title.
- Include a summary of changes.
- Add screenshots for UI changes.
- Ensure all tests pass.
- Add tests for new features.
- Ensure existing tests pass.
- Test across different browsers.
- Check mobile responsiveness.
- Update README.md if needed.
- Add JSDoc comments for new functions.
- Include inline documentation.
- Update type definitions.
This project is licensed under the MIT License – see the LICENSE file for details.
A huge thank you to these awesome technologies:
- Next.js
- Tailwind CSS
- shadcn/ui
- Lucide Icons
- Framer Motion
- v0.dev
If you have any questions or need help:
If you found this project useful, give it a ⭐ on GitHub! 🙌
🚀 Happy coding! 💻✨ - Abhishek Singh
