Google Search Clone

This project contains a clone which emulates the User Interface (UI) of Google Search, Google Image, and Google Advanced Search. It also contains dark & light modes.

Table of Contents

1. Demonstration
2. Prerequisites
3. Getting Started
4. Contributing
5. Acknowledgements

Demonstration

The light mode conforms to the user's operating system. If it is light, application's UI should render in light mode, if dark, it should render in dark mode.

Note that to change the light mode, navigate to Settings > Personalisation > Colours where you can toggle and choose your colour.

Prerequisites

Before getting started, it is required to download & install the following:

• Nodejs LTS or current version works fine. It must be above version 14.

Getting Started

It is required to clone or fork this project to get started.

Clone this project by running the following command:

git clone https://github.com/cesarcode-init/google-search-clone.git

Then change directory:

cd google-search-clone

The application depends on multiple npm packages. To install these dependencies, run npm i or npm install.

npm install

To open the application in the browser, it is required to run the following command in the terminal:

npm start

The application should open at http://localhost:3000 in the development mode.

This application comes pre-configured, which made possible by Webpack 5, and comes with hot reload options. The pages will reload if you make changes through javascript files.

To construct the build folder, run the following command:

npm run build

Contributing

To contribute to this project, the following steps are required:

1. Clone the repository:

git clone https://github.com/cesarcode-init/google-search-clone.git

2. Create a new branch:

git checkout -b BRANCH_NAME

3. Make the modifications.

4. Submit a Pull Request providing a description of modifications.

Acknowledgements

• React Icons.

License

This project is licensed under the MIT license.
Copyright © 2022, Kaissar Mouelhi

(back to top)