➡️Searchify 🚀🔥

Searchify is a React.js application that utilizes Tailwind CSS and the Google Custom Search API to create an interactive and visually appealing search engine. This project focuses on incorporating core concepts of React.js such as JSX, components, props, state management, lifecycle methods, conditional rendering, lists, keys, and the Context API. Furthermore, it employs advanced JavaScript logic to enhance the interactivity and aesthetics of the application.

Features 🌐

• Utilizes React.js for efficient component-based development.
• Integrates Tailwind CSS for a modern and responsive design.
• Implements the Google Custom Search API to fetch search results.
• Utilizes JSX for declarative UI rendering.
• Manages component data and behavior through props and state.
• Utilizes React's lifecycle methods for managing component behavior.
• Implements conditional rendering for dynamic UI updates.
• Utilizes lists and keys for efficient rendering of dynamic content.
• Utilizes the Context API for state management across components.

Getting Started 🔰

Follow these instructions to get a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites

• Node.js installed on your machine
• Google Custom Search API key
• Google Custom Search Engine ID

Installation

1. Clone the repository:

git clone https://github.com/your-username/Searchify.git

2. Navigate to the project directory:

cd Searchify

3. Install dependencies:

cd Searchify

Configuration

1. Obtain a Google Custom Search API key from the Google Cloud Console.
2. Create a Custom Search Engine and obtain the Search Engine ID from the Google Custom Search Control Panel.

Usage

1. Replace the placeholder values in the .env.example file with your Google Custom 2. Search API key and Custom Search Engine ID. Rename the .env.example file to .env.

REACT_APP_GOOGLE_API_KEY=your_api_key
REACT_APP_SEARCH_ENGINE_ID=your_search_engine_id

1. Start the development server:

npm start

1. Open your browser and visit http://localhost:3000 to view the application.

Built With 👨‍💻

1. React.js - JavaScript library for building user interfaces
2. Tailwind CSS - A utility-first CSS framework
3. Google Custom Search API - A programmatic way to use Google Search for your website or app
4. JavaScript - make our react application super interactive

Authors

Sayan Dutta - Initial work