Free Clip

Free Clip is a web application designed to capture screenshots of websites. Built with Next.js and Tailwind CSS, it provides a user-friendly interface for users to input URLs and receive screenshots of the corresponding web pages.

Live demo

https://freeclip.vercel.app

Features

• URL Input: Users can input the URL of the website they wish to capture.
• Screenshot Capture: The application processes the URL and returns a screenshot of the specified web page.
• Responsive Design: The interface is optimized for various devices using Tailwind CSS.

Getting Started

Prerequisites

Ensure you have the following installed:

• Node.js (version 14 or higher)
• npm or yarn

Installation

1. Clone the repository:

   git clone https://github.com/ehmasuk/screen-cap.git
   

2. Navigate to the project directory:

   cd screen-cap
   

3. Install dependencies:

   Using npm:

   npm install
   

   Or using yarn:

   yarn install
   

Development

To start the development server:

Using npm:

npm run dev

Or using yarn:

yarn dev

Open http://localhost:3000 in your browser to view the application.

Building for Production

To build the application for production:

Using npm:

npm run build

Or using yarn:

yarn build

This will generate an optimized build in the .next directory.

Starting the Production Server

After building the application, you can start the production server:

Using npm:

npm start

Or using yarn:

yarn start

Project Structure

• app/: Contains the main application components and pages.
• components/: Reusable UI components.
• helpers/: Utility functions and helpers.
• hooks/: Custom React hooks.
• lib/: External libraries and configurations.

Technologies Used

• Next.js: React framework for server-side rendering and static site generation.
• Tailwind CSS: Utility-first CSS framework for styling.
• TypeScript: Superset of JavaScript for type safety.
• Puppeteer: Node.js library for headless browser automation, used for capturing screenshots.

Contributing

Contributions are welcome! Please fork the repository and create a pull request with your changes.

License

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

Acknowledgements

• Vercel: Hosting platform for the live application.