Skip to content

abhishekbuilds/project-two-clicks

Repository files navigation

🚀 Project Two Clicks

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.

Portfolio Preview

🌟 Features

  • 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

🔧 First things first!

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.


📦 Prerequisites

Before you begin, ensure you have the following installed:

  • Node.js 18.17 or later
  • Git
  • A code editor (we recommend VS Code)

🛠 Installation

  1. Clone the repository:

    git clone https://github.com/abhishekbuilds/project-two-clicks
    cd project-two-clicks
  2. Install dependencies:

    npm install
    
  3. Start the development server:

    npm run dev
    

    Open http://localhost:3000 in your browser to see portfolio.


🎨 Customization

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

📂 Project Structure

portfolio/
├── app/                # Next.js app directory
├── components/         # Reusable UI components
├── lib/                # Utility functions and data
├── public/             # Static assets (images, icons, etc.)
└── styles/             # Global styles

🤝 Contributing

We welcome contributions! Follow these steps:

  1. Fork the repository
  2. Create a new branch:
    git checkout -b feature/your-feature-name
  3. Make your changes and commit them:
    git commit -m "Add some feature"
  4. Push to your fork:
    git push origin feature/your-feature-name
  5. Open a Pull Request on GitHub.

📝 Contribution Guidelines

Code Style

  • 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.

Commits

  • Use clear and descriptive commit messages.
  • Follow conventional commits format.
  • Reference issues in commits when applicable.

Pull Requests

  • Create a descriptive PR title.
  • Include a summary of changes.
  • Add screenshots for UI changes.
  • Ensure all tests pass.

Testing

  • Add tests for new features.
  • Ensure existing tests pass.
  • Test across different browsers.
  • Check mobile responsiveness.

Documentation

  • Update README.md if needed.
  • Add JSDoc comments for new functions.
  • Include inline documentation.
  • Update type definitions.

📝 License

This project is licensed under the MIT License – see the LICENSE file for details.


🙏 Acknowledgments

A huge thank you to these awesome technologies:

  • Next.js
  • Tailwind CSS
  • shadcn/ui
  • Lucide Icons
  • Framer Motion
  • v0.dev

📫 Support

If you have any questions or need help:


⭐ Show Your Support

If you found this project useful, give it a ⭐ on GitHub! 🙌


🚀 Happy coding! 💻✨ - Abhishek Singh

About

Live Edit and Deploy Portfolio

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages