Skip to content

akshaykamath45/google-clone

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

17 Commits
 
 
 
 
 
 

Repository files navigation

Google Clone

image

This is a Google Clone application built with React JS. It replicates the functionality of the Google search engine, providing a home page, search component, and search results page.

Features

  • Home Page: The application displays a home page similar to the Google search page, with a search bar and buttons.
  • Search Component: Users can enter search queries in the search bar and click the search button to initiate a search.
  • Search Page: The application displays search results instantly without refreshing the page, providing a list of search results with page titles, snippets, and links.

Technologies Used

  • React JS: The application is built using React JS library, enabling efficient and modular UI components.
  • Material UI: The Material UI library is used for styling the UI components and providing a modern and responsive design.
  • React Router: React Router is utilized for handling routing within the application, allowing navigation between different pages.
  • Context API: The Context API is used for state management, allowing data sharing between components using a global state.
  • Google Custom Search API: The application makes use of the Google Custom Search API to fetch search results based on user queries.
  • Firebase: Firebase is used to set up the app and connect it to Google services, facilitating authentication and other backend functionalities.

Setup Instructions

  1. Clone the repository:

    git clone https://github.com/akshaykamath45/Google-Clone.git
    
  2. Navigate to the project directory:

    cd google-clone
    
  3. Install Dependencies:

     npm install
    
  4. Start the development server:

    npm start
    
  5. Open the Application in your browser at https://localhost:3000

Usage

  • Enter your search query in the search bar on the home page.
  • Click the search button or press Enter to initiate the search.
  • The application will display search results instantly on the search results page.
  • Click on a search result to visit the corresponding website.

Screenshots

Desktop View

Home Page
image

Search Page
image

Mobile View

Home Page
image

Search Page
image